@cube-dev/ui-kit 0.56.3 → 0.58.0

package/cjs/components/form/Form/validation.js

@@ -1,171 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.delayValidationRule = void 0;
-exports.applyRule = applyRule;
-exports.applyRules = applyRules;
-const valid_url_1 = __importDefault(require("valid-url"));
-const email_validator_1 = require("email-validator");
-const TYPE_CHECKERS = {
-    string(v) {
-        return typeof v === 'string';
-    },
-    number(v) {
-        return typeof v === 'number';
-    },
-    boolean(v) {
-        return typeof v === 'boolean';
-    },
-    method(v) {
-        return typeof v === 'function';
-    },
-    regexp(v) {
-        return v instanceof RegExp;
-    },
-    integer(v) {
-        return typeof v === 'number' && v === parseInt(String(v), 10);
-    },
-    array(v) {
-        return Array.isArray(v);
-    },
-    object(v) {
-        return typeof v === 'object' && !Array.isArray(v);
-    },
-    date(v) {
-        return v instanceof Date;
-    },
-    url(v) {
-        return typeof v === 'string' && valid_url_1.default.isUri(v);
-    },
-    hex(v) {
-        return typeof v === 'string' && v.match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/);
-    },
-    email(v) {
-        return (0, email_validator_1.validate)(v);
-    },
-    any(v) {
-        return true;
-    },
-};
-const TYPE_LIST = Object.keys(TYPE_CHECKERS);
-const VALIDATORS = {
-    async required(value) {
-        if (Array.isArray(value)) {
-            return !!value.length ? Promise.resolve() : Promise.reject();
-        }
-        return !!value || value === 0 ? Promise.resolve() : Promise.reject();
-    },
-    async whitespace(value) {
-        if (typeof value !== 'string' || value.trim())
-            return Promise.resolve();
-        return Promise.reject();
-    },
-    async pattern(value, rule) {
-        const pattern = rule.pattern;
-        if (typeof value !== 'string')
-            return Promise.resolve();
-        return value.match(pattern) ? Promise.resolve() : Promise.reject();
-    },
-    async enum(value, rule) {
-        const options = rule.enum || [];
-        if (!value && value !== 0)
-            return Promise.resolve();
-        return options.includes(value) ? Promise.resolve() : Promise.reject();
-    },
-    async len(value, rule) {
-        const len = rule.len;
-        if (typeof value === 'number') {
-            return value === len ? Promise.resolve() : Promise.reject();
-        }
-        if (!value || !('length' in value))
-            return Promise.resolve();
-        return value.length === len ? Promise.resolve() : Promise.reject();
-    },
-    async max(value, rule) {
-        const max = rule.max;
-        if (typeof value === 'number') {
-            return value <= max ? Promise.resolve() : Promise.reject();
-        }
-        if (!value || (typeof value !== 'string' && !Array.isArray(value)))
-            return Promise.resolve();
-        return value.length <= max ? Promise.resolve() : Promise.reject();
-    },
-    async min(value, rule) {
-        const min = rule.min;
-        if (typeof value === 'number') {
-            return value >= min ? Promise.resolve() : Promise.reject();
-        }
-        if (!value || (typeof value !== 'string' && !Array.isArray(value)))
-            return Promise.resolve();
-        return value.length >= min ? Promise.resolve() : Promise.reject();
-    },
-    async validator(value, rule) {
-        return rule.validator(rule, value);
-    },
-    async type(value, rule) {
-        const type = rule.type;
-        if (!TYPE_LIST.includes(type))
-            return Promise.resolve();
-        return TYPE_CHECKERS[type](value) ? Promise.resolve() : Promise.reject();
-    },
-};
-const VALIDATOR_NAMES = Object.keys(VALIDATORS);
-async function applyRule(value, rule, form) {
-    if (typeof rule === 'function') {
-        rule = rule(form);
-    }
-    if (typeof rule.transform === 'function') {
-        value = rule.transform(value);
-    }
-    for (let validatorName of VALIDATOR_NAMES) {
-        if (!(validatorName in rule))
-            continue;
-        const checker = VALIDATORS[validatorName];
-        await checker(value, rule);
-    }
-}
-async function applyRules(field, form, validationId = 0) {
-    const { value, rules } = field;
-    if (!rules || !rules.length)
-        return;
-    for (let rule of rules) {
-        if (field.validationId && validationId !== field.validationId)
-            return;
-        await applyRule(value, rule, form).catch((err) => {
-            if (err instanceof Error) {
-                err = err?.message || rule.message;
-            }
-            throw err || rule.message;
-        });
-    }
-}
-const delayValidationRule = (timeout = 500) => {
-    let timeoutId;
-    let storedResolve;
-    return {
-        async validator() {
-            clearTimeout(timeoutId);
-            if (storedResolve) {
-                storedResolve();
-            }
-            return new Promise((resolve) => {
-                storedResolve = resolve;
-                timeoutId = setTimeout(() => {
-                    resolve();
-                }, timeout);
-            });
-        },
-    };
-};
-exports.delayValidationRule = delayValidationRule;
-
-        

