@cube-dev/ui-kit 0.0.0-canary-423c3d2 → 0.0.0-canary-ed2a55b

package/es/components/forms/Checkbox/Checkbox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -12,57 +12,62 @@ import { useCheckbox, useCheckboxGroupItem } from '@react-aria/checkbox';
 import { useHover } from '@react-aria/interactions';
 import { useToggleState } from '@react-stately/toggle';
 import { useProviderProps } from '../../../provider';
-import { BLOCK_STYLES, extractStyles, filterBaseProps, OUTER_STYLES, } from '../../../tasty';
-import { Base } from '../../Base';
+import { BLOCK_STYLES, Element, extractStyles, filterBaseProps, OUTER_STYLES, tasty, } from '../../../tasty';
 import { useFocus } from '../../../utils/react/interactions';
 import { mergeProps } from '../../../utils/react';
 import { INLINE_LABEL_STYLES, LABEL_STYLES } from '../Label';
 import { HiddenInput } from '../../HiddenInput';
-import { useFormProps } from '../Form/Form';
+import { useFormProps } from '../Form';
 import { FieldWrapper } from '../FieldWrapper';
 import { CheckboxGroup } from './CheckboxGroup';
 import { CheckboxGroupContext } from './context';
 import { castNullableIsSelected, } from '../../../utils/react/nullableValue';
