@cube-dev/ui-kit 0.0.0-canary-0d83be6 → 0.0.0-canary-17c0e92

package/dist/components/form/Form/SubmitButton/SubmitButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useProviderProps } from "../../../../provider.js";
 import { Button } from "../../../actions/index.js";
 import { useFormProps } from "../Form.js";

package/dist/components/form/Form/SubmitError.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { FormContext } from "./Form.js";
 import { Alert } from "../../content/Alert/Alert.js";
 import { forwardRef, isValidElement, useContext } from "react";

package/dist/components/form/Form/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useForm } from "./use-form.js";
 import { FormContext, _Form, useFormProps } from "./Form.js";
 import { useField } from "./use-field/use-field.js";

package/dist/components/form/Form/use-field/use-field-props.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { mergeProps } from "../../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { warn } from "../../../../utils/warnings.js";

package/dist/components/form/Form/use-field/use-field.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useIsFirstRender } from "../../../../_internal/hooks/use-is-first-render.js";
 import { delayValidationRule } from "../validation.js";

package/dist/components/form/Form/use-form.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { dotize } from "../../../tasty/utils/dotize.js";
 import { applyRules } from "./validation.js";
 import { useRef, useState } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { validate } from "email-validator";
 import validUrl from "valid-url";
 

package/dist/components/form/Label.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/form/wrapper.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { mergeProps } from "../../utils/react/mergeProps.js";
 import { FieldWrapper } from "./FieldWrapper/FieldWrapper.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/helpers/DisplayTransition/DisplayTransition.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 
 //#region src/components/helpers/DisplayTransition/DisplayTransition.tsx

package/dist/components/helpers/IconSwitch/IconSwitch.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { DisplayTransition } from "../DisplayTransition/DisplayTransition.js";
 import { isValidElement, useCallback, useLayoutEffect, useRef, useState } from "react";

package/dist/components/layout/Flex.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/layout/Flow.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/layout/Grid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/layout/Panel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, DIMENSION_STYLES, OUTER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";
 import { forwardRef, useMemo } from "react";

package/dist/components/layout/Prefix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles, parseStyle } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/layout/ResizablePanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../tasty/tasty.js";
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";

package/dist/components/layout/Space.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/layout/Suffix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles, parseStyle } from "../../tasty/utils/styles.js";
 import { CONTAINER_STYLES } from "../../tasty/styles/list.js";
 import { tasty } from "../../tasty/tasty.js";

package/dist/components/navigation/Tabs/DraggableTabList.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useCallback, useMemo } from "react";
 import { ListDropTargetDelegate, ListKeyboardDelegate, useDraggableCollection, useDroppableCollection } from "react-aria";

package/dist/components/navigation/Tabs/EditableTitle.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { EditableTitleInputElement, HiddenMeasure } from "./styled.js";
 import { useLayoutEffect, useRef, useState } from "react";

package/dist/components/navigation/Tabs/TabButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemActionProvider } from "../../actions/ItemActionContext.js";

package/dist/components/navigation/Tabs/TabDropIndicator.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { DropIndicatorElement } from "./styled.js";
 import { useEffect, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/navigation/Tabs/TabPanel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { TabPanelElement } from "./styled.js";
 import { useEffect, useMemo, useRef } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";

package/dist/components/navigation/Tabs/TabPicker.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { MoreIcon } from "../../../icons/MoreIcon.js";

package/dist/components/navigation/Tabs/Tabs.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../../tasty/utils/styles.js";
 import { mergeStyles } from "../../../tasty/utils/merge-styles.js";
 import { OUTER_STYLES } from "../../../tasty/styles/list.js";

package/dist/components/navigation/Tabs/TabsAction.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { _ItemButton } from "../../actions/ItemButton/ItemButton.js";
 import { useOptionalTabsContext } from "./TabsContext.js";
@@ -6,14 +6,13 @@ import { forwardRef, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/components/navigation/Tabs/TabsAction.tsx
-const TabsActionElement = tasty(_ItemButton, {
-	shape: "sharp",
-	type: "neutral",
-	styles: { border: {
-		"": 0,
-		"tabs-type-file & !:first-child": "left"
-	} }
-});
+const TabsActionElement = tasty(_ItemButton, { styles: {
+	border: {
+		"type=neutral": 0,
+		"type=neutral & tabs-type-file & !:first-child": "left"
+	},
+	radius: { "type=neutral": 0 }
+} });
 /**
 * Action button designed for the Tabs prefix/suffix slots.
 *
@@ -47,13 +46,15 @@ const TabsAction = forwardRef(function TabsAction(props, ref) {
 	const tabsContext = useOptionalTabsContext();
 	const effectiveSize = size ?? tabsContext?.size ?? "medium";
 	const tabsType = tabsContext?.type ?? "default";
+	const combinedMods = useMemo(() => ({
+		"tabs-type-file": tabsType === "file",
+		...mods
+	}), [tabsType, mods]);
 	return /* @__PURE__ */ jsx(TabsActionElement, {
 		ref,
+		type: tabsType === "default" ? "outline" : "neutral",
 		size: effectiveSize,
-		mods: useMemo(() => ({
-			"tabs-type-file": tabsType === "file",
-			...mods
-		}), [tabsType, mods]),
+		mods: combinedMods,
 		...rest
 	});
 });

