@sytechui/theme 3.0.2 → 3.0.3

package/dist/types.d.ts

@@ -0,0 +1,138 @@
+import { ThemeColors } from './colors/types.js';
+
+type DefaultThemeType = "light" | "dark";
+type BaseThemeUnit = {
+    small?: string;
+    medium?: string;
+    large?: string;
+};
+type FontThemeUnit = BaseThemeUnit & {
+    tiny?: string;
+};
+interface LayoutTheme {
+    /**
+     * The default font size applied across the components.
+     *
+     * @default
+     * {
+     *    tiny: "0.75rem",
+     *    small: "0.875rem",
+     *    medium: "1rem",
+     *    large: "1.125rem",
+     *    DEFAULT: "1rem",
+     * }
+     */
+    fontSize?: FontThemeUnit;
+    /**
+     * The default line height applied across the components.
+     *
+     * @default
+     * {
+     *    tiny: "1rem",
+     *    small: "1.25rem",
+     *    medium: "1.5rem",
+     *    large: "1.75rem",
+     *    DEFAULT: "1.5rem",
+     * }
+     */
+    lineHeight?: FontThemeUnit;
+    /**
+     * The default radius applied across the components.
+     * we recommend to use `rem` units.
+     *
+     * @default
+     * {
+     *   small: "0.25rem",
+     *   medium: "0.5rem",
+     *   large: "0.75rem",
+     * }
+     */
+    radius?: BaseThemeUnit;
+    /**
+     * A number between 0 and 1 that is applied as opacity-[value] when the component is disabled.
+     *
+     * format: ".[value]"
+     *
+     * @default .5
+     */
+    disabledOpacity?: string | number;
+    /**
+     * A number between 0 and 1 that is applied as opacity-[value] when the component is hovered.
+     *
+     * format: ".[value]"
+     *
+     * @default .8
+     */
+    hoverOpacity?: string | number;
+    /**
+     * The default height applied to the divider component.
+     * we recommend to use `px` units.
+     *
+     * @default 1px
+     */
+    dividerWeight?: string;
+    /**
+     * The border width applied across the components.
+     * @default
+     * {
+     *    small: "1px",
+     *    medium: "2px",
+     *    large: "3px",
+     * }
+     *
+     */
+    borderWidth?: BaseThemeUnit;
+    /**
+     * The box shadow applied across the components.
+     *
+     * @default
+     * {
+     *   small: 0px 0px 5px 0px rgb(0 0 0 / 0.01), 0px 2px 10px 0px rgb(0 0 0 / 0.06),
+     *   medium: 0px 0px 15px 0px rgb(0 0 0 / 0.02), 0px 2px 30px 0px rgb(0 0 0 / 0.08),
+     *   large: 0px 0px 30px 0px rgb(0 0 0 / 0.03), 0px 30px 60px 0px rgb(0 0 0 / 0.12),
+     * }
+     */
+    boxShadow?: BaseThemeUnit;
+}
+type ConfigTheme = {
+    extend?: "light" | "dark";
+    layout?: LayoutTheme;
+    colors?: Partial<ThemeColors>;
+};
+type ConfigThemes = Record<string, ConfigTheme>;
+/**
+ * The HeroUI config.
+ * @see https://heroui.com/docs/customization/customize-theme
+ */
+type HeroUIPluginConfig = {
+    /**
+     * The prefix for the css variables.
+     * @default "heroui"
+     */
+    prefix?: string;
+    /**
+     * If true, the common heroui colors (e.g. "blue", "green", "purple") will not be extended on the theme.
+     * @default false
+     */
+    addCommonColors?: boolean;
+    /**
+     * Common layout definitions. These definitions are applied to all themes.
+     */
+    layout?: LayoutTheme;
+    /**
+     * The theme definitions.
+     */
+    themes?: ConfigThemes;
+    /**
+     * The default theme to use.
+     * @default "light"
+     */
+    defaultTheme?: DefaultThemeType;
+    /**
+     * The default theme to extend.
+     * @default "light"
+     */
+    defaultExtendTheme?: DefaultThemeType;
+};
+
+export type { BaseThemeUnit, ConfigTheme, ConfigThemes, DefaultThemeType, FontThemeUnit, HeroUIPluginConfig, LayoutTheme };

package/dist/utilities/animation.d.mts

@@ -0,0 +1,16 @@
+declare const _default: {
+    /** Animation Utilities */
+    ".spinner-bar-animation": {
+        animation: string;
+        "animation-delay": string;
+        transform: string;
+    };
+    ".spinner-dot-animation": {
+        "animation-delay": string;
+    };
+    ".spinner-dot-blink-animation": {
+        "animation-delay": string;
+    };
+};
+
+export { _default as default };

