@uxf/ui 1.0.0-beta.11 → 1.0.0-beta.111

package/tw-tokens/tw-containers.d.ts

@@ -0,0 +1,8 @@
+export declare const twContainers: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+};
+export declare type TwContainers = typeof twContainers;

package/tw-tokens/tw-containers.js

@@ -0,0 +1,11 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twContainers = void 0;
+exports.twContainers = {
+    xs: "33.75rem",
+    sm: "45rem",
+    md: "58rem",
+    lg: "64rem",
+    xl: "76rem",
+};

package/tw-tokens/tw-font-size.d.ts

@@ -0,0 +1,55 @@
+export declare const twFontSize: {
+    xs: (string | {
+        lineHeight: string;
+    })[];
+    sm: (string | {
+        lineHeight: string;
+    })[];
+    base: (string | {
+        lineHeight: string;
+    })[];
+    lg: (string | {
+        lineHeight: string;
+    })[];
+    xl: (string | {
+        lineHeight: string;
+    })[];
+    "2xl": (string | {
+        lineHeight: string;
+    })[];
+    "3xl": (string | {
+        lineHeight: string;
+    })[];
+    "4xl": (string | {
+        lineHeight: string;
+    })[];
+    "5xl": (string | {
+        lineHeight: string;
+    })[];
+    "6xl": (string | {
+        lineHeight: string;
+    })[];
+    "7xl": (string | {
+        lineHeight: string;
+    })[];
+    "8xl": (string | {
+        lineHeight: string;
+    })[];
+    "9xl": (string | {
+        lineHeight: string;
+    })[];
+    desktopH1: (string | number)[];
+    desktopH2: (string | number)[];
+    desktopH3: (string | number)[];
+    desktopH4: (string | number)[];
+    desktopH5: (string | number)[];
+    desktopH6: (string | number)[];
+    body: (string | number)[];
+    body2: (string | number)[];
+    button: (string | number)[];
+    caption: (string | number)[];
+    medium: (string | number)[];
+    medium2: (string | number)[];
+    overline: (string | number)[];
+};
+export declare type TwFontSize = typeof twFontSize;

package/tw-tokens/tw-font-size.js

@@ -0,0 +1,32 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twFontSize = void 0;
+exports.twFontSize = {
+    xs: ["0.75rem", { lineHeight: "1rem" }],
+    sm: ["0.875rem", { lineHeight: "1.25rem" }],
+    base: ["1rem", { lineHeight: "1.5rem" }],
+    lg: ["1.125rem", { lineHeight: "1.75rem" }],
+    xl: ["1.25rem", { lineHeight: "1.75rem" }],
+    "2xl": ["1.5rem", { lineHeight: "2rem" }],
+    "3xl": ["1.875rem", { lineHeight: "2.25rem" }],
+    "4xl": ["2.25rem", { lineHeight: "2.5rem" }],
+    "5xl": ["3rem", { lineHeight: "1" }],
+    "6xl": ["3.75rem", { lineHeight: "1" }],
+    "7xl": ["4.5rem", { lineHeight: "1" }],
+    "8xl": ["6rem", { lineHeight: "1" }],
+    "9xl": ["8rem", { lineHeight: "1" }],
+    desktopH1: ["6rem", 1.1666666666666667],
+    desktopH2: ["3.75rem", 1.2],
+    desktopH3: ["3rem", 1.3333333333333333],
+    desktopH4: ["2.125rem", 1.1764705882352942],
+    desktopH5: ["1.5rem", 1.3333333333333333],
+    desktopH6: ["1rem", 1.375],
+    body: ["1rem", 1.5],
+    body2: ["0.875rem", 1.4285714285714286],
+    button: ["1rem", 1.5],
+    caption: ["0.75rem", 1.3333333333333333],
+    medium: ["1rem", 1.5],
+    medium2: ["0.875rem", 1.4285714285714286],
+    overline: ["0.625rem", 1.6],
+};

package/tw-tokens/tw-font-weight.d.ts

