@cube-dev/ui-kit 0.0.0-canary-9917823 → 0.0.0-canary-2a1d026

package/cjs/stories/components/StyledButton.js

@@ -1,37 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Block = exports.GlobalStyledHeading = exports.StyledButton = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const tasty_1 = require("../../tasty");
-const actions_1 = require("../../components/actions");
-exports.StyledButton = (0, tasty_1.tasty)(actions_1.Button, {
-    styles: {
-        padding: '3x 6x',
-        preset: 't1',
-    },
-});
-exports.GlobalStyledHeading = (0, tasty_1.tasty)('.myButton', {
-    display: 'inline-block',
-    padding: '1x 2x',
-    preset: 't2',
-    border: true,
-    radius: true,
-    fill: {
-        '': '#white',
-        ':hover': '#purple.20',
-    },
-    color: '#dark',
-});
-function Block() {
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(exports.StyledButton, { children: "123" }, void 0), (0, jsx_runtime_1.jsx)(exports.GlobalStyledHeading, {}, void 0)] }, void 0));
-}
-exports.Block = Block;
-
-        

package/cjs/stories/lists/baseProps.js

@@ -1,42 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.baseProps = void 0;
-const tasty_1 = require("../../tasty");
-const allStyles = Array.from(new Set([
-    ...tasty_1.BASE_STYLES,
-    ...tasty_1.POSITION_STYLES,
-    ...tasty_1.CONTAINER_STYLES,
-    ...tasty_1.BLOCK_STYLES,
-    ...tasty_1.COLOR_STYLES,
-    ...tasty_1.FLOW_STYLES,
-    ...tasty_1.OUTER_STYLES,
-    ...tasty_1.DIMENSION_STYLES,
-    ...tasty_1.TEXT_STYLES,
-    ...tasty_1.POSITION_STYLES,
-]));
-exports.baseProps = [
-    'qa',
-    'qaVal',
-    'block',
-    'inline',
-    'style',
-    'styles',
-    'css',
-    'styleName',
-    'hidden',
-    'disabled',
-    'mods',
-    'breakpoints',
-    'isHidden',
-    'element',
-    ...allStyles,
-];
-
-        

package/es/components/actions/Button/Submit.js

@@ -1,26 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from 'react';
-import { useProviderProps } from '../../../provider';
-import { useFormProps } from '../../forms/Form/Form';
-import { Button } from './Button';
-function Submit(props, ref) {
-    props = useProviderProps(props);
-    props = useFormProps(props);
-    const { form, ...otherProps } = props;
-    const formData = form.getFieldsValue();
-    const isValid = !Object.keys(formData).find((name) => {
-        return form.isFieldInvalid(name);
-    });
-    return (_jsx(Button, { ref: ref, type: "primary", htmlType: "submit", isLoading: form.isSubmitting, isDisabled: !isValid, ...otherProps }, void 0));
-}
-const _Submit = forwardRef(Submit);
-export { _Submit as Submit };
-
-        

package/es/stories/FormFieldArgs.js