package/dist/components/navigation/Tabs/TabsAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabsAction.js","names":["ItemButton"],"sources":["../../../../src/components/navigation/Tabs/TabsAction.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { forwardRef, useMemo } from 'react';\n\nimport { tasty } from '../../../tasty';\nimport {\n  CubeItemButtonProps,\n  ItemButton,\n} from '../../actions/ItemButton/ItemButton';\n\nimport { useOptionalTabsContext } from './TabsContext';\n\nimport type { TabSize } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface CubeTabsActionProps\n  extends Omit<CubeItemButtonProps, 'size' | 'shape'> {\n  /**\n   * Size of the action button.\n   * When used inside Tabs prefix/suffix, inherits from Tabs size by default.\n   */\n  size?: TabSize;\n}\n\n// =============================================================================\n// Styled Component\n// =============================================================================\n\nconst TabsActionElement = tasty(ItemButton, {\n  shape: 'sharp',\n  type: 'neutral',\n  styles: {\n    border: {\n      '': 0,\n      'tabs-type-file & !:first-child': 'left',\n    },\n  },\n});\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Action button designed for the Tabs prefix/suffix slots.\n *\n * Styled with sharp edges and no border to match the TabPicker trigger.\n * When multiple TabsAction components are placed together, they automatically\n * display dividers between them using CSS :not(:first-child) border styling\n * (only for file tab type).\n *\n * Inherits size from the parent Tabs component when used inside prefix/suffix slots.\n *\n * @example\n * <Tabs suffix={<Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />}>\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n *\n * @example\n * // Multiple actions with automatic dividers\n * <Tabs\n *   suffix={\n *     <>\n *       <Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />\n *       <Tabs.Action icon={<SettingsIcon />} onPress={handleSettings} />\n *     </>\n *   }\n * >\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n */\nexport const TabsAction = forwardRef(function TabsAction(\n  props: CubeTabsActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { size, mods, ...rest } = props;\n\n  // Get size and type from context if available (when used inside Tabs)\n  const tabsContext = useOptionalTabsContext();\n  const effectiveSize = size ?? tabsContext?.size ?? 'medium';\n  const tabsType = tabsContext?.type ?? 'default';\n\n  const combinedMods = useMemo(\n    () => ({\n      'tabs-type-file': tabsType === 'file',\n      ...mods,\n    }),\n    [tabsType, mods],\n  );\n\n  return (\n    <TabsActionElement\n      ref={ref}\n      size={effectiveSize}\n      mods={combinedMods}\n      {...rest}\n    />\n  );\n});\n"],"mappings":";;;;;;;;AA8BA,MAAM,oBAAoB,MAAMA,aAAY;CAC1C,OAAO;CACP,MAAM;CACN,QAAQ,EACN,QAAQ;EACN,IAAI;EACJ,kCAAkC;EACnC,EACF;CACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCF,MAAa,aAAa,WAAW,SAAS,WAC5C,OACA,KACA;CACA,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS;CAGhC,MAAM,cAAc,wBAAwB;CAC5C,MAAM,gBAAgB,QAAQ,aAAa,QAAQ;CACnD,MAAM,WAAW,aAAa,QAAQ;AAUtC,QACE,oBAAC;EACM;EACL,MAAM;EACN,MAZiB,eACZ;GACL,kBAAkB,aAAa;GAC/B,GAAG;GACJ,GACD,CAAC,UAAU,KAAK,CACjB;EAOG,GAAI;GACJ;EAEJ"}
+{"version":3,"file":"TabsAction.js","names":["ItemButton"],"sources":["../../../../src/components/navigation/Tabs/TabsAction.tsx"],"sourcesContent":["import { FocusableRef } from '@react-types/shared';\nimport { forwardRef, useMemo } from 'react';\n\nimport { tasty } from '../../../tasty';\nimport {\n  CubeItemButtonProps,\n  ItemButton,\n} from '../../actions/ItemButton/ItemButton';\n\nimport { useOptionalTabsContext } from './TabsContext';\n\nimport type { TabSize } from './types';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface CubeTabsActionProps\n  extends Omit<CubeItemButtonProps, 'size' | 'shape'> {\n  /**\n   * Size of the action button.\n   * When used inside Tabs prefix/suffix, inherits from Tabs size by default.\n   */\n  size?: TabSize;\n}\n\n// =============================================================================\n// Styled Component\n// =============================================================================\n\nconst TabsActionElement = tasty(ItemButton, {\n  styles: {\n    border: {\n      'type=neutral': 0,\n      'type=neutral & tabs-type-file & !:first-child': 'left',\n    },\n    radius: {\n      'type=neutral': 0,\n    },\n  },\n});\n\n// =============================================================================\n// Component\n// =============================================================================\n\n/**\n * Action button designed for the Tabs prefix/suffix slots.\n *\n * Styled with sharp edges and no border to match the TabPicker trigger.\n * When multiple TabsAction components are placed together, they automatically\n * display dividers between them using CSS :not(:first-child) border styling\n * (only for file tab type).\n *\n * Inherits size from the parent Tabs component when used inside prefix/suffix slots.\n *\n * @example\n * <Tabs suffix={<Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />}>\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n *\n * @example\n * // Multiple actions with automatic dividers\n * <Tabs\n *   suffix={\n *     <>\n *       <Tabs.Action icon={<PlusIcon />} onPress={handleAdd} />\n *       <Tabs.Action icon={<SettingsIcon />} onPress={handleSettings} />\n *     </>\n *   }\n * >\n *   <Tab key=\"tab1\" title=\"Tab 1\">Content</Tab>\n * </Tabs>\n */\nexport const TabsAction = forwardRef(function TabsAction(\n  props: CubeTabsActionProps,\n  ref: FocusableRef<HTMLElement>,\n) {\n  const { size, mods, ...rest } = props;\n\n  // Get size and type from context if available (when used inside Tabs)\n  const tabsContext = useOptionalTabsContext();\n  const effectiveSize = size ?? tabsContext?.size ?? 'medium';\n  const tabsType = tabsContext?.type ?? 'default';\n\n  const combinedMods = useMemo(\n    () => ({\n      'tabs-type-file': tabsType === 'file',\n      ...mods,\n    }),\n    [tabsType, mods],\n  );\n\n  return (\n    <TabsActionElement\n      ref={ref}\n      type={tabsType === 'default' ? 'outline' : 'neutral'}\n      size={effectiveSize}\n      mods={combinedMods}\n      {...rest}\n    />\n  );\n});\n"],"mappings":";;;;;;;;AA8BA,MAAM,oBAAoB,MAAMA,aAAY,EAC1C,QAAQ;CACN,QAAQ;EACN,gBAAgB;EAChB,iDAAiD;EAClD;CACD,QAAQ,EACN,gBAAgB,GACjB;CACF,EACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkCF,MAAa,aAAa,WAAW,SAAS,WAC5C,OACA,KACA;CACA,MAAM,EAAE,MAAM,MAAM,GAAG,SAAS;CAGhC,MAAM,cAAc,wBAAwB;CAC5C,MAAM,gBAAgB,QAAQ,aAAa,QAAQ;CACnD,MAAM,WAAW,aAAa,QAAQ;CAEtC,MAAM,eAAe,eACZ;EACL,kBAAkB,aAAa;EAC/B,GAAG;EACJ,GACD,CAAC,UAAU,KAAK,CACjB;AAED,QACE,oBAAC;EACM;EACL,MAAM,aAAa,YAAY,YAAY;EAC3C,MAAM;EACN,MAAM;EACN,GAAI;GACJ;EAEJ"}