@@ -0,0 +1,12 @@
+export declare const twFontWeight: {
+    thin: string;
+    extralight: string;
+    light: string;
+    normal: string;
+    medium: string;
+    semibold: string;
+    bold: string;
+    extrabold: string;
+    black: string;
+};
+export declare type TwFontWeight = typeof twFontWeight;

package/tw-tokens/tw-font-weight.js

@@ -0,0 +1,15 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twFontWeight = void 0;
+exports.twFontWeight = {
+    thin: "100",
+    extralight: "200",
+    light: "300",
+    normal: "400",
+    medium: "500",
+    semibold: "600",
+    bold: "700",
+    extrabold: "800",
+    black: "900",
+};

package/tw-tokens/tw-line-height.d.ts

@@ -0,0 +1,17 @@
+export declare const twLineHeight: {
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    none: string;
+    tight: string;
+    snug: string;
+    normal: string;
+    relaxed: string;
+    loose: string;
+};
+export declare type TwLineHeight = typeof twLineHeight;

package/tw-tokens/tw-line-height.js

@@ -0,0 +1,20 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twLineHeight = void 0;
+exports.twLineHeight = {
+    3: ".75rem",
+    4: "1rem",
+    5: "1.25rem",
+    6: "1.5rem",
+    7: "1.75rem",
+    8: "2rem",
+    9: "2.25rem",
+    10: "2.5rem",
+    none: "1",
+    tight: "1.25",
+    snug: "1.375",
+    normal: "1.5",
+    relaxed: "1.625",
+    loose: "2",
+};

package/tw-tokens/tw-screens.d.ts

@@ -0,0 +1,8 @@
+export declare const twScreens: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+};
+export declare type TwScreens = typeof twScreens;

package/tw-tokens/tw-screens.js

@@ -0,0 +1,11 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twScreens = void 0;
+exports.twScreens = {
+    xs: "36em",
+    sm: "48em",
+    md: "62em",
+    lg: "75em",
+    xl: "90em",
+};

package/tw-tokens/tw-spacing.d.ts

@@ -0,0 +1,39 @@
+export declare const twSpacing: {
+    0: string;
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    11: string;
+    12: string;
+    14: string;
+    16: string;
+    20: string;
+    24: string;
+    28: string;
+    32: string;
+    36: string;
+    40: string;
+    44: string;
+    48: string;
+    52: string;
+    56: string;
+    60: string;
+    64: string;
+    72: string;
+    80: string;
+    96: string;
+    px: string;
+    0.5: string;
+    1.5: string;
+    2.5: string;
+    3.5: string;
+    inherit: string;
+};
+export declare type TwSpacing = typeof twSpacing;

package/tw-tokens/tw-spacing.js

@@ -0,0 +1,42 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twSpacing = void 0;
+exports.twSpacing = {
+    0: "0px",
+    1: "0.25rem",
+    2: "0.5rem",
+    3: "0.75rem",
+    4: "1rem",
+    5: "1.25rem",
+    6: "1.5rem",
+    7: "1.75rem",
+    8: "2rem",
+    9: "2.25rem",
+    10: "2.5rem",
+    11: "2.75rem",
+    12: "3rem",
+    14: "3.5rem",
+    16: "4rem",
+    20: "5rem",
+    24: "6rem",
+    28: "7rem",
+    32: "8rem",
+    36: "9rem",
+    40: "10rem",
+    44: "11rem",
+    48: "12rem",
+    52: "13rem",
+    56: "14rem",
+    60: "15rem",
+    64: "16rem",
+    72: "18rem",
+    80: "20rem",
+    96: "24rem",
+    px: "1px",
+    0.5: "0.125rem",
+    1.5: "0.375rem",
+    2.5: "0.625rem",
+    3.5: "0.875rem",
+    inherit: "inherit",
+};

package/tw-tokens/tw-z-index.d.ts