-import { useContextStyles } from '../../../providers/StyleProvider';
 const CheckOutlined = () => (_jsx("svg", { width: "10", height: "8", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M3.417 7.604l-.017.018-3.4-3.4 1.433-1.433 1.985 1.985L8.192 0l1.432 1.433-6.189 6.189-.018-.018z", fill: "currentColor" }, void 0) }, void 0));
 const IndeterminateOutline = () => (_jsx("svg", { width: "9", height: "3", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M0 .044v2.001l.026.025h8.063V.044H0z", fill: "#fff" }, void 0) }, void 0));
-const DEFAULT_STYLES = {
-    position: 'relative',
-    display: 'flex',
-    placeItems: 'center start',
-    gap: '1x',
-    flow: 'row',
-    preset: 'default',
-    cursor: 'pointer',
-};
-const INPUT_STYLES = {
-    display: 'grid',
-    placeItems: 'center',
-    radius: '.5r',
-    fill: {
-        '': '#white',
-        'checked | indeterminate': '#purple-text',
-        'invalid & !checked': '#white',
-        'invalid & checked': '#danger-text',
-        disabled: '#dark.12',
+const CheckboxWrapperElement = tasty({
+    as: 'label',
+    qa: 'CheckboxWrapper',
+    styles: {
+        position: 'relative',
+        display: 'flex',
+        placeItems: 'center start',
+        gap: '1x',
+        flow: 'row',
+        preset: 'default',
+        cursor: 'pointer',
     },
-    color: {
-        '': '#white',
-        'disabled & !checked & !indeterminate': '#clear',
+});
+const CheckboxElement = tasty({
+    qa: 'Checkbox',
+    styles: {
+        display: 'grid',
+        placeItems: 'center',
+        radius: '.5r',
+        fill: {
+            '': '#white',
+            'checked | indeterminate': '#purple-text',
+            'invalid & !checked': '#white',
+            'invalid & checked': '#danger-text',
+            disabled: '#dark.12',
+        },
+        color: {
+            '': '#white',
+            'disabled & !checked & !indeterminate': '#clear',
+        },
+        border: {
+            '': '#dark.30',
+            invalid: '#danger-text.50',
+            'disabled | ((indeterminate | checked) & !invalid)': '#clear',
+        },
+        width: '(2x - 2bw)',
+        height: '(2x - 2bw)',
+        outline: {
+            '': '#purple-03.0',
+            focused: '#purple-03',
+        },
+        transition: 'theme',
     },
-    border: {
-        '': '#dark.30',
-        invalid: '#danger-text.50',
-        'disabled | ((indeterminate | checked) & !invalid)': '#clear',
-    },
-    width: '(2x - 2bw)',
-    height: '(2x - 2bw)',
-    outline: {
-        '': '#purple-03.0',
-        focused: '#purple-03',
-    },
-    transition: 'theme',
-};
+});
 function Checkbox(props, ref) {
     props = castNullableIsSelected(props);
     let originalProps = props;
@@ -74,20 +79,10 @@ function Checkbox(props, ref) {
     // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,
     // but since the checkbox won't move in and out of a group, it should be safe.
     let groupState = useContext(CheckboxGroupContext);
-    let wrapperContextStyles = useContextStyles('Checkbox_Wrapper', props);
-    let inputContextStyles = useContextStyles('Checkbox', props);
-    let labelContextStyles = useContextStyles('Checkbox_Label', props);
-    let styles = extractStyles(props, OUTER_STYLES, {
-        ...(insideForm && !groupState ? {} : DEFAULT_STYLES),
-        ...wrapperContextStyles,
-    });
-    let inputStyles = extractStyles(props, BLOCK_STYLES, {
-        ...INPUT_STYLES,
-        ...inputContextStyles,
-    });
+    let styles = extractStyles(props, OUTER_STYLES);
+    let inputStyles = extractStyles(props, BLOCK_STYLES);
     labelStyles = {
         ...(insideForm && !groupState ? LABEL_STYLES : INLINE_LABEL_STYLES),
-        ...labelContextStyles,
         ...labelStyles,
     };
     if (!insideForm) {
@@ -123,15 +118,16 @@ function Checkbox(props, ref) {
             console.warn('CubeUIKit: A <Checkbox> element within a <CheckboxGroup> requires a `value` property.');
         }
     }
-    let checkboxField = (_jsxs(Base, { qa: "CheckboxContainer", isHidden: isHidden, styles: { position: 'relative' }, children: [_jsx(HiddenInput, { "data-qa": qa || 'Checkbox', ...mergeProps(inputProps, focusProps), ref: inputRef }, void 0), _jsx(Base, { qa: "CheckboxIcon", mods: {
-                    checked: inputProps.checked,
-                    indeterminate: isIndeterminate,
-                    invalid: validationState === 'invalid',
-                    valid: validationState === 'valid',
-                    disabled: isDisabled,
-                    hovered: isHovered,
-                    focused: isFocused,
-                }, styles: inputStyles, children: markIcon }, void 0)] }, void 0));
+    const mods = {
+        checked: inputProps.checked,
+        indeterminate: isIndeterminate,
+        invalid: validationState === 'invalid',
+        valid: validationState === 'valid',
+        disabled: isDisabled,
+        hovered: isHovered,
+        focused: isFocused,
+    };
+    const checkboxField = (_jsxs(CheckboxWrapperElement, { isHidden: isHidden, mods: mods, styles: { position: 'relative' }, children: [_jsx(HiddenInput, { "data-qa": qa || 'Checkbox', ...mergeProps(inputProps, focusProps), ref: inputRef }, void 0), _jsx(CheckboxElement, { qa: "Checkbox", mods: mods, styles: inputStyles, children: markIcon }, void 0)] }, void 0));
     if (insideForm && !groupState) {
         return (_jsx(FieldWrapper, { ...{
                 as: 'label',
@@ -155,7 +151,7 @@ function Checkbox(props, ref) {
                 ref: domRef,
             } }, void 0));
     }
-    return (_jsxs(Base, { as: "label", styles: styles, isHidden: isHidden, ...hoverProps, ...filterBaseProps(otherProps), ref: domRef, children: [checkboxField, label && (_jsx(Base, { styles: labelStyles, mods: {
+    return (_jsxs(CheckboxWrapperElement, { as: "label", styles: styles, isHidden: isHidden, ...hoverProps, ...filterBaseProps(otherProps), ref: domRef, children: [checkboxField, label && (_jsx(Element, { styles: labelStyles, mods: {
                     invalid: validationState === 'invalid',
                     valid: validationState === 'valid',
                     disabled: isDisabled,

package/es/components/forms/Checkbox/CheckboxGroup.js

@@ -1,25 +1,22 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { useDOMRef } from '@react-spectrum/utils';
-import { LABEL_STYLES } from '../Label';
 import { useProviderProps } from '../../../provider';
 import { useCheckboxGroup } from '@react-aria/checkbox';
 import { useCheckboxGroupState } from '@react-stately/checkbox';
 import { FormContext, useFormProps } from '../Form/Form';
 import { CheckboxGroupContext } from './context';
-import { BLOCK_STYLES, extractStyles, OUTER_STYLES, } from '../../../tasty';
-import { Base } from '../../Base';
+import { BLOCK_STYLES, extractStyles, OUTER_STYLES, tasty, } from '../../../tasty';
 import { FieldWrapper } from '../FieldWrapper';
 import { castNullableArrayValue, } from '../../../utils/react/nullableValue';
-import { useContextStyles } from '../../../providers/StyleProvider';
-const STYLES = {
+const WRAPPER_STYLES = {
     display: 'grid',
     gridColumns: {
         '': '1fr',
@@ -31,45 +28,34 @@ const STYLES = {
     },
     placeItems: 'baseline start',
 };
-const GROUP_STYLES = {
-    display: 'flex',
-    placeItems: 'start',
-    placeContent: 'start',
-    flow: {
-        '': 'column',
-        horizontal: 'row wrap',
+const CheckGroupElement = tasty({
+    qa: 'CheckboxGroup',
+    styles: {
+        display: 'flex',
+        placeItems: 'start',
+        placeContent: 'start',
+        flow: {
+            '': 'column',
+            horizontal: 'row wrap',
+        },
+        gap: {
+            '': '1x',
+            horizontal: '1x 2x',
+        },
+        padding: '(1x - 1bw) 0',
     },
-    gap: {
-        '': '1x',
-        horizontal: '1x 2x',
-    },
-    padding: '(1x - 1bw) 0',
-};
+});
 function CheckboxGroup(props, ref) {
     props = castNullableArrayValue(props);
     props = useProviderProps(props);
     props = useFormProps(props);
     let { isDisabled, isRequired, necessityIndicator, necessityLabel, label, extra, labelPosition = 'top', validationState, children, orientation = 'vertical', message, description, labelStyles, requiredMark = true, tooltip, ...otherProps } = props;
     let domRef = useDOMRef(ref);
-    let wrapperContextStyles = useContextStyles('CheckboxGroup_Wrapper', props);
-    let groupContextStyles = useContextStyles('CheckboxGroup', props);
-    let labelContextStyles = useContextStyles('CheckboxGroup_Label', props);
-    let styles = extractStyles(otherProps, OUTER_STYLES, {
-        ...STYLES,
-        ...wrapperContextStyles,
-    });
-    let groupStyles = extractStyles(otherProps, BLOCK_STYLES, {
-        ...GROUP_STYLES,
-        ...groupContextStyles,
-    });
-    labelStyles = {
-        ...LABEL_STYLES,
-        ...labelContextStyles,
-        ...labelStyles,
-    };
+    let styles = extractStyles(otherProps, OUTER_STYLES, WRAPPER_STYLES);
+    let groupStyles = extractStyles(otherProps, BLOCK_STYLES);
     let state = useCheckboxGroupState(props);
     let { groupProps, labelProps } = useCheckboxGroup(props, state);
-    let radioGroup = (_jsx(Base, { qa: "CheckboxGroup", styles: groupStyles, mods: {
+    let radioGroup = (_jsx(CheckGroupElement, { styles: groupStyles, mods: {
             horizontal: orientation === 'horizontal',
         }, children: _jsx(FormContext.Provider, { value: {
                 isDisabled,

package/es/components/forms/Checkbox/context.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/FieldWrapper.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -15,7 +15,7 @@ import { tasty } from '../../tasty';
 import { TooltipProvider } from '../overlays/Tooltip/TooltipProvider';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { wrapNodeIfPlain } from '../../utils/react';
-const RawField = tasty({
+const FieldElement = tasty({
     qa: 'Field',
     styles: {
         display: 'grid',
@@ -45,7 +45,7 @@ const RawField = tasty({
         },
     },
 });
-const RawMessage = tasty({
+const MessageElement = tasty({
     qa: 'Field_Message',
     styles: {
         preset: 'default',
@@ -70,7 +70,7 @@ function FieldWrapper(props, ref) {
         invalid: validationState === 'invalid',
         valid: validationState === 'valid',
     };
-    return (_jsxs(RawField, { as: as || 'div', ref: ref, mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? (_jsxs("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, _jsxs("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && (_jsx(RawMessage, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
+    return (_jsxs(FieldElement, { as: as || 'div', ref: ref, mods: mods, isHidden: isHidden, styles: styles, ...fieldProps, children: [labelComponent || descriptionComponent ? (_jsxs("div", { "data-element": "LabelArea", children: [labelComponent, descriptionComponent] }, void 0)) : null, _jsxs("div", { "data-element": "InputArea", children: [Component, message && !isDisabled && (_jsx(MessageElement, { mods: mods, styles: messageStyles, role: validationState === 'invalid' ? 'alert' : undefined, children: message }, void 0))] }, void 0)] }, void 0));
 }
 /**
  * A wrapper for form fields to provide additional decoration for inputs.

package/es/components/forms/FileInput/FileInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -9,55 +9,56 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useCallback, useImperativeHandle, useRef, useState, } from 'react';
 import { useProviderProps } from '../../../provider';
 import { Action } from '../../actions/Action';
-import { CONTAINER_STYLES, extractStyles, } from '../../../tasty';
+import { CONTAINER_STYLES, extractStyles, tasty, } from '../../../tasty';
 import { createFocusableRef } from '@react-spectrum/utils';
 import { FieldWrapper } from '../FieldWrapper';
-import { useContextStyles } from '../../../providers/StyleProvider';
-const DEFAULT_WRAPPER_STYLES = {
-    display: 'inline-flex',
-    position: 'relative',
-    preset: 't3',
-    padding: '.75x 1x',
-    gap: '1x',
-    flow: 'row',
-    placeItems: 'center start',
-    fill: {
-        '': '#white',
-        'drag-hover': '#purple.16',
-    },
-    border: true,
-    radius: true,
-    cursor: 'pointer',
-    overflow: 'hidden',
-    Button: {
-        radius: 'round',
+const FileInputElement = tasty(Action, {
+    styles: {
+        display: 'inline-flex',
+        position: 'relative',
+        preset: 't3',
+        padding: '.75x 1x',
+        gap: '1x',
+        flow: 'row',
+        placeItems: 'center start',
         fill: {
-            '': '#light',
-            'hovered | focused | pressed': '#purple-04',
-            disabled: '#light',
+            '': '#white',
+            'drag-hover': '#purple.16',
         },
-        color: '#dark',
-        padding: '.5x 1x',
-        transition: 'fill',
-    },
-    Placeholder: {
-        color: '#dark-02',
-    },
-    Value: {
-        color: '#dark-02',
-    },
-    Input: {
-        position: 'absolute',
-        top: '-50px',
-        right: 0,
-        bottom: 0,
-        left: 0,
-        radius: '@content-radius',
-        // opacity: 0,
+        border: true,
+        radius: true,
         cursor: 'pointer',
-        zIndex: 10,
+        overflow: 'hidden',
+        Button: {
+            radius: 'round',
+            fill: {
+                '': '#light',
+                'hovered | focused | pressed': '#purple-04',
+                disabled: '#light',
+            },
+            color: '#dark',
+            padding: '.5x 1x',
+            transition: 'fill',
+        },
+        Placeholder: {
+            color: '#dark-02',
+        },
+        Value: {
+            color: '#dark-02',
+        },
+        Input: {
+            position: 'absolute',
+            top: '-50px',
+            right: 0,
+            bottom: 0,
+            left: 0,
+            radius: '@content-radius',
+            // opacity: 0,
+            cursor: 'pointer',
+            zIndex: 10,
+        },
     },
-};
+});
 function extractContents(element, callback) {
     const files = element === null || element === void 0 ? void 0 : element.files;
     if (files && files.length > 0) {
@@ -76,11 +77,6 @@ function FileInput(props, ref) {
     let defaultInputRef = useRef(null);
     inputRef = inputRef || defaultInputRef;
     let styles = extractStyles(otherProps, CONTAINER_STYLES);
-    inputStyles = {
-        ...DEFAULT_WRAPPER_STYLES,
-        ...useContextStyles('FileInput', otherProps),
-        ...inputStyles,
-    };
     const onLocalChange = useCallback((event) => {
         const value = event.target.value;
         if (type === 'file') {
@@ -103,7 +99,7 @@ function FileInput(props, ref) {
             return inputRef === null || inputRef === void 0 ? void 0 : inputRef.current;
         },
     }));
-    const fileInput = (_jsxs(Action, { qa: qa || 'FileInput', styles: inputStyles, isDisabled: isDisabled, ref: domRef, mods: {
+    const fileInput = (_jsxs(FileInputElement, { qa: qa || 'FileInput', styles: inputStyles, isDisabled: isDisabled, ref: domRef, mods: {
             selected: !!value,
             'drag-hover': dragHover,
         }, onKeyDown: (e) => {

package/es/components/forms/Form/Field.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Form/Form.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -9,12 +9,21 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useDOMRef } from '@react-spectrum/utils';
 import { Provider, useProviderProps } from '../../../provider';
 import { createContext, forwardRef, useContext, useEffect, useRef, } from 'react';
-import { Base } from '../../Base';
-import { CONTAINER_STYLES, extractStyles, filterBaseProps, } from '../../../tasty';
+import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, } from '../../../tasty';
 import { useForm } from './useForm';
 import { useCombinedRefs } from '../../../utils/react';
 import { timeout } from '../../../utils/promise';
 export const FormContext = createContext({});
+const FormElement = tasty({
+    as: 'form',
+    qa: 'Form',
+    styles: {
+        display: 'block',
+        flow: 'column',
+        gap: '2x',
+        '@label-width': '25x',
+    },
+});
 export function useFormProps(props) {
     const ctx = useContext(FormContext);
     return { ...ctx, ...props };
@@ -26,16 +35,9 @@ const formPropNames = new Set([
     'method',
     'target',
 ]);
-const DEFAULT_STYLES = {
-    display: 'block',
-    flow: 'column',
-    gap: '2x',
-    '@label-width': '25x',
-};
 function Form(props, ref) {
     props = useProviderProps(props);
     let { qa, name, children, labelPosition = 'top', isRequired, necessityIndicator, isDisabled, isReadOnly, validationState, labelStyles, validateTrigger, defaultValues, onValuesChange, requiredMark = true, form, labelWidth, onSubmit, onSubmitFailed, ...otherProps } = props;
-    let styles;
     const firstRunRef = useRef(true);
     ref = useCombinedRefs(ref);
     let onSubmitCallback;
@@ -80,7 +82,7 @@ function Form(props, ref) {
         onSubmit: onSubmitCallback,
         onValuesChange,
     });
-    styles = extractStyles(otherProps, CONTAINER_STYLES, DEFAULT_STYLES);
+    let styles = extractStyles(otherProps, CONTAINER_STYLES);
     if (labelWidth) {
         styles['@label-width'] = labelWidth;
     }
@@ -106,7 +108,7 @@ function Form(props, ref) {
             form === null || form === void 0 ? void 0 : form.setInitialFieldsValue(defaultValues);
         }
     }, [defaultValues]);
-    return (_jsx(Base, { as: "form", qa: "Form", ...filterBaseProps(otherProps, { propNames: formPropNames }), onSubmit: onSubmitCallback, noValidate: true, styles: styles, ref: domRef, mods: {
+    return (_jsx(FormElement, { ...filterBaseProps(otherProps, { propNames: formPropNames }), onSubmit: onSubmitCallback, noValidate: true, styles: styles, ref: domRef, mods: {
             'has-sider': labelPosition === 'side',
         }, children: _jsx(FormContext.Provider, { value: ctx, children: _jsx(Provider, { insideForm: true, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, validationState: validationState, children: children }, void 0) }, void 0) }, void 0));
 }

package/es/components/forms/Form/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Form/useForm.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Form/validation.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Input/Input.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Input/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/Label.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 
@@ -10,7 +10,6 @@ import { useDOMRef } from '@react-spectrum/utils';
 import { forwardRef } from 'react';
 import { useProviderProps } from '../../provider';
 import { CONTAINER_STYLES, extractStyles, filterBaseProps, tasty, } from '../../tasty';
-import { useContextStyles } from '../../providers/StyleProvider';
 const REQUIRED_ICON = (_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',
@@ -51,7 +50,7 @@ export const LABEL_STYLES = {
         side: '@(label-width, initial)',
     },
 };
-const RawLabel = tasty({
+const LabelElement = tasty({
     as: 'label',
     qa: 'Label',
     styles: LABEL_STYLES,
@@ -60,8 +59,7 @@ function Label(props, ref) {
     props = useProviderProps(props);
     let { as, qa, children, labelPosition = 'top', isRequired, necessityIndicator = isRequired != null ? 'icon' : null, includeNecessityIndicatorInAccessibilityName = false, htmlFor, isDisabled, validationState, for: labelFor, onClick, ...otherProps } = props;
     let domRef = useDOMRef(ref);
-    const contextStyles = useContextStyles('Label', otherProps);
-    const styles = extractStyles(otherProps, CONTAINER_STYLES, contextStyles || {});
+    const styles = extractStyles(otherProps, CONTAINER_STYLES);
     let formatMessage = (message) => INTL_MESSAGES[message];
     let necessityLabel = isRequired
         ? formatMessage('(required)')
@@ -69,7 +67,7 @@ function Label(props, ref) {
     let icon = (_jsx("span", { "aria-label": includeNecessityIndicatorInAccessibilityName
             ? formatMessage('(required)')
             : undefined, children: REQUIRED_ICON }, void 0));
-    return (_jsx(RawLabel, { ...filterBaseProps(otherProps), onClick: onClick, ref: domRef, styles: styles, htmlFor: labelFor || htmlFor, mods: {
+    return (_jsx(LabelElement, { ...filterBaseProps(otherProps), onClick: onClick, ref: domRef, styles: styles, htmlFor: labelFor || htmlFor, mods: {
             side: labelPosition === 'side',
             disabled: isDisabled,
             invalid: validationState === 'invalid',

package/es/components/forms/NumberInput/NumberInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/NumberInput/StepButton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */
 

package/es/components/forms/PasswordInput/PasswordInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-423c3d2
+ * @cube-dev/ui-kit v0.0.0-canary-ed2a55b
  * Released under the MIT license.
  */