package/dist/utilities/animation.d.ts

@@ -0,0 +1,16 @@
+declare const _default: {
+    /** Animation Utilities */
+    ".spinner-bar-animation": {
+        animation: string;
+        "animation-delay": string;
+        transform: string;
+    };
+    ".spinner-dot-animation": {
+        "animation-delay": string;
+    };
+    ".spinner-dot-blink-animation": {
+        "animation-delay": string;
+    };
+};
+
+export { _default as default };

package/dist/utilities/custom.d.mts

@@ -0,0 +1,27 @@
+declare const _default: {
+    /**
+     * Custom utilities
+     */
+    ".leading-inherit": {
+        "line-height": string;
+    };
+    ".bg-img-inherit": {
+        "background-image": string;
+    };
+    ".bg-clip-inherit": {
+        "background-clip": string;
+    };
+    ".text-fill-inherit": {
+        "-webkit-text-fill-color": string;
+    };
+    ".tap-highlight-transparent": {
+        "-webkit-tap-highlight-color": string;
+    };
+    ".input-search-cancel-button-none": {
+        "&::-webkit-search-cancel-button": {
+            "-webkit-appearance": string;
+        };
+    };
+};
+
+export { _default as default };

package/dist/utilities/custom.d.ts

@@ -0,0 +1,27 @@
+declare const _default: {
+    /**
+     * Custom utilities
+     */
+    ".leading-inherit": {
+        "line-height": string;
+    };
+    ".bg-img-inherit": {
+        "background-image": string;
+    };
+    ".bg-clip-inherit": {
+        "background-clip": string;
+    };
+    ".text-fill-inherit": {
+        "-webkit-text-fill-color": string;
+    };
+    ".tap-highlight-transparent": {
+        "-webkit-tap-highlight-color": string;
+    };
+    ".input-search-cancel-button-none": {
+        "&::-webkit-search-cancel-button": {
+            "-webkit-appearance": string;
+        };
+    };
+};
+
+export { _default as default };

package/dist/utilities/index.d.mts

@@ -0,0 +1,171 @@
+declare const utilities: {
+    ".sytech-shimmer-text": {
+        color: string;
+        "--shimmer-angle": string;
+        "--shimmer-spread": string;
+        "--shimmer-iteration": string;
+        "--shimmer-direction": string;
+        "@supports ((background-clip: text) or (-webkit-background-clip: text)) and (color: color-mix(in srgb, red, blue))": {
+            "background-image": string;
+            "background-repeat": string;
+            "background-size": string;
+            "background-position": string;
+            "background-clip": string;
+            "-webkit-background-clip": string;
+            "-webkit-text-fill-color": string;
+        };
+        "&:where([dir='rtl'], [dir='rtl'] *)": {
+            "--shimmer-direction": string;
+        };
+        "&.sytech-shimmer-text-reverse": {
+            "--shimmer-direction": string;
+        };
+        "&.sytech-shimmer-text-reverse:where([dir='rtl'], [dir='rtl'] *)": {
+            "--shimmer-direction": string;
+        };
+        "@media (prefers-reduced-motion: reduce)": {
+            animation: string;
+            "background-image": string;
+            "-webkit-text-fill-color": string;
+        };
+    };
+    ".sytech-shimmer-text-once": {
+        "--shimmer-iteration": string;
+    };
+    ".sytech-shimmer-text-disabled": {
+        animation: string;
+        "background-image": string;
+        "-webkit-text-fill-color": string;
+    };
+    ".spinner-bar-animation": {
+        animation: string;
+        "animation-delay": string;
+        transform: string;
+    };
+    ".spinner-dot-animation": {
+        "animation-delay": string;
+    };
+    ".spinner-dot-blink-animation": {
+        "animation-delay": string;
+    };
+    ".text-tiny": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-small": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-medium": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-large": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".scrollbar": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".scrollbar-thin": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".scrollbar-hide": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-default": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-none": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".transition-background": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-colors-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-width": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-height": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-size": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-left": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-background": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-colors": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-colors-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".leading-inherit": {
+        "line-height": string;
+    };
+    ".bg-img-inherit": {
+        "background-image": string;
+    };
+    ".bg-clip-inherit": {
+        "background-clip": string;
+    };
+    ".text-fill-inherit": {
+        "-webkit-text-fill-color": string;
+    };
+    ".tap-highlight-transparent": {
+        "-webkit-tap-highlight-color": string;
+    };
+    ".input-search-cancel-button-none": {
+        "&::-webkit-search-cancel-button": {
+            "-webkit-appearance": string;
+        };
+    };
+};
+
+export { utilities };

package/dist/utilities/index.d.ts

