@vellira-ui/tokens 2.31.0 → 2.33.0

package/dist/dark/components/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/dark/components/select.ts"],"names":[],"mappings":"AAyEA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyLT,CAAC"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/dark/components/select.ts"],"names":[],"mappings":"AA0EA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoOT,CAAC"}

package/dist/dark/components/select.js

@@ -6,6 +6,7 @@ import { control } from '../semantic/control.js';
 import { focus } from '../semantic/focus.js';
 import { icons } from '../semantic/icons.js';
 import { menu } from '../semantic/menu.js';
+import { shadow } from '../semantic/shadow.js';
 import { status } from '../semantic/status.js';
 import { surface } from '../semantic/surface.js';
 import { text } from '../semantic/text.js';
@@ -68,47 +69,82 @@ export const select = {
     primary: createSelectPalette(primary, {
         dropdownBorder: 'transparent',
         optionActiveBorder: 'transparent',
+        optionActiveBg: colors.vellira[850],
+        optionActiveFg: text.primary,
         optionActiveRing: 'transparent',
+        optionHoverBg: colors.vellira[700],
         optionHoverBorder: 'transparent',
-        optionPressedBg: colors.primary[700],
+        optionHoverFg: menu.item.hover.fg,
+        optionPressedBg: colors.vellira[900],
         optionPressedBorder: 'transparent',
+        optionSelectedActiveBg: colors.vellira[850],
+        optionSelectedHoverBg: colors.vellira[700],
+        optionSelectedPressedBg: colors.vellira[900],
         optionSelectedBg: colors.primary[800],
     }),
     neutral: createSelectPalette(neutral, {
         dropdownBorder: 'transparent',
         optionActiveBorder: 'transparent',
+        optionActiveBg: colors.vellira[850],
+        optionActiveFg: text.primary,
         optionActiveRing: 'transparent',
+        optionHoverBg: colors.vellira[700],
         optionHoverBorder: 'transparent',
-        optionPressedBg: colors.vellira[800],
+        optionHoverFg: menu.item.hover.fg,
+        optionPressedBg: colors.vellira[900],
         optionPressedBorder: 'transparent',
-        optionSelectedBg: colors.vellira[850],
+        optionSelectedActiveBg: colors.vellira[850],
+        optionSelectedHoverBg: colors.vellira[700],
+        optionSelectedPressedBg: colors.vellira[900],
+        optionSelectedBg: colors.vellira[600],
     }),
     success: createSelectPalette(success, {
         dropdownBorder: 'transparent',
         optionActiveBorder: 'transparent',
+        optionActiveBg: colors.success[900],
+        optionActiveFg: text.primary,
         optionActiveRing: 'transparent',
+        optionHoverBg: colors.success[800],
         optionHoverBorder: 'transparent',
-        optionPressedBg: colors.success[800],
+        optionHoverFg: menu.item.hover.fg,
+        optionPressedBg: colors.success[950],
         optionPressedBorder: 'transparent',
-        optionSelectedBg: colors.success[900],
+        optionSelectedActiveBg: colors.success[900],
+        optionSelectedHoverBg: colors.success[800],
+        optionSelectedPressedBg: colors.success[950],
+        optionSelectedBg: colors.success[700],
     }),
     warning: createSelectPalette(warning, {
         dropdownBorder: 'transparent',
         optionActiveBorder: 'transparent',
+        optionActiveBg: colors.warning[900],
+        optionActiveFg: text.primary,
         optionActiveRing: 'transparent',
+        optionHoverBg: colors.warning[800],
         optionHoverBorder: 'transparent',
-        optionPressedBg: colors.warning[800],
+        optionHoverFg: menu.item.hover.fg,
+        optionPressedBg: colors.warning[950],
         optionPressedBorder: 'transparent',
-        optionSelectedBg: colors.warning[900],
+        optionSelectedActiveBg: colors.warning[900],
+        optionSelectedHoverBg: colors.warning[800],
+        optionSelectedPressedBg: colors.warning[950],
+        optionSelectedBg: colors.warning[700],
     }),
     danger: createSelectPalette(danger, {
         dropdownBorder: 'transparent',
         optionActiveBorder: 'transparent',
+        optionActiveBg: colors.error[900],
+        optionActiveFg: text.primary,
         optionActiveRing: 'transparent',
+        optionHoverBg: colors.error[800],
         optionHoverBorder: 'transparent',
-        optionPressedBg: colors.error[800],
+        optionHoverFg: menu.item.hover.fg,
+        optionPressedBg: colors.error[950],
         optionPressedBorder: 'transparent',
-        optionSelectedBg: colors.error[900],
+        optionSelectedActiveBg: colors.error[900],
+        optionSelectedHoverBg: colors.error[800],
+        optionSelectedPressedBg: colors.error[950],
+        optionSelectedBg: colors.error[700],
     }),
     trigger: {
         default: {
@@ -148,7 +184,7 @@ export const select = {
         bg: menu.background,
         fg: menu.item.default.fg,
         border: 'transparent',
-        shadow: 'none',
+        shadow: shadow.lg,
         search: {
             bg: surface.default,
             fg: text.primary,
@@ -166,6 +202,13 @@ export const select = {
             bg: border.muted,
         },
     },
+    clearButton: {
+        fg: icons.muted,
+        hoverFg: status.error.fg,
+        hoverBg: status.error.bg,
+        focusBg: surface.subtle,
+        pressedBg: surface.active,
+    },
     option: {
         default: {
             bg: menu.item.default.bg,
@@ -178,14 +221,14 @@ export const select = {
             border: 'transparent',
         },
         active: {
-            bg: menu.item.active.bg,
-            fg: menu.item.active.fg,
+            bg: colors.vellira[600],
+            fg: text.primary,
             border: 'transparent',
             ring: 'transparent',
         },
         pressed: {
-            bg: menu.item.pressed.bg,
-            fg: menu.item.pressed.fg,
+            bg: colors.vellira[850],
+            fg: text.primary,
             border: 'transparent',
         },
         selected: {

package/dist/dark/theme.d.ts

@@ -192,11 +192,11 @@ export declare const darkTheme: {
         };
         readonly typography: {
             readonly family: {
-                readonly base: "KantumruyPro, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif";
-                readonly extraLight: "KantumruyPro-ExtraLight";
-                readonly regular: "KantumruyPro-Regular";
-                readonly medium: "KantumruyPro-Medium";
-                readonly semibold: "KantumruyPro-SemiBold";
+                readonly base: "VelliraSans, Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif";
+                readonly extraLight: "VelliraSans-ExtraLight";
+                readonly regular: "VelliraSans-Regular";
+                readonly medium: "VelliraSans-Medium";
+                readonly semibold: "VelliraSans-SemiBold";
             };
             readonly size: {
                 readonly xs: 12;
@@ -209,8 +209,8 @@ export declare const darkTheme: {
             readonly weight: {
                 readonly light: "200";
                 readonly regular: "400";
-                readonly medium: "600";
-                readonly semibold: "700";
+                readonly medium: "500";
+                readonly semibold: "600";
             };
             readonly lineHeight: {
                 readonly xs: 16;

package/dist/factories/createDropdownPalette.d.ts

@@ -0,0 +1,69 @@
+import type { createInputColorPalette } from './createInputPalette.js';
+type DropdownBasePalette = ReturnType<typeof createInputColorPalette>;
+type DropdownPaletteConfig = {
+    contentBorder?: string;
+    itemActiveBg?: string;
+    itemActiveFg?: string;
+    itemActiveRing?: string;
+    itemHoverBg?: string;
+    itemHoverFg?: string;
+    itemPressedBg?: string;
+    itemPressedFg?: string;
+    itemFg?: string;
+    itemBadgeBg?: string;
+    itemBadgeFg?: string;
+    itemBadgeBorder?: string;
+};
+export declare const createDropdownPalette: (palette: DropdownBasePalette, config?: DropdownPaletteConfig) => {
+    readonly ring: string;
+    readonly content: {
+        readonly border: string;
+        readonly ring: string;
+    };
+    readonly trigger: {
+        readonly default: {
+            readonly fg: string;
+            readonly border: "transparent";
+            readonly bg: string;
+            readonly placeholder: string;
+            readonly icon: string;
+        };
+        readonly hover: {
+            readonly bg: "transparent";
+            readonly fg: string;
+            readonly border: "transparent";
+            readonly placeholder: string;
+            readonly icon: string;
+        };
+        readonly focus: {
+            readonly fg: string;
+            readonly border: "transparent";
+            readonly bg: string;
+            readonly placeholder: string;
+            readonly icon: string;
+        };
+    };
+    readonly item: {
+        readonly fg: string;
+        readonly active: {
+            readonly bg: string;
+            readonly fg: string;
+            readonly ring: string;
+        };
+        readonly hover: {
+            readonly bg: string;
+            readonly fg: string;
+        };
+        readonly pressed: {
+            readonly bg: string;
+            readonly fg: string;
+        };
+        readonly badge: {
+            readonly bg: string;
+            readonly fg: string;
+            readonly border: string;
+        };
+    };
+};
+export {};
+//# sourceMappingURL=createDropdownPalette.d.ts.map

package/dist/factories/createDropdownPalette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createDropdownPalette.d.ts","sourceRoot":"","sources":["../../src/factories/createDropdownPalette.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAEvE,KAAK,mBAAmB,GAAG,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;AACtE,KAAK,qBAAqB,GAAG;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAChC,SAAS,mBAAmB,EAC5B,SAAQ,qBAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+CvB,CAAC"}

package/dist/factories/createDropdownPalette.js

@@ -0,0 +1,46 @@
+export const createDropdownPalette = (palette, config = {}) => ({
+    ring: palette.ring,
+    content: {
+        border: config.contentBorder ?? palette.outline.default.border,
+        ring: palette.ring,
+    },
+    trigger: {
+        default: {
+            ...palette.outline.default,
+            fg: palette.outline.default.icon,
+            border: 'transparent',
+        },
+        hover: {
+            ...palette.outline.hover,
+            bg: 'transparent',
+            fg: palette.outline.hover.icon,
+            border: 'transparent',
+        },
+        focus: {
+            ...palette.outline.focus,
+            fg: palette.outline.focus.icon,
+            border: 'transparent',
+        },
+    },
+    item: {
+        fg: config.itemFg ?? palette.outline.default.border,
+        active: {
+            bg: config.itemActiveBg ?? palette.outline.hover.bg,
+            fg: config.itemActiveFg ?? palette.outline.hover.fg,
+            ring: config.itemActiveRing ?? palette.ring,
+        },
+        hover: {
+            bg: config.itemHoverBg ?? palette.outline.hover.bg,
+            fg: config.itemHoverFg ?? palette.outline.hover.fg,
+        },
+        pressed: {
+            bg: config.itemPressedBg ?? palette.outline.focus.bg,
+            fg: config.itemPressedFg ?? palette.outline.focus.fg,
+        },
+        badge: {
+            bg: config.itemBadgeBg ?? palette.soft.default.bg,
+            fg: config.itemBadgeFg ?? palette.soft.default.fg,
+            border: config.itemBadgeBorder ?? palette.soft.default.border,
+        },
+    },
+});

package/dist/factories/createSelectPalette.d.ts

@@ -1,8 +1,10 @@
 import type { createInputColorPalette } from './createInputPalette.js';
 type SelectBasePalette = ReturnType<typeof createInputColorPalette>;
 type SelectPaletteConfig = {
+    optionActiveBg?: string;
     dropdownBorder?: string;
     optionActiveBorder?: string;
+    optionActiveFg?: string;
     optionActiveRing?: string;
     optionHoverBg?: string;
     optionHoverBorder?: string;
@@ -10,8 +12,18 @@ type SelectPaletteConfig = {
     optionPressedBg?: string;
     optionPressedBorder?: string;
     optionPressedFg?: string;
+    optionSelectedActiveBg?: string;
+    optionSelectedActiveBorder?: string;
+    optionSelectedActiveFg?: string;
     optionSelectedBg?: string;
     optionSelectedBorder?: string;
+    optionSelectedFg?: string;
+    optionSelectedHoverBg?: string;
+    optionSelectedHoverBorder?: string;
+    optionSelectedHoverFg?: string;
+    optionSelectedPressedBg?: string;
+    optionSelectedPressedBorder?: string;
+    optionSelectedPressedFg?: string;
 };
 export declare const createSelectPalette: (palette: SelectBasePalette, config?: SelectPaletteConfig) => {
     readonly ring: string;
@@ -37,6 +49,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -73,6 +101,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -109,6 +153,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -146,6 +206,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -182,6 +258,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -218,6 +310,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -255,6 +363,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -291,6 +415,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;
@@ -327,6 +467,22 @@ export declare const createSelectPalette: (palette: SelectBasePalette, config?:
                 fg: string;
                 border: string;
             };
+            selectedHover: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
+            selectedActive: {
+                bg: string;
+                fg: string;
+                border: string;
+                ring: string;
+            };
+            selectedPressed: {
+                bg: string;
+                fg: string;
+                border: string;
+            };
             pressed: {
                 bg: string;
                 fg: string;

package/dist/factories/createSelectPalette.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createSelectPalette.d.ts","sourceRoot":"","sources":["../../src/factories/createSelectPalette.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAEvE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAEpE,KAAK,mBAAmB,GAAG;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,CAAC;AA0CF,eAAO,MAAM,mBAAmB,GAC9B,SAAS,iBAAiB,EAC1B,SAAQ,mBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOrB,CAAC"}
+{"version":3,"file":"createSelectPalette.d.ts","sourceRoot":"","sources":["../../src/factories/createSelectPalette.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAC;AAEvE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAEpE,KAAK,mBAAmB,GAAG;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,0BAA0B,CAAC,EAAE,MAAM,CAAC;IACpC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,2BAA2B,CAAC,EAAE,MAAM,CAAC;IACrC,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC,CAAC;AA8DF,eAAO,MAAM,mBAAmB,GAC9B,SAAS,iBAAiB,EAC1B,SAAQ,mBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOrB,CAAC"}

package/dist/factories/createSelectPalette.js

@@ -1,38 +1,57 @@
-const createSelectVariant = (palette, variant, config) => ({
-    ...palette[variant],
-    dropdown: {
-        border: config.dropdownBorder ?? palette.outline.default.border,
-        ring: palette.ring,
-    },
-    option: {
-        active: {
-            bg: palette[variant].hover.bg,
-            fg: palette[variant].hover.fg,
-            border: config.optionActiveBorder ?? palette[variant].hover.border,
-            ring: config.optionActiveRing ?? palette.ring,
+const createSelectVariant = (palette, variant, config) => {
+    const selected = {
+        bg: config.optionSelectedBg ?? palette.soft.default.bg,
+        fg: config.optionSelectedFg ?? palette.soft.default.fg,
+        border: config.optionSelectedBorder ?? palette.outline.default.border,
+    };
+    return {
+        ...palette[variant],
+        dropdown: {
+            border: config.dropdownBorder ?? palette.outline.default.border,
+            ring: palette.ring,
         },
-        hover: {
-            bg: config.optionHoverBg ?? palette[variant].hover.bg,
-            fg: config.optionHoverFg ?? palette[variant].hover.fg,
-            border: config.optionHoverBorder ?? palette[variant].hover.border,
+        option: {
+            active: {
+                bg: config.optionActiveBg ?? palette[variant].hover.bg,
+                fg: config.optionActiveFg ?? palette[variant].hover.fg,
+                border: config.optionActiveBorder ?? palette[variant].hover.border,
+                ring: config.optionActiveRing ?? palette.ring,
+            },
+            hover: {
+                bg: config.optionHoverBg ?? palette[variant].hover.bg,
+                fg: config.optionHoverFg ?? palette[variant].hover.fg,
+                border: config.optionHoverBorder ?? palette[variant].hover.border,
+            },
+            selected,
+            selectedHover: {
+                bg: config.optionSelectedHoverBg ?? selected.bg,
+                fg: config.optionSelectedHoverFg ?? selected.fg,
+                border: config.optionSelectedHoverBorder ?? selected.border,
+            },
+            selectedActive: {
+                bg: config.optionSelectedActiveBg ?? selected.bg,
+                fg: config.optionSelectedActiveFg ?? selected.fg,
+                border: config.optionSelectedActiveBorder ?? selected.border,
+                ring: config.optionActiveRing ?? palette.ring,
+            },
+            selectedPressed: {
+                bg: config.optionSelectedPressedBg ?? selected.bg,
+                fg: config.optionSelectedPressedFg ?? selected.fg,
+                border: config.optionSelectedPressedBorder ?? selected.border,
+            },
+            pressed: {
+                bg: config.optionPressedBg ?? palette[variant].focus.bg,
+                fg: config.optionPressedFg ?? palette[variant].focus.fg,
+                border: config.optionPressedBorder ?? palette[variant].focus.border,
+            },
+            badge: {
+                bg: palette.soft.default.bg,
+                fg: palette.soft.default.fg,
+                border: palette.soft.default.border,
+            },
         },
-        selected: {
-            bg: config.optionSelectedBg ?? palette.soft.default.bg,
-            fg: palette.soft.default.fg,
-            border: config.optionSelectedBorder ?? palette.outline.default.border,
-        },
-        pressed: {
-            bg: config.optionPressedBg ?? palette[variant].focus.bg,
-            fg: config.optionPressedFg ?? palette[variant].focus.fg,
-            border: config.optionPressedBorder ?? palette[variant].focus.border,
-        },
-        badge: {
-            bg: palette.soft.default.bg,
-            fg: palette.soft.default.fg,
-            border: palette.soft.default.border,
-        },
-    },
-});
+    };
+};
 export const createSelectPalette = (palette, config = {}) => ({
     ring: palette.ring,
     outline: createSelectVariant(palette, 'outline', config),