@@ -1,321 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { baseProps } from './lists/baseProps';
-export const DISABLE_BASE_ARGS = baseProps.reduce((map, prop) => {
-    map[prop] = { table: { disable: true } };
-    return map;
-}, {});
-export const LABEL_POSITION_ARG = {
-    labelPosition: {
-        description: 'The position of labels for each field.',
-        options: ['top', 'side'],
-        control: 'radio',
-        table: {
-            type: { summary: 'string' },
-            defaultValue: { summary: 'top' },
-        },
-    },
-};
-export const LABEL_ARG = {
-    label: {
-        control: 'text',
-        description: 'The content to display as the label.',
-    },
-};
-export const EXTRA_ARG = {
-    extra: {
-        control: 'text',
-        description: 'The extra content to display next to the label.',
-    },
-};
-export const DESCRIPTION_ARG = {
-    description: {
-        control: 'text',
-        description: 'The description for the field.',
-    },
-};
-export const NECESSITY_INDICATOR_ARG = {
-    necessityIndicator: {
-        // defaultValue: 'icon',
-        description: 'Type of the necessity indicator',
-        options: ['icon', 'label', false],
-        control: 'radio',
-        table: {
-            type: { summary: 'string' },
-            defaultValue: { summary: 'icon' },
-        },
-    },
-};
-export const MESSAGE_ARG = {
-    message: {
-        // defaultValue: '',
-        description: 'Validation error message',
-        control: 'text',
-    },
-};
-export const PLACEHOLDER_ARG = {
-    placeholder: {
-        // defaultValue: 'Placeholder',
-        control: 'text',
-    },
-};
-export const VALIDATION_STATE_ARG = {
-    validationState: {
-        // defaultValue: undefined,
-        description: 'Whether the input should display its "valid" or "invalid" visual styling.',
-        options: [undefined, 'valid', 'invalid'],
-        control: 'radio',
-        table: {
-            type: { summary: 'string' },
-            defaultValue: { summary: 'top' },
-        },
-    },
-};
-export const IS_LOADING_ARG = {
-    isLoading: {
-        control: 'boolean',
-        description: 'Loading state with spinner. Also works as disabled',
-        // defaultValue: false,
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const AUTO_FOCUS_ARG = {
-    autoFocus: {
-        // defaultValue: false,
-        description: 'Whether the element should receive focus on render.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const IS_REQUIRED_ARG = {
-    isRequired: {
-        // defaultValue: false,
-        description: 'Whether user input is required on the input before form submission. Often paired with the necessityIndicator prop to add a visual indicator to the input.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const IS_READ_ONLY_ARG = {
-    isReadOnly: {
-        // defaultValue: false,
-        description: 'Whether the input can be selected but not changed by the user.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const IS_DISABLED_ARG = {
-    isDisabled: {
-        // defaultValue: false,
-        description: 'Whether the input is disabled.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const SIZE_ARG = {
-    size: {
-        // defaultValue: undefined,
-        description: 'The size of the button',
-        options: [undefined, 'default', 'small'],
-        control: 'radio',
-        table: {
-            type: { summary: 'string' },
-            defaultValue: { summary: 'default' },
-        },
-    },
-};
-export const MULTILINE_ARG = {
-    multiLine: {
-        // defaultValue: false,
-        description: 'Whether the input is multiline.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: false },
-        },
-    },
-};
-export const REQUIRED_MARK_ARG = {
-    requiredMark: {
-        // defaultValue: true,
-        description: 'Whether to show the required mark on labels.',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: true },
-        },
-    },
-};
-export const TEXT_VALUE_ARG = {
-    value: {
-        defaultValue: undefined,
-        description: 'The text value in controlled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'string' },
-        },
-    },
-    defaultValue: {
-        defaultValue: undefined,
-        description: 'The default text value in uncontrolled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'string' },
-        },
-    },
-};
-export const NUMBER_VALUE_ARG = {
-    value: {
-        defaultValue: undefined,
-        description: 'The number value in controlled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'number' },
-        },
-    },
-    defaultValue: {
-        defaultValue: undefined,
-        description: 'The default number value in uncontrolled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'number' },
-        },
-    },
-};
-export const MULTIPLE_VALUE_ARG = {
-    value: {
-        defaultValue: undefined,
-        description: 'The multiple value in controlled mode',
-        control: 'object',
-        table: {
-            type: { summary: 'string[]' },
-        },
-    },
-    defaultValue: {
-        defaultValue: undefined,
-        description: 'The default multiple value in uncontrolled mode',
-        control: 'object',
-        table: {
-            type: { summary: 'string[]' },
-        },
-    },
-};
-export const MULTIPLE_NUMBER_VALUE_ARG = {
-    value: {
-        defaultValue: undefined,
-        description: 'The multiple value in controlled mode',
-        control: 'object',
-        table: {
-            type: { summary: 'number[]' },
-        },
-    },
-    defaultValue: {
-        defaultValue: undefined,
-        description: 'The default multiple value in uncontrolled mode',
-        control: 'object',
-        table: {
-            type: { summary: 'number[]' },
-        },
-    },
-};
-export const IS_SELECTED_ARG = {
-    isSelected: {
-        defaultValue: undefined,
-        description: 'Whether the input is selected in controlled mode',
-        control: {
-            type: 'radio',
-            options: [undefined, true, false],
-        },
-        table: {
-            type: { summary: 'boolean' },
-        },
-    },
-    defaultSelected: {
-        defaultValue: undefined,
-        description: 'Whether the input is selected by default in uncontrolled mode',
-        control: {
-            type: 'radio',
-            options: [undefined, true, false],
-        },
-        table: {
-            type: { summary: 'boolean' },
-        },
-    },
-};
-export const IS_INDETERMINATE_ARG = {
-    isIndeterminate: {
-        defaultValue: undefined,
-        description: 'Whether the input is indeterminate in controlled mode',
-        control: {
-            type: 'radio',
-            options: [undefined, true, false],
-        },
-        table: {
-            type: { summary: 'boolean' },
-        },
-    },
-};
-export const SELECTED_KEY_ARG = {
-    selectedKey: {
-        defaultValue: undefined,
-        description: 'The selected value in controlled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'string' },
-        },
-    },
-    defaultSelectedKey: {
-        defaultValue: undefined,
-        description: 'The default selected value in uncontrolled mode',
-        control: 'text',
-        table: {
-            type: { summary: 'string' },
-        },
-    },
-};
-export const ICON_ARG = {
-    icon: {
-        // defaultValue: true,
-        description: 'Whether to show an icon on the element',
-        control: {
-            type: 'boolean',
-        },
-        table: {
-            type: { summary: 'boolean' },
-            defaultValue: { summary: true },
-        },
-    },
-};
-
-        