package/dist/components/navigation/Tabs/TabsContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/navigation/Tabs/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { _Item } from "../../content/Item/Item.js";
 
@@ -45,6 +45,14 @@ const TabsElement = tasty({ styles: {
 		placeContent: "center",
 		flexShrink: 0,
 		placeSelf: "stretch",
+		padding: {
+			"": 0,
+			"type=default": ".5x"
+		},
+		gap: {
+			"": 0,
+			"type=default": ".5x"
+		},
 		border: {
 			"": 0,
 			"type=file": "right"
@@ -57,6 +65,14 @@ const TabsElement = tasty({ styles: {
 		placeContent: "center",
 		flexShrink: 0,
 		placeSelf: "stretch",
+		padding: {
+			"": 0,
+			"type=default": ".5x"
+		},
+		gap: {
+			"": 0,
+			"type=default": ".5x"
+		},
 		border: {
 			"": 0,
 			"type=file": "left"
@@ -155,17 +171,18 @@ const TabElement = tasty(_Item, {
 	styles: {
 		radius: {
 			"": false,
-			"type=radio": true,
-			"type=default | type=narrow": "top"
+			"type=radio | type=default": true,
+			"type=narrow": "top"
 		},
 		color: {
 			"": "#dark-02",
-			"(type=default | type=narrow) & (hovered & !selected)": "#primary-text",
+			"type=narrow & (hovered & !selected)": "#primary-text",
 			"(type=default | type=narrow) & selected": "#primary-text",
 			disabled: "#dark-04"
 		},
 		fill: {
 			"": "#clear",
+			"hovered & !type=narrow": "#dark.03",
 			"type=file": "#light",
 			"type=file & hovered": "#light.5",
 			"type=radio & hovered": "#white.5",
@@ -212,6 +229,10 @@ const TabElement = tasty(_Item, {
 const TabContainer = tasty({ styles: {
 	position: "relative",
 	display: "grid",
+	margin: {
+		"": 0,
+		"type=default": ".5x 0"
+	},
 	border: {
 		"": 0,
 		"type=file": "right"

package/dist/components/navigation/Tabs/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["Item"],"sources":["../../../../src/components/navigation/Tabs/styled.ts"],"sourcesContent":["import { tasty } from '../../../tasty';\nimport { Item } from '../../content/Item';\n\n// =============================================================================\n// Main Tabs Container\n// =============================================================================\n\nexport const TabsElement = tasty({\n  styles: {\n    display: 'flex',\n    flow: 'row',\n    placeItems: {\n      '': 'end stretch',\n      'type=radio | type=file': 'stretch',\n    },\n    overflow: 'visible',\n    border: {\n      '': 0,\n      '(type=default | type=file | type=narrow) & has-panels': 'bottom',\n    },\n    width: {\n      '': '100%',\n      'type=radio': 'max-content',\n    },\n    padding: {\n      '': 0,\n      'type=radio': '.5x',\n    },\n    radius: {\n      '': 0,\n      'type=radio': '1cr',\n    },\n    fill: {\n      '': '#clear',\n      'type=radio': '#dark.06',\n    },\n    flexShrink: 0,\n    flexGrow: 0,\n\n    $transition: '$tab-transition',\n    '$tab-indicator-size': {\n      '': '2bw',\n      'size=large': '1ow',\n    },\n\n    Prefix: {\n      $: '>',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      border: {\n        '': 0,\n        'type=file': 'right',\n      },\n    },\n\n    Suffix: {\n      $: '>',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      border: {\n        '': 0,\n        'type=file': 'left',\n      },\n    },\n\n    // Wrapper for scroll area and scrollbar (scrollbar is positioned relative to this)\n    ScrollWrapper: {\n      $: '>',\n      position: 'relative',\n      display: 'flex',\n      flexGrow: 1,\n      flexShrink: 1,\n      width: 'min 0',\n      overflow: {\n        '': 'hidden',\n        'type=radio': 'visible',\n      },\n    },\n\n    Scroll: {\n      $: '> ScrollWrapper >',\n      position: 'relative',\n      display: 'block',\n      overflow: {\n        '': 'auto hidden',\n        'type=radio': 'visible',\n      },\n      scrollbar: 'none',\n      flexGrow: 1,\n      width: '100%',\n      // Add padding/margin for radio type to allow shadow to render outside\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      margin: {\n        '': 0,\n        'type=radio': '-.5x',\n      },\n      // Use multi-group fade with color tokens for smooth transitions\n      fade: '2x left #tabs-fade-left #black, 2x right #tabs-fade-right #black',\n      // ##name outputs --name-color (literal CSS property name)\n      transition:\n        '##tabs-fade-left $tab-transition ease-in, ##tabs-fade-right $tab-transition ease-in',\n\n      // Transition transparent color: opaque (no fade) -> transparent (fade visible)\n      '#tabs-fade-left': {\n        '': 'rgb(0 0 0 / 1)',\n        'fade-left': 'rgb(0 0 0 / 0)',\n      },\n      '#tabs-fade-right': {\n        '': 'rgb(0 0 0 / 1)',\n        'fade-right': 'rgb(0 0 0 / 0)',\n      },\n    },\n\n    TabList: {\n      $: '> ScrollWrapper > Scroll >',\n      position: 'relative',\n      display: 'grid',\n      gridAutoFlow: 'column',\n      gridAutoColumns: {\n        '': 'auto',\n        'type=radio': '1fr',\n      },\n      gap: {\n        '': 0,\n        'type=narrow': '2x',\n        'type=radio': '.5x',\n      },\n      placeContent: 'start',\n      overflow: 'visible',\n      width: {\n        '': 'max-content',\n        'type=radio': '100%',\n      },\n    },\n\n    // Size variable for actions (if ItemAction is used instead of TabsAction)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Custom horizontal scrollbar (tiny) - positioned relative to ScrollWrapper\n    ScrollbarH: {\n      $: '> ScrollWrapper >',\n      position: 'absolute',\n      bottom: '1px',\n      left: '$scrollbar-h-left',\n      height: '1ow',\n      width: '$scrollbar-h-width',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        'focused | scrolling': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Button (extends Item)\n// =============================================================================\n\nexport const TabElement = tasty(Item, {\n  as: 'button',\n  styles: {\n    radius: {\n      '': false,\n      'type=radio': true,\n      'type=default | type=narrow': 'top',\n    },\n    color: {\n      '': '#dark-02',\n      '(type=default | type=narrow) & (hovered & !selected)': '#primary-text',\n      '(type=default | type=narrow) & selected': '#primary-text',\n      disabled: '#dark-04',\n    },\n    fill: {\n      '': '#clear',\n      'type=file': '#light',\n      'type=file & hovered': '#light.5',\n      'type=radio & hovered': '#white.5',\n      '(type=file | type=radio) & selected': '#white',\n    },\n    border: {\n      '': '#clear',\n      'type=file': '0 #clear',\n    },\n    preset: {\n      '': 't3m',\n      'size=xsmall': 't4',\n    },\n    shadow: {\n      '': '$selection-shadow',\n      'focused & focus-visible':\n        'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      editing: 'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      'type=radio & selected': '$item-shadow',\n      'type=radio & selected & focused & focus-visible':\n        '$item-shadow, inset 0 0 0 1bw #primary-text',\n    },\n    '$selection-shadow': {\n      '': 'inset 0 0 0 0 #primary',\n      'type=file & selected': 'inset 0 (-1 * $tab-indicator-size) 0 0 #primary',\n      '!type=file': 'inset 0 0 0 0 #primary.0',\n    },\n    // Collapse horizontal padding for narrow type\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'type=narrow': 0,\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'type=narrow': 0,\n    },\n    Label: {\n      placeSelf: {\n        '': 'center start',\n        'type=radio': 'center start',\n        'type=radio & !has-prefix & !has-suffix & !has-icon & !has-right-icon':\n          'center',\n      },\n    },\n    Actions: {\n      transition: false,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Container (wrapper for tab + actions)\n// =============================================================================\n\nexport const TabContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'grid',\n    border: {\n      '': 0,\n      'type=file': 'right',\n    },\n    cursor: {\n      '': 'default',\n      draggable: 'grab',\n      dragging: 'grabbing',\n    },\n\n    // Size variable for actions (same as ItemButton's ActionsWrapper)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Actions rendered outside the button for accessibility\n    Actions: {\n      $: '>',\n      position: 'absolute',\n      inset: '1bw 1bw auto auto',\n      display: 'flex',\n      gap: '1bw',\n      placeItems: 'center',\n      placeContent: 'center end',\n      pointerEvents: 'auto',\n      height: 'min ($size - 2bw)',\n      padding: '0 $side-padding',\n      // Simple CSS opacity for show-on-hover\n      opacity: {\n        '': 1,\n        'auto-hide-actions': 0,\n        'auto-hide-actions & (active | :hover | :focus-within | :has([data-pressed]))': 1,\n      },\n      transition: 'opacity $transition',\n      // Size variables (same as Item)\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n  },\n});\n\n// =============================================================================\n// Drop Indicator for Drag-and-Drop\n// =============================================================================\n\nexport const DropIndicatorElement = tasty({\n  styles: {\n    zIndex: 10,\n    position: 'absolute',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      'drop-target': 1,\n    },\n    fill: '#primary',\n    width: '.5x',\n    top: 0,\n    bottom: 0,\n    left: {\n      '': 'auto',\n      before: '-2px',\n    },\n    right: {\n      '': 'auto',\n      after: '-2px',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Selection Indicator (for default type)\n// =============================================================================\n\nexport const TabIndicatorElement = tasty({\n  styles: {\n    position: 'absolute',\n    bottom: '0',\n    left: 0,\n    height: '$tab-indicator-size',\n    fill: '#primary',\n    transition:\n      'left $tab-transition ease-in-out, width $tab-transition ease-in-out',\n    pointerEvents: 'none',\n  },\n});\n\n// =============================================================================\n// Tab Panel\n// =============================================================================\n\nexport const TabPanelElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'contents',\n    hide: {\n      '': true,\n      active: false,\n    },\n  },\n});\n\n// =============================================================================\n// Editable Title Input\n// =============================================================================\n\nexport const EditableTitleInputElement = tasty({\n  as: 'input',\n  styles: {\n    border: 0,\n    padding: 0,\n    margin: 0,\n    fill: 'transparent',\n    outline: 0,\n    preset: 'inherit',\n    color: 'inherit',\n    width: 'initial $input-width 100%',\n  },\n});\n\nexport const HiddenMeasure = tasty({\n  styles: {\n    position: 'absolute',\n    visibility: 'hidden',\n    whiteSpace: 'pre',\n    font: 'inherit',\n    pointerEvents: 'none',\n    height: 0,\n    overflow: 'hidden',\n  },\n});\n"],"mappings":"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"}
+{"version":3,"file":"styled.js","names":["Item"],"sources":["../../../../src/components/navigation/Tabs/styled.ts"],"sourcesContent":["import { tasty } from '../../../tasty';\nimport { Item } from '../../content/Item';\n\n// =============================================================================\n// Main Tabs Container\n// =============================================================================\n\nexport const TabsElement = tasty({\n  styles: {\n    display: 'flex',\n    flow: 'row',\n    placeItems: {\n      '': 'end stretch',\n      'type=radio | type=file': 'stretch',\n    },\n    overflow: 'visible',\n    border: {\n      '': 0,\n      '(type=default | type=file | type=narrow) & has-panels': 'bottom',\n    },\n    width: {\n      '': '100%',\n      'type=radio': 'max-content',\n    },\n    padding: {\n      '': 0,\n      'type=radio': '.5x',\n    },\n    radius: {\n      '': 0,\n      'type=radio': '1cr',\n    },\n    fill: {\n      '': '#clear',\n      'type=radio': '#dark.06',\n    },\n    flexShrink: 0,\n    flexGrow: 0,\n\n    $transition: '$tab-transition',\n    '$tab-indicator-size': {\n      '': '2bw',\n      'size=large': '1ow',\n    },\n\n    Prefix: {\n      $: '>',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'right',\n      },\n    },\n\n    Suffix: {\n      $: '>',\n      display: 'flex',\n      placeItems: 'center',\n      placeContent: 'center',\n      flexShrink: 0,\n      placeSelf: 'stretch',\n      padding: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      gap: {\n        '': 0,\n        'type=default': '.5x',\n      },\n      border: {\n        '': 0,\n        'type=file': 'left',\n      },\n    },\n\n    // Wrapper for scroll area and scrollbar (scrollbar is positioned relative to this)\n    ScrollWrapper: {\n      $: '>',\n      position: 'relative',\n      display: 'flex',\n      flexGrow: 1,\n      flexShrink: 1,\n      width: 'min 0',\n      overflow: {\n        '': 'hidden',\n        'type=radio': 'visible',\n      },\n    },\n\n    Scroll: {\n      $: '> ScrollWrapper >',\n      position: 'relative',\n      display: 'block',\n      overflow: {\n        '': 'auto hidden',\n        'type=radio': 'visible',\n      },\n      scrollbar: 'none',\n      flexGrow: 1,\n      width: '100%',\n      // Add padding/margin for radio type to allow shadow to render outside\n      padding: {\n        '': 0,\n        'type=radio': '.5x',\n      },\n      margin: {\n        '': 0,\n        'type=radio': '-.5x',\n      },\n      // Use multi-group fade with color tokens for smooth transitions\n      fade: '2x left #tabs-fade-left #black, 2x right #tabs-fade-right #black',\n      // ##name outputs --name-color (literal CSS property name)\n      transition:\n        '##tabs-fade-left $tab-transition ease-in, ##tabs-fade-right $tab-transition ease-in',\n\n      // Transition transparent color: opaque (no fade) -> transparent (fade visible)\n      '#tabs-fade-left': {\n        '': 'rgb(0 0 0 / 1)',\n        'fade-left': 'rgb(0 0 0 / 0)',\n      },\n      '#tabs-fade-right': {\n        '': 'rgb(0 0 0 / 1)',\n        'fade-right': 'rgb(0 0 0 / 0)',\n      },\n    },\n\n    TabList: {\n      $: '> ScrollWrapper > Scroll >',\n      position: 'relative',\n      display: 'grid',\n      gridAutoFlow: 'column',\n      gridAutoColumns: {\n        '': 'auto',\n        'type=radio': '1fr',\n      },\n      gap: {\n        '': 0,\n        'type=narrow': '2x',\n        'type=radio': '.5x',\n      },\n      placeContent: 'start',\n      overflow: 'visible',\n      width: {\n        '': 'max-content',\n        'type=radio': '100%',\n      },\n    },\n\n    // Size variable for actions (if ItemAction is used instead of TabsAction)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Custom horizontal scrollbar (tiny) - positioned relative to ScrollWrapper\n    ScrollbarH: {\n      $: '> ScrollWrapper >',\n      position: 'absolute',\n      bottom: '1px',\n      left: '$scrollbar-h-left',\n      height: '1ow',\n      width: '$scrollbar-h-width',\n      radius: 'round',\n      fill: '#dark.35',\n      opacity: {\n        '': 0,\n        'focused | scrolling': 1,\n      },\n      transition: 'opacity 0.15s',\n      pointerEvents: 'none',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Button (extends Item)\n// =============================================================================\n\nexport const TabElement = tasty(Item, {\n  as: 'button',\n  styles: {\n    radius: {\n      '': false,\n      'type=radio | type=default': true,\n      'type=narrow': 'top',\n    },\n    color: {\n      '': '#dark-02',\n      'type=narrow & (hovered & !selected)': '#primary-text',\n      '(type=default | type=narrow) & selected': '#primary-text',\n      disabled: '#dark-04',\n    },\n    fill: {\n      '': '#clear',\n      'hovered & !type=narrow': '#dark.03',\n      'type=file': '#light',\n      'type=file & hovered': '#light.5',\n      'type=radio & hovered': '#white.5',\n      '(type=file | type=radio) & selected': '#white',\n    },\n    border: {\n      '': '#clear',\n      'type=file': '0 #clear',\n    },\n    preset: {\n      '': 't3m',\n      'size=xsmall': 't4',\n    },\n    shadow: {\n      '': '$selection-shadow',\n      'focused & focus-visible':\n        'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      editing: 'inset 0 0 0 1bw #primary-text, $selection-shadow',\n      'type=radio & selected': '$item-shadow',\n      'type=radio & selected & focused & focus-visible':\n        '$item-shadow, inset 0 0 0 1bw #primary-text',\n    },\n    '$selection-shadow': {\n      '': 'inset 0 0 0 0 #primary',\n      'type=file & selected': 'inset 0 (-1 * $tab-indicator-size) 0 0 #primary',\n      '!type=file': 'inset 0 0 0 0 #primary.0',\n    },\n    // Collapse horizontal padding for narrow type\n    '$label-padding-left': {\n      '': '$inline-padding',\n      'has-start-content': 0,\n      'type=narrow': 0,\n    },\n    '$label-padding-right': {\n      '': '$inline-padding',\n      'has-end-content': 0,\n      'type=narrow': 0,\n    },\n    Label: {\n      placeSelf: {\n        '': 'center start',\n        'type=radio': 'center start',\n        'type=radio & !has-prefix & !has-suffix & !has-icon & !has-right-icon':\n          'center',\n      },\n    },\n    Actions: {\n      transition: false,\n    },\n  },\n});\n\n// =============================================================================\n// Tab Container (wrapper for tab + actions)\n// =============================================================================\n\nexport const TabContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'grid',\n    margin: {\n      '': 0,\n      'type=default': '.5x 0',\n    },\n    border: {\n      '': 0,\n      'type=file': 'right',\n    },\n    cursor: {\n      '': 'default',\n      draggable: 'grab',\n      dragging: 'grabbing',\n    },\n\n    // Size variable for actions (same as ItemButton's ActionsWrapper)\n    $size: {\n      '': '$size-md',\n      'size=xsmall': '$size-xs',\n      'size=small': '$size-sm',\n      'size=medium': '$size-md',\n      'size=large': '$size-lg',\n      'size=xlarge': '$size-xl',\n    },\n\n    // Actions rendered outside the button for accessibility\n    Actions: {\n      $: '>',\n      position: 'absolute',\n      inset: '1bw 1bw auto auto',\n      display: 'flex',\n      gap: '1bw',\n      placeItems: 'center',\n      placeContent: 'center end',\n      pointerEvents: 'auto',\n      height: 'min ($size - 2bw)',\n      padding: '0 $side-padding',\n      // Simple CSS opacity for show-on-hover\n      opacity: {\n        '': 1,\n        'auto-hide-actions': 0,\n        'auto-hide-actions & (active | :hover | :focus-within | :has([data-pressed]))': 1,\n      },\n      transition: 'opacity $transition',\n      // Size variables (same as Item)\n      '$action-size': 'min(max((2x + 2bw), ($size - 1x - 2bw)), (3x - 2bw))',\n      '$side-padding': '(($size - $action-size - 2bw) / 2)',\n    },\n  },\n});\n\n// =============================================================================\n// Drop Indicator for Drag-and-Drop\n// =============================================================================\n\nexport const DropIndicatorElement = tasty({\n  styles: {\n    zIndex: 10,\n    position: 'absolute',\n    pointerEvents: 'none',\n    opacity: {\n      '': 0,\n      'drop-target': 1,\n    },\n    fill: '#primary',\n    width: '.5x',\n    top: 0,\n    bottom: 0,\n    left: {\n      '': 'auto',\n      before: '-2px',\n    },\n    right: {\n      '': 'auto',\n      after: '-2px',\n    },\n  },\n});\n\n// =============================================================================\n// Tab Selection Indicator (for default type)\n// =============================================================================\n\nexport const TabIndicatorElement = tasty({\n  styles: {\n    position: 'absolute',\n    bottom: '0',\n    left: 0,\n    height: '$tab-indicator-size',\n    fill: '#primary',\n    transition:\n      'left $tab-transition ease-in-out, width $tab-transition ease-in-out',\n    pointerEvents: 'none',\n  },\n});\n\n// =============================================================================\n// Tab Panel\n// =============================================================================\n\nexport const TabPanelElement = tasty({\n  as: 'section',\n  styles: {\n    display: 'contents',\n    hide: {\n      '': true,\n      active: false,\n    },\n  },\n});\n\n// =============================================================================\n// Editable Title Input\n// =============================================================================\n\nexport const EditableTitleInputElement = tasty({\n  as: 'input',\n  styles: {\n    border: 0,\n    padding: 0,\n    margin: 0,\n    fill: 'transparent',\n    outline: 0,\n    preset: 'inherit',\n    color: 'inherit',\n    width: 'initial $input-width 100%',\n  },\n});\n\nexport const HiddenMeasure = tasty({\n  styles: {\n    position: 'absolute',\n    visibility: 'hidden',\n    whiteSpace: 'pre',\n    font: 'inherit',\n    pointerEvents: 'none',\n    height: 0,\n    overflow: 'hidden',\n  },\n});\n"],"mappings":"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"}

package/dist/components/navigation/Tabs/types.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 //#region src/components/navigation/Tabs/types.ts
 /**
 * Size mapping for radio type tabs.

package/dist/components/navigation/Tabs/use-tab-editing.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { chainRaf } from "../../../utils/raf.js";
 import { useCallback, useState } from "react";
 

package/dist/components/navigation/Tabs/use-tab-indicator.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { chainRaf } from "../../../utils/raf.js";
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
 

package/dist/components/organisms/FileTabs/FileTabs.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { Block } from "../../Block.js";

package/dist/components/organisms/StatsCard/StatsCard.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { _Text } from "../../content/Text.js";
 import { _Title } from "../../content/Title.js";
 import { Card } from "../../content/Card/Card.js";

package/dist/components/other/Calendar/Calendar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { _Title } from "../../content/Title.js";
 import { useProviderProps } from "../../../provider.js";

package/dist/components/other/Calendar/CalendarCell.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { useRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/other/Calendar/CalendarGrid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { CalendarCell } from "./CalendarCell.js";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/other/Calendar/RangeCalendar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { _Title } from "../../content/Title.js";
 import { useProviderProps } from "../../../provider.js";

package/dist/components/other/CloudLogo/CloudLogo.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { Button } from "../../actions/index.js";
 import { forwardRef } from "react";

package/dist/components/overlays/AlertDialog/AlertDialog.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { Paragraph } from "../../content/Paragraph.js";
 import { _Title } from "../../content/Title.js";

package/dist/components/overlays/AlertDialog/AlertDialogApiProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { AlertDialogZone } from "./AlertDialogZone.js";
 import { createContext, useContext, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/overlays/AlertDialog/AlertDialogZone.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { Portal } from "../../portal/Portal.js";
 import { DialogContainer } from "../Dialog/DialogContainer.js";
 import { _AlertDialog } from "./AlertDialog.js";

package/dist/components/overlays/Dialog/Dialog.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { extractStyles } from "../../../tasty/utils/styles.js";
 import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, FLOW_STYLES } from "../../../tasty/styles/list.js";
 import { tasty } from "../../../tasty/tasty.js";

package/dist/components/overlays/Dialog/DialogContainer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { _Modal } from "../Modal/Modal.js";
 import { DialogContext } from "./context.js";
 import { Children, isValidElement, useRef } from "react";

package/dist/components/overlays/Dialog/DialogForm.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { _Title } from "../../content/Title.js";
 import { ButtonGroup } from "../../actions/ButtonGroup/ButtonGroup.js";
 import { Button } from "../../actions/index.js";

package/dist/components/overlays/Dialog/DialogTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { _Modal } from "../Modal/Modal.js";
 import { _Tray } from "../Modal/Tray.js";

package/dist/components/overlays/Dialog/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import invariant from "tiny-invariant";
 

package/dist/components/overlays/Dialog/use-dialog-container.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { DialogContainer } from "./DialogContainer.js";

package/dist/components/overlays/Modal/Modal.d.ts

@@ -1,3 +1,4 @@
 
 import "../../../tasty/index.js";
-import "./types.js";
+import "./types.js";
+import "react";

package/dist/components/overlays/Modal/Modal.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { tasty } from "../../../tasty/tasty.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _Overlay } from "./Overlay.js";

package/dist/components/overlays/Modal/OpenTransition.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { Children, cloneElement, createContext, useContext, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { Transition } from "react-transition-group";

package/dist/components/overlays/Modal/Overlay.d.ts

@@ -1,3 +1,4 @@
 
 import "./types.js";
+import "react";
 import { OverlayProps } from "react-aria";

package/dist/components/overlays/Modal/Overlay.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-0d83be6 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-17c0e92 | Cube Dev Team */
 import { Provider, useProviderProps } from "../../../provider.js";
 import { OpenTransition } from "./OpenTransition.js";
 import { forwardRef, useCallback, useState } from "react";