@cube-dev/ui-kit 0.14.14 → 0.14.16

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @cube-dev/ui-kit
 
+## 0.14.16
+
+### Patch Changes
+
+- [#283](https://github.com/cube-js/cube-ui-kit/pull/283) [`f07722e`](https://github.com/cube-js/cube-ui-kit/commit/f07722e11a3b61edf16a7ec67d23ba39abccee4f) Thanks [@tenphi](https://github.com/tenphi)! - Fix label positioning for side layout in Form.
+  Fix RangeSlider's usage inside forms with `labelPosition="side"`.
+
+## 0.14.15
+
+### Patch Changes
+
+- [#281](https://github.com/cube-js/cube-ui-kit/pull/281) [`a30cf7d`](https://github.com/cube-js/cube-ui-kit/commit/a30cf7d8966a52a5a5c90af4875de6bd9eae1a00) Thanks [@tenphi](https://github.com/tenphi)! - Checkbox now has an abilility to have both a label and a text value inside forms.
+
 ## 0.14.14
 
 ### Patch Changes

package/cjs/_internal/hooks/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-chained-callback.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-deprecation-warning.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-event.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-sync-ref.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-timer/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-timer/timer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/hooks/use-timer/use-timer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/_internal/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/Base.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/Block.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/GlobalStyles.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/GridProvider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/HiddenInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/OpenTrasition.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/Root.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/Action.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/Button/Button.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/Button/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/ButtonGroup/ButtonGroup.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/actions/use-action.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/ActiveZone/ActiveZone.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Alert/Alert.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Alert/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Alert/types.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Alert/use-alert.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Avatar/Avatar.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Badge/Badge.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Card/Card.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Content.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/CopySnippet/CopySnippet.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/CopySnippet/index.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Divider.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Footer.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Header.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Paragraph.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Placeholder/Placeholder.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/PrismCode/PrismCode.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Result/Result.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Skeleton/Skeleton.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Tag/Tag.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Text.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/content/Title.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/forms/Checkbox/Checkbox.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 
@@ -23,6 +23,7 @@ const HiddenInput_1 = require("../../HiddenInput");
 const Form_1 = require("../Form");
 const FieldWrapper_1 = require("../FieldWrapper");
 const nullableValue_1 = require("../../../utils/react/nullableValue");
+const Text_1 = require("../../content/Text");
 const CheckboxGroup_1 = require("./CheckboxGroup");
 const context_1 = require("./context");
 function CheckOutlined() {
@@ -38,14 +39,11 @@ const CheckboxWrapperElement = (0, tasty_1.tasty)({
         position: 'relative',
         display: 'flex',
         placeItems: 'center start',
+        placeContent: 'baseline',
         gap: '1x',
         flow: 'row',
         preset: 'default',
         cursor: 'pointer',
-        margin: {
-            '': 0,
-            'inside-form & side-label': '1.5x top',
-        },
     },
 });
 const CheckboxElement = (0, tasty_1.tasty)({
@@ -85,7 +83,6 @@ function Checkbox(props, ref) {
     props = (0, provider_1.useProviderProps)(props);
     props = (0, Form_1.useFormProps)(props);
     let { qa, isIndeterminate = false, isDisabled = false, insideForm, isRequired, autoFocus, children, label, extra, validationState, labelProps, labelStyles, labelPosition, necessityLabel, necessityIndicator, message, description, requiredMark = true, tooltip, isHidden, labelSuffix, ...otherProps } = props;
-    label = label || children;
     // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.
     // 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.
@@ -134,12 +131,13 @@ function Checkbox(props, ref) {
         'side-label': labelPosition === 'side',
         'inside-form': insideForm,
     };
-    const checkboxField = ((0, jsx_runtime_1.jsxs)(CheckboxWrapperElement, { isHidden: isHidden, mods: mods, styles: { position: 'relative' }, children: [(0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { "data-qa": qa || 'Checkbox', ...(0, react_2.mergeProps)(inputProps, focusProps), ref: inputRef }, void 0), (0, jsx_runtime_1.jsx)(CheckboxElement, { qa: "Checkbox", mods: mods, styles: inputStyles, children: markIcon }, void 0)] }, void 0));
+    const checkboxField = ((0, jsx_runtime_1.jsxs)(CheckboxWrapperElement, { isHidden: isHidden, mods: mods, styles: { position: 'relative' }, children: [(0, jsx_runtime_1.jsx)(HiddenInput_1.HiddenInput, { "data-qa": qa || 'Checkbox', ...(0, react_2.mergeProps)(inputProps, focusProps), ref: inputRef }, void 0), (0, jsx_runtime_1.jsx)(CheckboxElement, { qa: "Checkbox", mods: mods, styles: inputStyles, children: markIcon }, void 0), children && (0, jsx_runtime_1.jsx)(Text_1.Text, { children: children }, void 0)] }, void 0));
     if (insideForm && !groupState) {
         return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
                 as: 'label',
                 labelPosition,
                 label,
+                children,
                 extra,
                 styles,
                 isRequired,
@@ -159,11 +157,11 @@ function Checkbox(props, ref) {
                 ref: domRef,
             } }, void 0));
     }
-    return ((0, jsx_runtime_1.jsxs)(CheckboxWrapperElement, { as: "label", styles: styles, isHidden: isHidden, ...hoverProps, ...(0, tasty_1.filterBaseProps)(otherProps), ref: domRef, children: [checkboxField, label && ((0, jsx_runtime_1.jsx)(tasty_1.Element, { styles: labelStyles, mods: {
+    return ((0, jsx_runtime_1.jsxs)(CheckboxWrapperElement, { as: "label", styles: styles, isHidden: isHidden, ...hoverProps, ...(0, tasty_1.filterBaseProps)(otherProps), ref: domRef, children: [checkboxField, label ? ((0, jsx_runtime_1.jsx)(tasty_1.Element, { styles: labelStyles, mods: {
                     invalid: validationState === 'invalid',
                     valid: validationState === 'valid',
                     disabled: isDisabled,
-                }, ...(0, tasty_1.filterBaseProps)(labelProps), children: label }, void 0))] }, void 0));
+                }, ...(0, tasty_1.filterBaseProps)(labelProps), children: label }, void 0)) : null] }, void 0));
 }
 /**
  * Checkboxes allow users to select multiple items from a list of individual items,

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 
@@ -25,10 +25,6 @@ const WRAPPER_STYLES = {
         '': '1fr',
         'has-sider': 'max-content 1fr',
     },
-    gap: {
-        '': '0',
-        'has-sider': '1x',
-    },
     placeItems: 'baseline start',
 };
 const CheckGroupElement = (0, tasty_1.tasty)({
@@ -45,7 +41,6 @@ const CheckGroupElement = (0, tasty_1.tasty)({
             '': '1x',
             horizontal: '1x 2x',
         },
-        padding: '(1x - 1bw) 0',
     },
 });
 function CheckboxGroup(props, ref) {

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

package/cjs/components/forms/FieldWrapper.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 
@@ -25,22 +25,21 @@ const FieldElement = (0, tasty_1.tasty)({
         display: 'grid',
         gridColumns: {
             '': '1fr',
-            'has-sider': '@(label-width, auto) 1fr',
+            'has-sider': '@(full-label-width, auto) 1fr',
         },
-        gap: {
-            '': '1x',
-            'has-sider': '@(column-gap, 1x)',
-        },
-        placeItems: 'start stretch',
+        gap: 0,
+        placeItems: 'baseline stretch',
+        '@full-label-width': '(@label-width + 1x)',
         LabelArea: {
             display: 'block',
             width: {
                 '': 'initial',
                 'has-sider': '@label-width',
             },
-            padding: {
-                '': 'initial',
-                'has-sider': '1.25x top',
+            margin: {
+                '': '1x bottom',
+                'has-sider': '1x right',
+                ':empty': '0',
             },
         },
         InputArea: {

package/cjs/components/forms/FileInput/FileInput.js

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */
 

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

@@ -1,7 +1,7 @@
 /**
  * @license MIT
  * author: Cube Dev Team
- * @cube-dev/ui-kit v0.14.14
+ * @cube-dev/ui-kit v0.14.16
  * Released under the MIT license.
  */