@cube-dev/ui-kit 0.0.0-canary-378ade6 → 0.0.0-canary-91a40f7

package/types/components/actions/Button/Button.d.ts

@@ -59,498 +59,50 @@ export declare const DEFAULT_BUTTON_STYLES: {
         readonly '[data-type="link"] & !focused': 0;
     };
 };
-export declare const DEFAULT_PRIMARY_STYLES: {
+export declare const DEFAULT_THEME_STYLES: {
     readonly outline: {
         readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly pressed: "#purple-text";
-        readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#purple";
-        readonly hovered: "#purple-text";
-        readonly pressed: "#purple";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DEFAULT_SECONDARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "#purple.15";
-        readonly pressed: "#purple.3";
-        readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#purple.10";
-        readonly hovered: "#purple.16";
-        readonly pressed: "#purple-text.10";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#purple";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DEFAULT_OUTLINE_STYLES: {
-    readonly outline: {
-        readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "#dark.12";
+        readonly 'focused & ([data-type="primary"] | [data-type="link"])': "1bw #purple-text";
+    };
+    readonly border: {
+        readonly '': "#border";
+        readonly '[data-type="primary"]': "#clear";
+        readonly '[data-type="primary"] & pressed': "#purple-text";
+        readonly '[data-type="secondary"]': "#purple.15";
+        readonly '[data-type="secondary"] & pressed': "#purple.3";
+        readonly '[data-type="clear"]': "#clear";
+        readonly '[data-type="clear"] & pressed': "#purple-text.10";
+        readonly '[data-type="outline"]': "#dark.12";
+        readonly '[data-type="neutral"] | [disabled]': "#clear";
         readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#dark.0";
-        readonly hovered: "#dark.03";
-        readonly 'pressed | selected': "#dark.06";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#dark-02";
-        readonly hovered: "#dark-02";
-        readonly pressed: "#dark";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DEFAULT_NEUTRAL_STYLES: {
-    readonly outline: {
-        readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#dark.0";
-        readonly hovered: "#dark.03";
-        readonly 'pressed | selected': "#dark.06";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#dark-02";
-        readonly hovered: "#dark-02";
-        readonly pressed: "#dark";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DEFAULT_CLEAR_STYLES: {
-    readonly outline: {
-        readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly pressed: "#purple-text.10";
-        readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#purple.0";
-        readonly hovered: "#purple.16";
-        readonly pressed: "#purple.10";
-        readonly '[disabled]': "#purple.0";
-    };
-    readonly color: {
-        readonly '': "#purple-text";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DEFAULT_LINK_STYLES: {
-    readonly outline: {
-        readonly '': "0 #purple-text.0";
-        readonly focused: "1bw #purple-text";
-    };
-    readonly border: {
-        readonly '': "0";
-        readonly focused: "#purple-text";
-    };
-    readonly fill: {
-        readonly '': "#clear";
-    };
-    readonly color: {
-        readonly '': "#purple-text";
-        readonly pressed: "#purple";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_PRIMARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly pressed: "#danger-text";
-        readonly focused: "#danger-text";
-    };
-    readonly fill: {
-        readonly '': "#danger";
-        readonly hovered: "#danger-text";
-        readonly pressed: "#danger";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_SECONDARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#danger.15";
-        readonly pressed: "#danger.3";
-        readonly focused: "#danger-text";
-    };
-    readonly fill: {
-        readonly '': "#danger.05";
-        readonly hovered: "#danger.1";
-        readonly pressed: "#danger.05";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_OUTLINE_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#danger.15";
-        readonly pressed: "#danger.3";
-        readonly focused: "#danger-text";
-    };
-    readonly fill: {
-        readonly '': "#danger.0";
-        readonly hovered: "#danger.1";
-        readonly pressed: "#danger.05";
-        readonly '[disabled]': "#danger.0";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_NEUTRAL_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#danger-text";
-    };
-    readonly fill: {
-        readonly '': "#dark.0";
-        readonly hovered: "#dark.04";
-        readonly pressed: "#dark.05";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_CLEAR_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#danger-text";
-    };
-    readonly fill: {
-        readonly '': "#danger.0";
-        readonly hovered: "#danger.1";
-        readonly pressed: "#danger.05";
-        readonly '[disabled]': "#danger.0";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const DANGER_LINK_STYLES: {
-    readonly outline: {
-        readonly '': "0 #danger-text.0";
-        readonly focused: "1bw #danger-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#danger-text";
+        readonly '[data-type="link"]': "0";
     };
     readonly fill: {
         readonly '': "#clear";
-        readonly '[disabled]': "#dark.04";
+        readonly '[data-type="primary"]': "#purple";
+        readonly '[data-type="primary"] & hovered': "#purple-text";
+        readonly '[data-type="primary"] & pressed': "#purple";
+        readonly '[data-type="secondary"]': "#purple.10";
+        readonly '[data-type="secondary"] & hovered': "#purple.16";
+        readonly '[data-type="secondary"] & pressed': "#purple-text.10";
+        readonly '[data-type="neutral"] | [data-type="outline"]': "#dark.0";
+        readonly '([data-type="neutral"] | [data-type="outline"]) & hovered': "#dark.03";
+        readonly '([data-type="neutral"] | [data-type="outline"]) & (pressed | selected)': "#dark.06";
+        readonly '[disabled] & ![data-type="link"]': "#dark.04";
+        readonly '[data-type="clear"]': "#purple.0";
+        readonly '[data-type="clear"] & hovered': "#purple.16";
+        readonly '[data-type="clear"] & pressed': "#purple.10";
+        readonly '[data-type="clear"] & [disabled]': "#purple.0";
     };
     readonly color: {
         readonly '': "#white";
+        readonly '[data-type="secondary"]': "#purple";
+        readonly '[data-type="clear"] | [data-type="link"]': "#purple-text";
+        readonly '[data-type="link"] & pressed': "#purple";
+        readonly '[data-type="neutral"] | [data-type="outline"]': "#dark-02";
+        readonly '([data-type="neutral"] | [data-type="outline"]) & hovered': "#dark-02";
+        readonly '([data-type="neutral"] | [data-type="outline"]) & pressed': "#dark";
         readonly '[disabled]': "#dark.30";
     };
 };
-export declare const SUCCESS_PRIMARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly pressed: "#success-text";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#success";
-        readonly hovered: "#success-text";
-        readonly pressed: "#success";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SUCCESS_SECONDARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#success.15";
-        readonly pressed: "#success.3";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#success.05";
-        readonly hovered: "#success.1";
-        readonly pressed: "#success.05";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#success";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SUCCESS_OUTLINE_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#success.15";
-        readonly pressed: "#success.3";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#success.0";
-        readonly hovered: "#success.1";
-        readonly pressed: "#success.05";
-        readonly '[disabled]': "#success.0";
-    };
-    readonly color: {
-        readonly '': "#success-text";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SUCCESS_NEUTRAL_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#dark.0";
-        readonly hovered: "#dark.04";
-        readonly pressed: "#dark.05";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#dark-02";
-        readonly hovered: "#dark-02";
-        readonly pressed: "#success";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SUCCESS_CLEAR_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#success.0";
-        readonly hovered: "#success.1";
-        readonly pressed: "#success.05";
-        readonly '[disabled]': "#success.0";
-    };
-    readonly color: {
-        readonly '': "#success-text";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SUCCESS_LINK_STYLES: {
-    readonly outline: {
-        readonly '': "0 #success-text.0";
-        readonly focused: "1bw #success-text";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#success-text";
-    };
-    readonly fill: {
-        readonly '': "#clear";
-        readonly '[disabled]': "#dark.04";
-    };
-    readonly color: {
-        readonly '': "#success-text";
-        readonly pressed: "#success";
-        readonly '[disabled]': "#dark.30";
-    };
-};
-export declare const SPECIAL_PRIMARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly pressed: "#purple-03";
-    };
-    readonly fill: {
-        readonly '': "#purple";
-        readonly pressed: "#purple";
-        readonly hovered: "#purple-text";
-        readonly '[disabled]': "#white.12";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#white.30";
-    };
-};
-export declare const SPECIAL_SECONDARY_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': "#white.3";
-        readonly pressed: "#white.4";
-        readonly focused: "#white";
-    };
-    readonly fill: {
-        readonly '': "#white.12";
-        readonly hovered: "#white.18";
-        readonly pressed: "#white.12";
-        readonly '[disabled]': "#white.12";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#white.30";
-    };
-};
-export declare const SPECIAL_OUTLINE_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': "#white.3";
-        readonly '!pressed': "#white.3";
-        readonly focused: "#white";
-        readonly '[disabled]': "#white.3";
-    };
-    readonly fill: {
-        readonly '': "#white.0";
-        readonly hovered: "#white.18";
-        readonly pressed: "#white.12";
-        readonly '[disabled]': "#white.0";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#white.30";
-    };
-};
-export declare const SPECIAL_NEUTRAL_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly '!pressed': 0;
-        readonly focused: "#white";
-        readonly '[disabled]': "#white.3";
-    };
-    readonly fill: {
-        readonly '': "#white.0";
-        readonly hovered: "#white.18";
-        readonly pressed: "#white.12";
-        readonly '[disabled]': "#white.12";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#white.30";
-    };
-};
-export declare const SPECIAL_CLEAR_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': "#clear";
-        readonly focused: "#white";
-        readonly '[disabled]': "#white.3";
-    };
-    readonly fill: {
-        readonly '': "#white";
-        readonly hovered: "#white.94";
-        readonly pressed: "#white";
-        readonly '[disabled]': "#white.0";
-    };
-    readonly color: {
-        readonly '': "#purple";
-        readonly '[disabled]': "#white.30";
-    };
-};
-export declare const SPECIAL_LINK_STYLES: {
-    readonly outline: {
-        readonly '': "0 #white.0";
-        readonly focused: "1bw #white";
-    };
-    readonly border: {
-        readonly '': 0;
-        readonly focused: "#white";
-        readonly '[disabled]': "#white.3";
-    };
-    readonly fill: {
-        readonly '': "#clear";
-        readonly '[disabled]': "#white.12";
-    };
-    readonly color: {
-        readonly '': "#white";
-        readonly '[disabled]': "#white.30";
-    };
-};
 export declare const Button: import("react").ForwardRefExoticComponent<Omit<CubeButtonProps, "ref"> & import("react").RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLElement, HTMLElement>>>;

package/types/components/pickers/Menu/Menu.d.ts

@@ -4,7 +4,7 @@ import { AriaMenuProps } from 'react-aria';
 import { Section as BaseSection } from 'react-stately';
 import { BaseProps, ContainerStyleProps, Styles } from '../../../tasty';
 import { MenuButtonProps, MenuSelectionType } from './MenuButton';
-export interface CubeMenuProps<T> extends ContainerStyleProps, AriaMenuProps<T> {
+export interface CubeMenuProps<T> extends BaseProps, ContainerStyleProps, AriaMenuProps<T> {
     selectionIcon?: MenuSelectionType;
     header?: ReactNode;
     footer?: ReactNode;