@moderneinc/neo-styled-components 3.0.0-next.ff608c → 4.0.0-next.b43695

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -39,10 +39,7 @@ export interface NeoTabProps extends Omit<TabProps, 'label'> {
39
39
  *
40
40
  * Figma Props Mapping:
41
41
  * - Current=True/False → Controlled by parent NeoTabs value
42
- * - State=Defaultdefault styling
43
- * - State=Hover → CSS :hover
44
- * - State=Focus → CSS :focus-visible
45
- * - Tag count → count prop (renders NeoTag)
42
+ * - Show tag count prop (renders NeoTag)
46
43
  * - Text label → label prop
47
44
  */
48
45
  export declare const NeoTab: {
package/dist/index.d.ts CHANGED
@@ -2191,10 +2191,7 @@ interface NeoTabProps extends Omit<TabProps, 'label'> {
2191
2191
  *
2192
2192
  * Figma Props Mapping:
2193
2193
  * - Current=True/False → Controlled by parent NeoTabs value
2194
- * - State=Defaultdefault styling
2195
- * - State=Hover → CSS :hover
2196
- * - State=Focus → CSS :focus-visible
2197
- * - Tag count → count prop (renders NeoTag)
2194
+ * - Show tag count prop (renders NeoTag)
2198
2195
  * - Text label → label prop
2199
2196
  */
2200
2197
  declare const NeoTab: {
package/dist/index.esm.js CHANGED
@@ -6129,7 +6129,20 @@ const StyledTab = styled(MuiTab)(({ theme }) => ({
6129
6129
  color: semanticColors.typography.tab.active,
6130
6130
  fontWeight: typography.fontWeight.semiBold,
6131
6131
  },
6132
+ '&:hover': {
6133
+ backgroundColor: semanticColors.buttons.secondary.hoverBackground,
6134
+ [`&.${tabClasses.selected}::after`]: {
6135
+ content: '""',
6136
+ position: 'absolute',
6137
+ bottom: 0,
6138
+ left: 0,
6139
+ right: 0,
6140
+ height: 2,
6141
+ backgroundColor: semanticColors.buttons.primary.hover,
6142
+ },
6143
+ },
6132
6144
  [`&.${buttonBaseClasses.focusVisible}`]: {
6145
+ color: semanticColors.typography.tab.active,
6133
6146
  outline: `2px solid ${semanticColors.border.focus}`,
6134
6147
  outlineOffset: -2,
6135
6148
  },
@@ -6137,6 +6150,21 @@ const StyledTab = styled(MuiTab)(({ theme }) => ({
6137
6150
  color: semanticColors.typography.button.disabled,
6138
6151
  cursor: 'not-allowed',
6139
6152
  pointerEvents: 'auto',
6153
+ '&:hover': {
6154
+ backgroundColor: 'transparent',
6155
+ },
6156
+ [`&.${tabClasses.selected}`]: {
6157
+ color: semanticColors.typography.button.disabled,
6158
+ '&::after': {
6159
+ content: '""',
6160
+ position: 'absolute',
6161
+ bottom: 0,
6162
+ left: 0,
6163
+ right: 0,
6164
+ height: 2,
6165
+ backgroundColor: semanticColors.buttons.tertiary.disabled,
6166
+ },
6167
+ },
6140
6168
  },
6141
6169
  }));
6142
6170
  const TabLabelContainer = styled('span')(({ theme }) => ({
@@ -6151,10 +6179,7 @@ const TabLabelContainer = styled('span')(({ theme }) => ({
6151
6179
  *
6152
6180
  * Figma Props Mapping:
6153
6181
  * - Current=True/False → Controlled by parent NeoTabs value
6154
- * - State=Defaultdefault styling
6155
- * - State=Hover → CSS :hover
6156
- * - State=Focus → CSS :focus-visible
6157
- * - Tag count → count prop (renders NeoTag)
6182
+ * - Show tag count prop (renders NeoTag)
6158
6183
  * - Text label → label prop
6159
6184
  */
6160
6185
  const NeoTab = ({ label, count, ...props }) => {