package/cjs/components/form/Label.js

@@ -1,79 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Label = exports.LABEL_STYLES = exports.INLINE_LABEL_STYLES = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("@react-spectrum/utils");
-const react_1 = require("react");
-const provider_1 = require("../../provider");
-const index_1 = require("../../tasty/index");
-const REQUIRED_ICON = ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", version: "1.1", x: "0px", y: "0px", viewBox: "0 0 100 125", style: {
-        // @ts-ignore
-        enableBackground: 'new 0 0 100 100',
-        width: '.8em',
-        height: '.8em',
-        transform: 'rotate(-5deg)',
-    }, children: (0, jsx_runtime_1.jsx)("switch", { children: (0, jsx_runtime_1.jsx)("g", { children: (0, jsx_runtime_1.jsx)("polygon", { fill: "currentColor", points: "97.5,47.5 90.5,26.1 61.3,35.6 61.3,4.8 38.7,4.8 38.7,35.6 9.5,26.1 2.5,47.5 31.8,57 13.7,82 31.9,95.2     50,70.3 68.1,95.2 86.3,82 68.2,57" }) }) }) }));
-const INTL_MESSAGES = {
-    '(required)': '(required)',
-    '(optional)': '(optional)',
-};
-exports.INLINE_LABEL_STYLES = {
-    preset: 't3',
-    color: {
-        '': '#dark-02',
-        invalid: '#danger-text',
-    },
-    whiteSpace: 'nowrap',
-};
-exports.LABEL_STYLES = {
-    display: 'block',
-    preset: 'h6',
-    color: {
-        '': '#dark',
-        invalid: '#danger-text',
-    },
-    whiteSpace: 'nowrap',
-    width: {
-        '': 'initial',
-        side: '@(label-width, initial)',
-    },
-};
-const LabelElement = (0, index_1.tasty)({
-    as: 'label',
-    qa: 'Label',
-    styles: exports.LABEL_STYLES,
-});
-function Label(props, ref) {
-    props = (0, provider_1.useProviderProps)(props);
-    let { as, qa, children, labelPosition = 'top', isRequired, necessityIndicator = isRequired != null ? 'icon' : null, includeNecessityIndicatorInAccessibilityName = false, htmlFor, isDisabled, validationState, for: labelFor, ...otherProps } = props;
-    let domRef = (0, utils_1.useDOMRef)(ref);
-    const styles = (0, index_1.extractStyles)(otherProps, index_1.CONTAINER_STYLES);
-    let formatMessage = (message) => INTL_MESSAGES[message];
-    let necessityLabel = isRequired
-        ? formatMessage('(required)')
-        : formatMessage('(optional)');
-    let icon = ((0, jsx_runtime_1.jsx)("span", { "aria-label": includeNecessityIndicatorInAccessibilityName
-            ? formatMessage('(required)')
-            : undefined, children: REQUIRED_ICON }));
-    return ((0, jsx_runtime_1.jsx)(LabelElement, { ...(0, index_1.filterBaseProps)(otherProps), ref: domRef, styles: styles, htmlFor: labelFor || htmlFor, mods: {
-            side: labelPosition === 'side',
-            disabled: isDisabled,
-            invalid: validationState === 'invalid',
-            valid: validationState === 'valid',
-        }, children: typeof children !== 'string' ? (children) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children, (necessityIndicator === 'label' ||
-                    (necessityIndicator === 'icon' && isRequired)) &&
-                    ' \u200b', necessityIndicator === 'label' && ((0, jsx_runtime_1.jsx)("span", { "aria-hidden": !includeNecessityIndicatorInAccessibilityName
-                        ? isRequired
-                        : undefined, children: necessityLabel })), necessityIndicator === 'icon' && isRequired && icon] })) }));
-}
-let _Label = (0, react_1.forwardRef)(Label);
-exports.Label = _Label;
-
-        

