diff --git a/e2e/components/CounterLabel.test.ts b/e2e/components/CounterLabel.test.ts index 6d32cec228d..6b18f0fe40c 100644 --- a/e2e/components/CounterLabel.test.ts +++ b/e2e/components/CounterLabel.test.ts @@ -11,10 +11,6 @@ const stories = [ title: 'Primary Theme', id: 'components-counterlabel--primary-theme', }, - { - title: 'Primary Theme', - id: 'components-counterlabel--primary-theme', - }, { title: 'Secondary Theme', id: 'components-counterlabel--secondary-theme', diff --git a/packages/react/src/CounterLabel/__snapshots__/CounterLabel.test.tsx.snap b/packages/react/src/CounterLabel/__snapshots__/CounterLabel.test.tsx.snap index 13e2e5b859e..d811fe66a08 100644 --- a/packages/react/src/CounterLabel/__snapshots__/CounterLabel.test.tsx.snap +++ b/packages/react/src/CounterLabel/__snapshots__/CounterLabel.test.tsx.snap @@ -1,39 +1,35 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`CounterLabel renders with secondary scheme when no "scheme" prop is provided 1`] = ` +.c1:not(:focus):not(:active):not(:focus-within) { + -webkit-clip-path: inset(50%); + clip-path: inset(50%); + height: 1px; + overflow: hidden; + position: absolute; + white-space: nowrap; + width: 1px; +} + .c0 { display: inline-block; padding: 2px 5px; font-size: 12px; font-weight: bold; - line-height: condensedUltra; + line-height: 1; border-radius: 20px; - background-color: neutral.muted; border: var(--borderWidth-thin,max(1px,0.0625rem)) solid var(--counter-borderColor,var(--color-counter-border)); - color: fg.default; } .c0:empty { display: none; } -.c1 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - white-space: nowrap; - border-width: 0; -} -
@@ -48,39 +44,35 @@ exports[`CounterLabel renders with secondary scheme when no "scheme" prop is pro `; exports[`CounterLabel respects the primary "scheme" prop 1`] = ` +.c1:not(:focus):not(:active):not(:focus-within) { + -webkit-clip-path: inset(50%); + clip-path: inset(50%); + height: 1px; + overflow: hidden; + position: absolute; + white-space: nowrap; + width: 1px; +} + .c0 { display: inline-block; padding: 2px 5px; font-size: 12px; font-weight: bold; - line-height: condensedUltra; + line-height: 1; border-radius: 20px; - background-color: neutral.emphasis; border: var(--borderWidth-thin,max(1px,0.0625rem)) solid var(--counter-borderColor,var(--color-counter-border)); - color: fg.onEmphasis; } .c0:empty { display: none; } -.c1 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - white-space: nowrap; - border-width: 0; -} -
diff --git a/packages/react/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap b/packages/react/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap index d25b5d9a2d2..02e48cf533e 100644 --- a/packages/react/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap +++ b/packages/react/src/__tests__/__snapshots__/TextInputWithTokens.test.tsx.snap @@ -813,19 +813,6 @@ exports[`TextInputWithTokens renders a truncated set of tokens 1`] = ` flex-grow: 1; } -.c7 { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - -webkit-clip: rect(0,0,0,0); - clip: rect(0,0,0,0); - white-space: nowrap; - border-width: 0; -} - .c9 { font-size: 16px; color: var(--fgColor-muted,var(--color-fg-muted,#656d76)); @@ -862,6 +849,19 @@ exports[`TextInputWithTokens renders a truncated set of tokens 1`] = ` font-weight: var(--base-text-weight-semibold,600); } +.c7 { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + -webkit-clip: rect(0,0,0,0); + clip: rect(0,0,0,0); + white-space: nowrap; + border-width: 0; +} + .c0 { font-size: 14px; line-height: 20px;