@@ -0,0 +1,171 @@
+declare const utilities: {
+    ".sytech-shimmer-text": {
+        color: string;
+        "--shimmer-angle": string;
+        "--shimmer-spread": string;
+        "--shimmer-iteration": string;
+        "--shimmer-direction": string;
+        "@supports ((background-clip: text) or (-webkit-background-clip: text)) and (color: color-mix(in srgb, red, blue))": {
+            "background-image": string;
+            "background-repeat": string;
+            "background-size": string;
+            "background-position": string;
+            "background-clip": string;
+            "-webkit-background-clip": string;
+            "-webkit-text-fill-color": string;
+        };
+        "&:where([dir='rtl'], [dir='rtl'] *)": {
+            "--shimmer-direction": string;
+        };
+        "&.sytech-shimmer-text-reverse": {
+            "--shimmer-direction": string;
+        };
+        "&.sytech-shimmer-text-reverse:where([dir='rtl'], [dir='rtl'] *)": {
+            "--shimmer-direction": string;
+        };
+        "@media (prefers-reduced-motion: reduce)": {
+            animation: string;
+            "background-image": string;
+            "-webkit-text-fill-color": string;
+        };
+    };
+    ".sytech-shimmer-text-once": {
+        "--shimmer-iteration": string;
+    };
+    ".sytech-shimmer-text-disabled": {
+        animation: string;
+        "background-image": string;
+        "-webkit-text-fill-color": string;
+    };
+    ".spinner-bar-animation": {
+        animation: string;
+        "animation-delay": string;
+        transform: string;
+    };
+    ".spinner-dot-animation": {
+        "animation-delay": string;
+    };
+    ".spinner-dot-blink-animation": {
+        "animation-delay": string;
+    };
+    ".text-tiny": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-small": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-medium": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".text-large": {
+        "font-size": string;
+        "line-height": string;
+    };
+    ".scrollbar": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".scrollbar-thin": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".scrollbar-hide": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-default": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-none": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".transition-background": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-colors-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-width": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-height": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-size": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-left": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-background": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-colors": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".transition-transform-colors-opacity": {
+        "transition-property": string;
+        "transition-timing-function": string;
+        "transition-duration": string;
+    };
+    ".leading-inherit": {
+        "line-height": string;
+    };
+    ".bg-img-inherit": {
+        "background-image": string;
+    };
+    ".bg-clip-inherit": {
+        "background-clip": string;
+    };
+    ".text-fill-inherit": {
+        "-webkit-text-fill-color": string;
+    };
+    ".tap-highlight-transparent": {
+        "-webkit-tap-highlight-color": string;
+    };
+    ".input-search-cancel-button-none": {
+        "&::-webkit-search-cancel-button": {
+            "-webkit-appearance": string;
+        };
+    };
+};
+
+export { utilities };

package/dist/utilities/index.mjs

@@ -1,12 +1,12 @@
 import {
   utilities
-} from "../chunk-ROFEKAS6.mjs";
+} from "../chunk-3C7AZEID.mjs";
+import "../chunk-FJOYYPB2.mjs";
+import "../chunk-RUIUXVZ4.mjs";
 import "../chunk-GSRZWDGA.mjs";
 import "../chunk-AWXUGVFR.mjs";
 import "../chunk-MPVWW3DX.mjs";
 import "../chunk-7FAFG773.mjs";
-import "../chunk-FJOYYPB2.mjs";
-import "../chunk-RUIUXVZ4.mjs";
 export {
   utilities
 };

package/dist/utilities/scrollbar-hide.d.mts

@@ -0,0 +1,59 @@
+declare const scrollbarModes: {
+    '[data-scrollbar="thin"]': {
+        "--scrollbar-width": string;
+        "--scrollbar-color": string;
+        "--scrollbar-gutter": string;
+    };
+    '[data-scrollbar="default"]': {
+        "--scrollbar-width": string;
+        "--scrollbar-color": string;
+        "--scrollbar-gutter": string;
+    };
+    '[data-scrollbar="none"]': {
+        "--scrollbar-width": string;
+        "--scrollbar-color": string;
+        "--scrollbar-gutter": string;
+    };
+};
+declare const _default: {
+    /**
+     * Theme-aware scrollbar
+     */
+    ".scrollbar": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    ".scrollbar-thin": {
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+    /**
+     * Scroll Hide
+     */
+    ".scrollbar-hide": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-default": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+        "&::-webkit-scrollbar": {
+            display: string;
+        };
+    };
+    ".scrollbar-none": {
+        "-ms-overflow-style": string;
+        "scrollbar-width": string;
+        "scrollbar-color": string;
+        "scrollbar-gutter": string;
+    };
+};
+
+export { _default as default, scrollbarModes };