package/cjs/components/form/index.js

@@ -1,29 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"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("./Form"), exports);
-__exportStar(require("./wrapper"), exports);
-__exportStar(require("./Label"), exports);
-__exportStar(require("./FieldWrapper"), exports);
-
-        

package/cjs/components/form/wrapper.js

@@ -1,38 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.wrapWithField = wrapWithField;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const index_1 = require("./FieldWrapper/index");
-function wrapWithField(component, ref, props) {
-    let { label, extra, labelPosition = 'top', labelStyles, isRequired, isDisabled, necessityIndicator, message, messageStyles, description, validationState, labelProps, fieldProps, requiredMark = true, tooltip, isHidden, labelSuffix, styles, children, } = props;
-    return ((0, jsx_runtime_1.jsx)(index_1.FieldWrapper, { label,
-        extra,
-        labelPosition,
-        labelStyles,
-        isRequired,
-        isDisabled,
-        necessityIndicator,
-        labelProps,
-        fieldProps,
-        message,
-        messageStyles,
-        description,
-        validationState,
-        requiredMark,
-        tooltip,
-        isHidden,
-        labelSuffix,
-        styles,
-        children,
-        Component: component,
-        ref }));
-}
-
-        

package/cjs/components/layout/Flex.js

@@ -1,25 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Flex = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const tasty_1 = require("../../tasty");
-const FlexElement = (0, tasty_1.tasty)({
-    styles: {
-        display: 'flex',
-        flow: 'row',
-    },
-});
-exports.Flex = (0, react_1.forwardRef)(function Flex(props, ref) {
-    const styles = (0, tasty_1.extractStyles)(props, tasty_1.CONTAINER_STYLES);
-    return ((0, jsx_runtime_1.jsx)(FlexElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }));
-});
-
-        

package/cjs/components/layout/Flow.js

@@ -1,26 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Flow = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const tasty_1 = require("../../tasty");
-const FlowElement = (0, tasty_1.tasty)({
-    styles: {
-        display: 'block',
-        flow: 'column',
-    },
-});
-const STYLE_PROPS = tasty_1.CONTAINER_STYLES;
-exports.Flow = (0, react_1.forwardRef)(function Flow(props, ref) {
-    const styles = (0, tasty_1.extractStyles)(props, STYLE_PROPS);
-    return ((0, jsx_runtime_1.jsx)(FlowElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }));
-});
-
-        

package/cjs/components/layout/Grid.js

@@ -1,31 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Grid = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const tasty_1 = require("../../tasty");
-const GridElement = (0, tasty_1.tasty)({
-    styles: {
-        display: 'grid',
-        flow: 'row',
-    },
-});
-const PROP_MAP = {
-    template: 'gridTemplate',
-    columns: 'gridColumns',
-    rows: 'gridRows',
-    areas: 'gridAreas',
-};
-exports.Grid = (0, react_1.forwardRef)(function Grid(props, ref) {
-    const styles = (0, tasty_1.extractStyles)(props, tasty_1.CONTAINER_STYLES, undefined, PROP_MAP);
-    return ((0, jsx_runtime_1.jsx)(GridElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles }));
-});
-
-        

package/cjs/components/layout/Panel.js