@@ -0,0 +1,19 @@
+export declare const twZIndex: {
+    0: string;
+    1: string;
+    10: string;
+    20: string;
+    30: string;
+    40: string;
+    50: string;
+    auto: string;
+    focus: string;
+    fixed: string;
+    menu: string;
+    header: string;
+    modal: string;
+    dropdown: string;
+    flashMessage: string;
+    tooltip: string;
+};
+export declare type TwZIndex = typeof twZIndex;

package/tw-tokens/tw-z-index.js

@@ -0,0 +1,22 @@
+"use strict";
+// this file is generated automatically, do not change anything manually in the contents of this file
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.twZIndex = void 0;
+exports.twZIndex = {
+    0: "0",
+    1: "1",
+    10: "10",
+    20: "20",
+    30: "30",
+    40: "40",
+    50: "50",
+    auto: "auto",
+    focus: "5",
+    fixed: "10",
+    menu: "25",
+    header: "50",
+    modal: "100",
+    dropdown: "200",
+    flashMessage: "250",
+    tooltip: "300",
+};

package/types/color.d.ts

@@ -0,0 +1,2 @@
+export declare type ColorScheme = "dark" | "light";
+export declare type HexColor = `#${string}`;

package/types/color.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/types/file-response.d.ts

@@ -0,0 +1,12 @@
+export interface FileResponse {
+    extension: string;
+    id: number;
+    name: string;
+    namespace?: string | null;
+    uuid: string;
+}
+export interface UploadOptions {
+    abortController?: AbortController;
+    onUploadProgress?: (progressEvent: UploadProgressEvent) => void;
+}
+export declare type UploadProgressEvent = Pick<ProgressEvent, "lengthComputable" | "loaded" | "total">;

package/types/file-response.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/types/form-control-props.d.ts