package/es/stories/components/ConfirmDeletionDialogForm.js

@@ -1,32 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { DialogForm, Field, Paragraph, Input, Text, } from '../../index';
-export function ConfirmDeletionDialogForm(props) {
-    let { name, onSubmit, onDismiss } = props;
-    return (_jsxs(DialogForm, { title: "Delete Deployment", submitProps: {
-            label: 'Delete',
-            theme: 'danger',
-        }, cancelProps: {
-            label: 'I changed my mind',
-        }, onSubmit: onSubmit, onDismiss: onDismiss, children: [_jsxs(Paragraph, { children: ["To delete the instance, please, enter its full name:", ' ', _jsx(Text.Strong, { children: name }, void 0)] }, void 0), _jsx(Field, { name: "name", rules: [
-                    {
-                        required: true,
-                        message: 'This field is required',
-                    },
-                    {
-                        async validator(rule, value) {
-                            if (value !== name) {
-                                throw new Error('Incorrect name');
-                            }
-                        },
-                    },
-                ], children: _jsx(Input.Text, { placeholder: "Enter the name of the instance" }, void 0) }, void 0)] }, void 0));
-}
-
-        

package/es/stories/components/DialogFormApp.js

@@ -1,15 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, DialogTrigger } from '../../index';
-import { ConfirmDeletionDialogForm } from './ConfirmDeletionDialogForm';
-export function DialogFormApp() {
-    return (_jsxs(DialogTrigger, { children: [_jsx(Button, { children: "Delete the instance" }, void 0), _jsx(ConfirmDeletionDialogForm, { name: "instanceName" }, void 0)] }, void 0));
-}
-
-        

package/es/stories/components/StyledButton.js