@@ -1,110 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Panel = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const tasty_1 = require("../../tasty");
-const PanelElement = (0, tasty_1.tasty)({
-    as: 'section',
-    qa: 'Panel',
-    styles: {
-        position: {
-            '': 'relative',
-            'stretched | floating': 'absolute',
-        },
-        inset: {
-            '': 'initial',
-            stretched: true,
-        },
-        display: 'block',
-        radius: {
-            '': '0',
-            card: '1r',
-        },
-        border: {
-            '': '0',
-            card: '1bw',
-        },
-        flexGrow: 1,
-    },
-});
-const PanelInnerElement = (0, tasty_1.tasty)({
-    styles: {
-        position: 'absolute',
-        display: {
-            '': 'grid',
-            flex: 'flex',
-        },
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0,
-        overflow: 'auto',
-        styledScrollbar: true,
-        gridColumns: 'minmax(100%, 100%)',
-        gridRows: {
-            '': 'initial',
-            stretched: 'minmax(0, 1fr)',
-        },
-        radius: {
-            '': '0',
-            card: '(1r - 1bw)',
-        },
-        flow: 'row',
-        placeContent: 'start stretch',
-    },
-    styleProps: [...tasty_1.OUTER_STYLES, ...tasty_1.BASE_STYLES, ...tasty_1.COLOR_STYLES],
-});
-const STYLES = [
-    'placeContent',
-    'placeItems',
-    'gridColumns',
-    'gridRows',
-    'flow',
-    'gap',
-    'padding',
-    'overflow',
-    'fill',
-    'color',
-    'preset',
-];
-function Panel(props, ref) {
-    let { qa, mods, isStretched, isFloating, isCard, isFlex, styles, innerStyles, children, extra, style, ...otherProps } = props;
-    STYLES.forEach((style) => {
-        if (props[style]) {
-            innerStyles = { ...innerStyles, [style]: props[style] };
-        }
-    });
-    [
-        ...tasty_1.OUTER_STYLES,
-        ...tasty_1.BASE_STYLES,
-        ...tasty_1.BLOCK_STYLES,
-        ...tasty_1.COLOR_STYLES,
-        ...tasty_1.DIMENSION_STYLES,
-    ].forEach((style) => {
-        if (style in props) {
-            styles = { ...styles, [style]: props[style] };
-            delete otherProps[style];
-        }
-    });
-    const appliedMods = (0, react_1.useMemo)(() => ({
-        floating: isFloating,
-        stretched: isStretched,
-        card: isCard,
-        flex: isFlex,
-        ...mods,
-    }), [isStretched, isCard, mods]);
-    return ((0, jsx_runtime_1.jsxs)(PanelElement, { ref: ref, qa: qa, mods: appliedMods, styles: styles, style: style, ...otherProps, children: [(0, jsx_runtime_1.jsx)(PanelInnerElement, { mods: appliedMods, styles: innerStyles, children: children }), extra] }));
-}
-const _Panel = (0, react_1.forwardRef)(Panel);
-exports.Panel = _Panel;
-_Panel.displayName = 'Panel';
-
-        

package/cjs/components/layout/Prefix.js

@@ -1,46 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.56.3
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Prefix = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const tasty_1 = require("../../tasty");
-const react_2 = require("../../utils/react");
-const PrefixElement = (0, tasty_1.tasty)({
-    element: 'Prefix',
-    styles: {
-        position: 'absolute',
-        display: 'grid',
-        placeContent: 'stretch',
-        placeItems: 'center',
-        flow: 'column',
-        gap: 0,
-        left: '@prefix-gap',
-        top: '@prefix-gap',
-        bottom: '@prefix-gap',
-        color: '#dark-02',
-        height: '(100% - (2 * @prefix-gap))',
-    },
-});
-exports.Prefix = (0, react_1.forwardRef)(function Prefix(allProps, outerRef) {
-    let { onWidthChange, outerGap = '1bw', children, ...props } = allProps;
-    const styles = (0, tasty_1.extractStyles)(props, tasty_1.CONTAINER_STYLES);
-    const ref = (0, react_2.useCombinedRefs)(outerRef);
-    (0, react_2.useLayoutEffect)(() => {
-        if (ref?.current && onWidthChange) {
-            onWidthChange(ref.current.offsetWidth);
-        }
-    }, [children, ref, onWidthChange]);
-    return ((0, jsx_runtime_1.jsx)(PrefixElement, { ...(0, tasty_1.filterBaseProps)(props, { eventProps: true }), ref: ref, styles: styles, style: {
-            // @ts-ignore
-            '--prefix-gap': (0, tasty_1.parseStyle)(outerGap).value,
-        }, children: children }));
-});
-
-