@@ -1,6 +1,6 @@
 import { ChangeEvent, FocusEventHandler } from "react";
 export interface FormControlProps<ValueType, ElementType = HTMLInputElement, RestParams extends unknown[] = []> {
-    value: ValueType;
+    value?: ValueType;
     onChange?: (value: ValueType, event?: ChangeEvent<ElementType>, ...args: RestParams) => void;
     onBlur?: FocusEventHandler<ElementType>;
     onFocus?: FocusEventHandler<ElementType>;

package/types/form-control-props.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS1jb250cm9sLXByb3BzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3R5cGVzL2Zvcm0tY29udHJvbC1wcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/types/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./color";
+export * from "./form-control-props";
+export * from "./file-response";

package/types/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./color"), exports);
+__exportStar(require("./form-control-props"), exports);
+__exportStar(require("./file-response"), exports);

package/typography/typography.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/typography/typography.spec.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const snap_test_1 = require("../utils/snap-test");
+(0, snap_test_1.snapTest)("render basic", react_1.default.createElement(react_1.default.Fragment, null,
+    react_1.default.createElement("h1", { className: "uxf-typo-h1" }, ".uxf-typo-h1"),
+    react_1.default.createElement("h2", { className: "uxf-typo-h2" }, ".uxf-typo-h2"),
+    react_1.default.createElement("h3", { className: "uxf-typo-h3" }, ".uxf-typo-h3"),
+    react_1.default.createElement("h4", { className: "uxf-typo-h4" }, ".uxf-typo-h4"),
+    react_1.default.createElement("h5", { className: "uxf-typo-h5" }, ".uxf-typo-h5"),
+    react_1.default.createElement("h6", { className: "uxf-typo-h6" }, ".uxf.typo-h6"),
+    react_1.default.createElement("p", { className: "uxf-typo-body" }, ".uxf-typo-body"),
+    react_1.default.createElement("p", { className: "uxf-typo-body2" }, ".uxf-typo-body2"),
+    react_1.default.createElement("p", { className: "uxf-typo-button" }, ".uxf-typo-button"),
+    react_1.default.createElement("p", { className: "uxf-typo-caption" }, ".uxf-typo-caption"),
+    react_1.default.createElement("p", { className: "uxf-typo-medium" }, ".uxf-typo-medium"),
+    react_1.default.createElement("p", { className: "uxf-typo-medium2" }, ".uxf-typo-medium2"),
+    react_1.default.createElement("p", { className: "uxf-typo-overline" }, ".uxf-typo-overline")));

package/typography/typography.stories.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare const _default: {
+    title: string;
+    component: null;
+};
+export default _default;
+export declare function Default(): JSX.Element;

package/typography/typography.stories.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+const react_1 = __importDefault(require("react"));
+exports.default = {
+    title: "UI/Typography",
+    component: null,
+};
+function Default() {
+    return (react_1.default.createElement("div", { className: "space-y-4" },
+        react_1.default.createElement("h1", { className: "uxf-typo-h1" }, ".uxf-typo-h1"),
+        react_1.default.createElement("h2", { className: "uxf-typo-h2" }, ".uxf-typo-h2"),
+        react_1.default.createElement("h3", { className: "uxf-typo-h3" }, ".uxf-typo-h3"),
+        react_1.default.createElement("h4", { className: "uxf-typo-h4" }, ".uxf-typo-h4"),
+        react_1.default.createElement("h5", { className: "uxf-typo-h5" }, ".uxf-typo-h5"),
+        react_1.default.createElement("h6", { className: "uxf-typo-h6" }, ".uxf.typo-h6"),
+        react_1.default.createElement("p", { className: "uxf-typo-body" }, ".uxf-typo-body"),
+        react_1.default.createElement("p", { className: "uxf-typo-body2" }, ".uxf-typo-body2"),
+        react_1.default.createElement("p", { className: "uxf-typo-button" }, ".uxf-typo-button"),
+        react_1.default.createElement("p", { className: "uxf-typo-caption" }, ".uxf-typo-caption"),
+        react_1.default.createElement("p", { className: "uxf-typo-medium" }, ".uxf-typo-medium"),
+        react_1.default.createElement("p", { className: "uxf-typo-medium2" }, ".uxf-typo-medium2"),
+        react_1.default.createElement("p", { className: "uxf-typo-overline" }, ".uxf-typo-overline")));
+}
+exports.Default = Default;

package/utils/action.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.action = void 0;
+const addon_actions_1 = require("@storybook/addon-actions");
+function action(name, handler) {
+    return function (...args) {
+        (0, addon_actions_1.action)(name)(...args);
+        handler(...args);
+    };
+}
+exports.action = action;

package/utils/component-structure-analyzer.js

@@ -3,9 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
+const react_1 = __importDefault(require("react"));
 function ComponentStructureAnalyzer(props) {
-    return (react_1.default.createElement("div", { className: "uxf-component-structure-analyzer" }, props.children));
+    return react_1.default.createElement("div", { className: "uxf-component-structure-analyzer" }, props.children);
 }
 exports.default = ComponentStructureAnalyzer;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tcG9uZW50LXN0cnVjdHVyZS1hbmFseXplci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9jb21wb25lbnQtc3RydWN0dXJlLWFuYWx5emVyLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUFBLGdEQUF5QztBQUt6QyxTQUFTLDBCQUEwQixDQUFDLEtBQXNDO0lBQ3hFLE9BQU8sQ0FDTCx1Q0FBSyxTQUFTLEVBQUMsa0NBQWtDLElBQUUsS0FBSyxDQUFDLFFBQVEsQ0FBTyxDQUN6RSxDQUFDO0FBQ0osQ0FBQztBQUVELGtCQUFlLDBCQUEwQixDQUFDIn0=

package/utils/icons-config.js

@@ -0,0 +1,98 @@
+/** @type {import('@uxf/icons-generator/types').Config['icons']} */
+module.exports = {
+    calendar: {
+        width: 448,
+        height: 512,
+        data: `<path d="M152 64h144V24c0-13.25 10.7-24 24-24s24 10.75 24 24v40h40c35.3 0 64 28.65 64 64v320c0 35.3-28.7 64-64 64H64c-35.35 0-64-28.7-64-64V128c0-35.35 28.65-64 64-64h40V24c0-13.25 10.7-24 24-24s24 10.75 24 24v40zM48 248h80v-56H48v56zm0 48v64h80v-64H48zm128 0v64h96v-64h-96zm144 0v64h80v-64h-80zm80-104h-80v56h80v-56zm0 216h-80v56h64c8.8 0 16-7.2 16-16v-40zm-128 0h-96v56h96v-56zm-144 0H48v40c0 8.8 7.16 16 16 16h64v-56zm144-216h-96v56h96v-56z" fill="currentColor" />`,
+    },
+    camera: {
+        width: 512,
+        height: 512,
+        data: `<path d="M144 288C144 226.1 194.1 176 256 176C317.9 176 368 226.1 368 288C368 349.9 317.9 400 256 400C194.1 400 144 349.9 144 288zM256 224C220.7 224 192 252.7 192 288C192 323.3 220.7 352 256 352C291.3 352 320 323.3 320 288C320 252.7 291.3 224 256 224zM362.9 64.82L373.3 96H448C483.3 96 512 124.7 512 160V416C512 451.3 483.3 480 448 480H64C28.65 480 0 451.3 0 416V160C0 124.7 28.65 96 64 96H138.7L149.1 64.82C155.6 45.22 173.9 32 194.6 32H317.4C338.1 32 356.4 45.22 362.9 64.82H362.9zM64 144C55.16 144 48 151.2 48 160V416C48 424.8 55.16 432 64 432H448C456.8 432 464 424.8 464 416V160C464 151.2 456.8 144 448 144H338.7L317.4 80H194.6L173.3 144H64z" fill="currentColor"/>`,
+    },
+    caretDown: {
+        width: 320,
+        height: 512,
+        data: `<path d="M137.4 374.6a32.05 32.05 0 0 0 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9S301 191.9 288 191.9L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z" fill="currentColor"/>`,
+    },
+    clock: {
+        width: 512,
+        height: 512,
+        data: `<path d="M232 120c0-13.3 10.7-24 24-24s24 10.7 24 24v123.2l85.3 56.8c11 7.4 14 22.3 5.8 33.3-6.5 11-21.4 14-32.4 5.8l-96-64c-6.7-3.6-10.7-11.1-10.7-20V120zM256 0c141.4 0 256 114.6 256 256S397.4 512 256 512 0 397.4 0 256 114.6 0 256 0zM48 256c0 114.9 93.1 208 208 208s208-93.1 208-208S370.9 48 256 48 48 141.1 48 256z" fill="currentColor"/>`,
+    },
+    bars: {
+        width: 448,
+        height: 512,
+        data: `<path d="M0 96C0 78.3 14.3 64 32 64H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32H416c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H416c17.7 0 32 14.3 32 32z" fill="currentColor" />`,
+    },
+    check: {
+        width: 512,
+        height: 512,
+        data: `<path d="M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" fill="currentColor"/>`,
+    },
+    chevronDown: {
+        width: 512,
+        height: 512,
+        data: `<path d="M256 429.3l22.6-22.6 192-192L493.3 192 448 146.7l-22.6 22.6L256 338.7 86.6 169.4 64 146.7 18.7 192l22.6 22.6 192 192L256 429.3z" fill="currentColor"/>`,
+    },
+    chevronLeft: {
+        width: 384,
+        height: 512,
+        data: `<path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 278.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z" fill="currentColor"/>`,
+    },
+    chevronsLeft: {
+        width: 512,
+        height: 512,
+        data: `<path d="M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 278.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192zm384-192l-192 192c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L301.3 256 470.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0z" fill="currentColor"/>`,
+    },
+    chevronRight: {
+        width: 384,
+        height: 512,
+        data: `<path d="M342.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L274.7 256 105.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z" fill="currentColor"/>`,
+    },
+    chevronsRight: {
+        width: 512,
+        height: 512,
+        data: `<path d="M470.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-192-192c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L402.7 256 233.4 425.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l192-192zm-384 192l192-192c12.5-12.5 12.5-32.8 0-45.3l-192-192c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L210.7 256 41.4 425.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0z" fill="currentColor"/>`,
+    },
+    chevronUp: {
+        width: 512,
+        height: 512,
+        data: `<path d="M256 82.7l22.6 22.6 192 192L493.3 320 448 365.3l-22.6-22.6L256 173.3 86.6 342.6 64 365.3 18.7 320l22.6-22.6 192-192L256 82.7z" fill="currentColor"/>`,
+    },
+    cloud: {
+        width: 640,
+        height: 512,
+        data: `<path d="M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9-.1-2.7-.2-5.4-.2-8.1 0-88.4 71.6-160 160-160 59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96 0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-217c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l39-39V392c0 13.3 10.7 24 24 24s24-10.7 24-24V257.9l39 39c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-80-80c-9.4-9.4-24.6-9.4-33.9 0l-80 80z" fill="currentColor"/>`,
+    },
+    copy: {
+        width: 512,
+        height: 512,
+        data: `<path fill="currentColor" d="M502.6 70.63l-61.25-61.25C435.4 3.371 427.2 0 418.7 0H255.1c-35.35 0-64 28.66-64 64l.0195 256C192 355.4 220.7 384 256 384h192c35.2 0 64-28.8 64-64V93.25C512 84.77 508.6 76.63 502.6 70.63zM464 320c0 8.836-7.164 16-16 16H255.1c-8.838 0-16-7.164-16-16L239.1 64.13c0-8.836 7.164-16 16-16h128L384 96c0 17.67 14.33 32 32 32h47.1V320zM272 448c0 8.836-7.164 16-16 16H63.1c-8.838 0-16-7.164-16-16L47.98 192.1c0-8.836 7.164-16 16-16H160V128H63.99c-35.35 0-64 28.65-64 64l.0098 256C.002 483.3 28.66 512 64 512h192c35.2 0 64-28.8 64-64v-32h-47.1L272 448z" />`,
+    },
+    file: {
+        width: 384,
+        height: 512,
+        data: `<path d="M0 64C0 28.65 28.65 0 64 0h165.5c17 0 33.2 6.743 45.2 18.75l90.6 90.55c12 12 18.7 28.2 18.7 45.2V448c0 35.3-28.7 64-64 64H64c-35.35 0-64-28.7-64-64V64zm336 384V160h-80c-17.7 0-32-14.3-32-32V48H64c-8.84 0-16 7.16-16 16v384c0 8.8 7.16 16 16 16h256c8.8 0 16-7.2 16-16z" fill="currentColor" />`,
+    },
+    imageFile: {
+        width: 384,
+        height: 512,
+        data: `<path d="m365.3 93.38-74.63-74.64C278.6 6.742 262.3 0 245.4 0H64C28.65 0 0 28.65 0 64l.0065 384c0 35.34 28.65 64 64 64H320c35.2 0 64-28.8 64-64V138.6c0-16.9-6.7-33.2-18.7-45.22zM336 448c0 8.836-7.164 16-16 16H64.02c-8.838 0-16-7.164-16-16L48 64.13c0-8.836 7.164-16 16-16h160V128c0 17.67 14.33 32 32 32h79.1v288zM215.3 292c-4.68 0-9.051 2.34-11.65 6.234L164 357.8l-11.68-17.53c-2.62-3.97-7.02-6.27-11.62-6.27-4.682 0-9.053 2.34-11.65 6.234l-46.67 70c-2.865 4.297-3.131 9.82-.6953 14.37C84.09 429.2 88.84 432 93.1 432h196c5.163 0 9.907-2.844 12.34-7.395 2.436-4.551 2.17-10.07-.6953-14.37l-74.67-112C224.4 294.3 220 292 215.3 292zm-87.3-4c17.67 0 32-14.33 32-32s-14.3-32-32-32-32 14.3-32 32 14.3 32 32 32z" fill="currentColor" />`,
+    },
+    videoFile: {
+        width: 384,
+        height: 512,
+        data: `<path d="m365.3 93.38-74.63-74.64C278.6 6.742 262.3 0 245.4 0H64C28.65 0 0 28.65 0 64l.0065 384c0 35.34 28.65 64 64 64H320c35.2 0 64-28.8 64-64V138.6c0-16.9-6.7-33.2-18.7-45.22zM336 448c0 8.836-7.164 16-16 16H64.02c-8.838 0-16-7.164-16-16L48 64.13c0-8.836 7.164-16 16-16h160V128c0 17.67 14.33 32 32 32h79.1v288zm-96-160c0-17.67-14.33-32-32-32h-96c-17.67 0-32 14.33-32 32v96c0 17.67 14.33 32 32 32h96c17.67 0 32-14.33 32-32v-16.52l43.84 30.2c8.46 5.82 20.16-.08 20.16-10.28V284.6c0-10.16-11.64-16.16-20.16-10.32L240 304.5V288z" fill="currentColor" />`,
+    },
+    user: {
+        width: 448,
+        height: 512,
+        data: `<path d="M272 304h-96C78.8 304 0 382.8 0 480a32 32 0 0 0 32 32h384a32 32 0 0 0 32-32c0-97.2-78.8-176-176-176zM48.99 464c7.9-63.1 61.81-112 127.01-112h96c65.16 0 119.1 48.95 127 112H48.99zM224 256c70.69 0 128-57.31 128-128S294.69 0 224 0 96 57.31 96 128c0 70.7 57.3 128 128 128zm0-208c44.11 0 80 35.89 80 80s-35.89 80-80 80-80-35.9-80-80c0-44.11 35.9-80 80-80z" fill="currentColor"/>`,
+    },
+    xmarkLarge: {
+        width: 448,
+        height: 512,
+        data: `<path d="M393.4 41.4c12.5-12.5 32.8-12.5 45.3 0s12.5 32.8 0 45.3L269.3 256l169.3 169.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L224 301.3 54.6 470.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L178.7 256 9.4 86.6c-12.5-12.5-12.5-32.7 0-45.2s32.8-12.5 45.3 0L224 210.7 393.4 41.4z" fill="currentColor"/>`,
+    },
+};

package/utils/mocks/uploadFIle.mock.d.ts

@@ -0,0 +1,2 @@
+import { FileResponse, UploadOptions } from "@uxf/ui/types";
+export declare function uploadFile(file: File, uploadOptions?: UploadOptions): Promise<FileResponse>;

package/utils/mocks/uploadFIle.mock.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.uploadFile = void 0;
+function getRandomUuid() {
+    return "00000000-0000-0000-0000-000000000000"
+        .split("-")
+        .map((el) => Array(el.length)
+        .fill(0)
+        .map(() => Math.round(Math.random() * 9).toString())
+        .join(""))
+        .join("-");
+}
+function uploadFile(file, uploadOptions) {
+    // axios.put("/api/upload", file, { signal: uploadOptions?.abortController?.signal, onUploadProgress: uploadOptions?.onUploadProgress });
+    return new Promise((resolve) => {
+        const time = file.size / 10;
+        const interval = time / 10;
+        let loaded = 0;
+        const timeoutTimer = window.setTimeout(() => {
+            resolve({
+                id: Math.round(Math.random() * 100000000),
+                uuid: getRandomUuid(),
+                name: file.name,
+                extension: file.name.split(".").slice(-1).join(""),
+            });
+        }, time);
+        const intervalTimer = window.setInterval(() => {
+            var _a, _b;
+            if ((_a = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.abortController) === null || _a === void 0 ? void 0 : _a.signal.aborted) {
+                clearInterval(intervalTimer);
+                clearTimeout(timeoutTimer);
+                return;
+            }
+            loaded += (file.size / time) * interval;
+            (_b = uploadOptions === null || uploadOptions === void 0 ? void 0 : uploadOptions.onUploadProgress) === null || _b === void 0 ? void 0 : _b.call(uploadOptions, {
+                lengthComputable: true,
+                loaded,
+                total: file.size,
+            });
+        }, interval);
+    });
+}
+exports.uploadFile = uploadFile;

package/utils/snap-test.d.ts

@@ -0,0 +1,2 @@
+import { ReactNode } from "react";
+export declare const snapTest: (name: string, component: ReactNode) => void;