@xanui/core 1.1.5 → 1.1.6

package/theme/ThemeProvider.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { TagComponentType, TagProps } from '../Tag/types.js';
+
+type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {
+    theme: string;
+    resetCss?: boolean;
+    scrollbarCss?: boolean;
+    isRootProvider?: boolean;
+    renderIsRoot?: React.ReactElement;
+};
+declare const ThemeProvider: ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => React.JSX.Element;
+
+export { ThemeProvider as default };
+export type { ThemeProviderProps };

package/theme/core.d.ts

@@ -0,0 +1,6 @@
+import { ThemeOptions } from './types.js';
+
+declare const getTheme: (theme: string) => ThemeOptions | undefined;
+declare const useTheme: () => ThemeOptions;
+
+export { getTheme, useTheme };

package/theme/createThemeSwitcher.d.ts

@@ -0,0 +1,9 @@
+import { ThemeOptions } from './types.js';
+
+declare const createThemeSwitcher: (defaultTheme: string, store?: "session" | "local") => () => {
+    name: string;
+    theme: ThemeOptions | undefined;
+    change: (theme: string) => void;
+};
+
+export { createThemeSwitcher as default };

package/theme/types.d.ts

@@ -0,0 +1,127 @@
+import { GlobalCSS, BreakpointKeys } from '../css/types.js';
+
+type ObjectType = {
+    [key: string]: any;
+};
+type ThemeColorItem = {
+    primary: string;
+    secondary: string;
+    text: string;
+    alpha: string;
+    template: {
+        outline: {
+            bgcolor: string;
+            color: string;
+            border: number;
+            borderColor: string;
+            hover: {
+                bgcolor: string;
+                color: string;
+            };
+        };
+        fill: {
+            bgcolor: string;
+            color: string;
+            hover: {
+                bgcolor: string;
+                color: string;
+            };
+        };
+        text: {
+            bgcolor: string;
+            color: string;
+            hover: {
+                bgcolor: string;
+                color: string;
+            };
+        };
+        alpha: {
+            bgcolor: string;
+            color: string;
+            hover: {
+                bgcolor: string;
+                color: string;
+            };
+        };
+    };
+};
+type ThemeTypographyItem = {
+    fontSize: number;
+    lineHeight: number;
+    fontWeight: number;
+};
+type ThemeColor = {
+    background: Omit<ThemeColorItem, "text">;
+    text: Omit<ThemeColorItem, "text" | "alpha" | "template">;
+    divider: string;
+    brand: ThemeColorItem;
+    accent: ThemeColorItem;
+    success: ThemeColorItem;
+    info: ThemeColorItem;
+    warning: ThemeColorItem;
+    danger: ThemeColorItem;
+};
+type ThemeTypographyType = {
+    fontFamily: string;
+    h1: ThemeTypographyItem;
+    h2: ThemeTypographyItem;
+    h3: ThemeTypographyItem;
+    h4: ThemeTypographyItem;
+    h5: ThemeTypographyItem;
+    h6: ThemeTypographyItem;
+    text: ThemeTypographyItem;
+    button: ThemeTypographyItem;
+    small: ThemeTypographyItem;
+};
+interface ThemeOptions {
+    name: string;
+    rtl: boolean;
+    globalStyle: GlobalCSS;
+    breakpoints: {
+        [key in BreakpointKeys]: number;
+    };
+    shadow: string[];
+    interfaces: {
+        [name: string]: <P extends object>(defaultProps: P, theme: ThemeOptions) => P;
+    };
+    colors: ThemeColor;
+    typography: ThemeTypographyType;
+}
+type ThemeColorItemInput = Partial<Omit<ThemeColorItem, "alpha">>;
+type ThemeTypographyItemInput = Partial<ThemeTypographyItem>;
+type ThemeColorInput = {
+    background?: Omit<ThemeColorItemInput, "text">;
+    text?: Omit<ThemeColorItemInput, "text">;
+    divider?: string;
+    brand?: ThemeColorItemInput;
+    accent?: ThemeColorItemInput;
+    success?: ThemeColorItemInput;
+    info?: ThemeColorItemInput;
+    warning?: ThemeColorItemInput;
+    danger?: ThemeColorItemInput;
+};
+type ThemeTypographyInputType = {
+    fontFamily?: string;
+    h1?: ThemeTypographyItemInput;
+    h2?: ThemeTypographyItemInput;
+    h3?: ThemeTypographyItemInput;
+    h4?: ThemeTypographyItemInput;
+    h5?: ThemeTypographyItemInput;
+    h6?: ThemeTypographyItemInput;
+    text?: ThemeTypographyItemInput;
+    button?: ThemeTypographyItemInput;
+    small?: ThemeTypographyItemInput;
+};
+interface ThemeOptionInput {
+    rtl?: boolean;
+    globalStyle?: GlobalCSS;
+    interfaces?: {
+        [name: string]: <P extends object>(defaultProps: P, theme: ThemeOptions) => P;
+    };
+    colors?: ThemeColorInput;
+    typography?: ThemeTypographyInputType;
+}
+type TypographyRefTypes = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "text" | "button" | "small";
+type ColorsRefTypes = "text" | "text.primary" | "text.secondary" | "background" | "background.primary" | "background.secondary" | "background.alpha" | "brand" | "brand.primary" | "brand.secondary" | "brand.alpha" | "brand.text" | "accent" | "accent.primary" | "accent.secondary" | "accent.alpha" | "accent.text" | "info" | "info.primary" | "info.secondary" | "info.alpha" | "info.text" | "success" | "success.primary" | "success.secondary" | "success.alpha" | "success.text" | "warning" | "warning.primary" | "warning.secondary" | "warning.alpha" | "warning.text" | "danger" | "danger.primary" | "danger.secondary" | "danger.alpha" | "danger.text";
+
+export type { ColorsRefTypes, ObjectType, ThemeColor, ThemeColorInput, ThemeColorItem, ThemeColorItemInput, ThemeOptionInput, ThemeOptions, ThemeTypographyInputType, ThemeTypographyItem, ThemeTypographyItemInput, ThemeTypographyType, TypographyRefTypes };

package/useAnimation.d.ts

@@ -0,0 +1,21 @@
+import { CSSProps } from './css/types.js';
+
+declare const animationEases: {
+    easeInOut: string;
+    easeOut: string;
+    easeIn: string;
+    sharp: string;
+    linear: string;
+    easeBounceOut: string;
+};
+interface UseAnimationProps {
+    delay?: number;
+    duration?: number;
+    from: CSSProps;
+    to: CSSProps;
+    ease?: keyof typeof animationEases;
+}
+declare const useAnimation: ({ from, to, delay, ease, duration }: UseAnimationProps) => string;
+
+export { animationEases, useAnimation as default };
+export type { UseAnimationProps };

package/useColorTemplate.d.ts

@@ -0,0 +1,6 @@
+type ColorTemplateColors = "default" | "brand" | "accent" | "info" | "success" | "warning" | "danger";
+type ColorTemplateType = "fill" | "outline" | "text" | "alpha";
+declare const useColorTemplate: (color: ColorTemplateColors, type: ColorTemplateType) => any;
+
+export { useColorTemplate as default };
+export type { ColorTemplateColors, ColorTemplateType };

package/useInterface.d.ts

@@ -0,0 +1,5 @@
+import { ThemeOptions } from './theme/types.js';
+
+declare const useInterface: <P extends object>(name: string, userPorps: P, defaultProps: P) => (P | ThemeOptions)[];
+
+export { useInterface as default };