@@ -1,33 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { tasty } from '../../tasty';
-import { Button } from '../../components/actions';
-export const StyledButton = tasty(Button, {
-    styles: {
-        padding: '3x 6x',
-        preset: 't1',
-    },
-});
-export const GlobalStyledHeading = tasty('.myButton', {
-    display: 'inline-block',
-    padding: '1x 2x',
-    preset: 't2',
-    border: true,
-    radius: true,
-    fill: {
-        '': '#white',
-        ':hover': '#purple.20',
-    },
-    color: '#dark',
-});
-export function Block() {
-    return (_jsxs(_Fragment, { children: [_jsx(StyledButton, { children: "123" }, void 0), _jsx(GlobalStyledHeading, {}, void 0)] }, void 0));
-}
-
-        

package/es/stories/lists/baseProps.js

@@ -1,39 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-9917823
- * Released under the MIT license.
- */
-
-import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, CONTAINER_STYLES, DIMENSION_STYLES, FLOW_STYLES, OUTER_STYLES, POSITION_STYLES, TEXT_STYLES, } from '../../tasty';
-const allStyles = Array.from(new Set([
-    ...BASE_STYLES,
-    ...POSITION_STYLES,
-    ...CONTAINER_STYLES,
-    ...BLOCK_STYLES,
-    ...COLOR_STYLES,
-    ...FLOW_STYLES,
-    ...OUTER_STYLES,
-    ...DIMENSION_STYLES,
-    ...TEXT_STYLES,
-    ...POSITION_STYLES,
-]));
-export const baseProps = [
-    'qa',
-    'qaVal',
-    'block',
-    'inline',
-    'style',
-    'styles',
-    'css',
-    'styleName',
-    'hidden',
-    'disabled',
-    'mods',
-    'breakpoints',
-    'isHidden',
-    'element',
-    ...allStyles,
-];
-
-        

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

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-declare const _Submit: import("react").ForwardRefExoticComponent<Pick<any, string | number | symbol> & import("react").RefAttributes<unknown>>;
-export { _Submit as Submit };

package/types/components/forms/Form/Field.d.ts

@@ -1,41 +0,0 @@
-import { ReactElement, ReactNode } from 'react';
-import { LabelPosition, OptionalFieldBaseProps, ValidationRule } from '../../../shared';
-import { Styles } from '../../../tasty';
-import { CubeFormInstance } from './useForm';
-import { FieldTypes } from './types';
-export interface CubeFieldProps<T extends FieldTypes> extends OptionalFieldBaseProps {
-    /** The initial value of the input. */
-    defaultValue?: any;
-    /** The type of the input. `Input`, `Checkbox`, RadioGroup`, `Select`, `ComboBox` etc... */
-    type?: string;
-    /** The unique ID of the field */
-    id?: string;
-    /** The id prefix for the field to avoid collisions between forms */
-    idPrefix?: string;
-    children?: ReactElement | ((CubeFormInstance: any) => ReactElement);
-    /** Function that checks whether to perform update of the form state. */
-    shouldUpdate?: boolean | ((prevValues: any, nextValues: any) => boolean);
-    /** Validation rules */
-    rules?: ValidationRule[];
-    /** The form instance */
-    form?: CubeFormInstance<T>;
-    /** The message for the field or text for the error */
-    message?: ReactNode;
-    /** The description for the field */
-    description?: ReactNode;
-    /** Tooltip for the label that explains something. */
-    tooltip?: ReactNode;
-    /** Field name. It's used as a key the form data. */
-    name?: string[] | string;
-    /** Whether the field is hidden. */
-    isHidden?: boolean;
-    /** Whether the field is disabled. */
-    isDisabled?: boolean;
-    /** Whether the field is loading. */
-    isLoading?: boolean;
-    styles?: Styles;
-    labelPosition?: LabelPosition;
-    labelStyles?: Styles;
-    labelSuffix?: ReactNode;
-}
-export declare function Field<T extends FieldTypes>(allProps: CubeFieldProps<T>): JSX.Element | null;