npm - @cube-dev/ui-kit - Versions diffs - 0.0.0-canary-b3860b1 → 0.0.0-canary-5752be7 - Mend

@cube-dev/ui-kit 0.0.0-canary-b3860b1 → 0.0.0-canary-5752be7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (509) hide show

package/dist/components/fields/FilterPicker/FilterPicker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/Input/Input.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { _FileInput } from "../FileInput/FileInput.js";
 import { TextInput } from "../TextInput/TextInput.js";
 import { _NumberInput } from "../NumberInput/NumberInput.js";

package/dist/components/fields/ListBox/DraggableListBox.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { DraggableCollection } from "../../shared/DraggableCollection.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/ListBox/ListBox.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/ListBoxPopover/ListBoxPopover.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";
 import { Portal } from "../../portal/Portal.js";

package/dist/components/fields/ListBoxPopover/index.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
 import "./ListBoxPopover.js";
-import "./useCompositeFocus.js";
 import { ListStateLike, TextFilterFn } from "./listNavigation.js";

package/dist/components/fields/ListBoxPopover/listNavigation.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 //#region src/components/fields/ListBoxPopover/listNavigation.ts
 /**
 * Walks a collection (possibly nested under sections) and collects the keys of

package/dist/components/fields/ListBoxPopover/useCompositeFocus.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useCallback, useEffect, useRef } from "react";
 //#region src/components/fields/ListBoxPopover/useCompositeFocus.ts

package/dist/components/fields/NumberInput/NumberInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { castNullableNumberValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/NumberInput/StepButton.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useI18n } from "../../../i18n/useI18n.js";
 import { DirectionIcon } from "../../../icons/DirectionIcon.js";
 import { Button } from "../../actions/index.js";

package/dist/components/fields/PasswordInput/PasswordInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/fields/Picker/Picker.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/fields/RadioGroup/Radio.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/fields/RadioGroup/RadioGroup.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { FormContext } from "../../form/Form/Form.js";

package/dist/components/fields/RadioGroup/context.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/fields/RadioGroup/context.ts

package/dist/components/fields/SearchComboBox/SearchComboBox.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";

package/dist/components/fields/SearchInput/SearchInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useProviderProps } from "../../../provider.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";

package/dist/components/fields/Select/Select.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/Gradation.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { SliderGradationElement, SliderGradeElement } from "./elements.js";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/Slider/HueSlider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { __Slider } from "./Slider.js";
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/fields/Slider/RangeSlider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { Gradation } from "./Gradation.js";
 import { _SliderBase } from "./SliderBase.js";
 import { SliderThumb } from "./SliderThumb.js";

package/dist/components/fields/Slider/Slider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { Gradation } from "./Gradation.js";

package/dist/components/fields/Slider/SliderBase.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { forwardRefWithGenerics } from "../../../utils/react/forwardRefWithGenerics.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/Slider/SliderThumb.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderThumbElement } from "./elements.js";

package/dist/components/fields/Slider/SliderTrack.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { getValidationMods } from "../../form/validation/resolve-validation-props.js";
 import { SliderTrackContainerElement } from "./elements.js";
 import { useMemo } from "react";

package/dist/components/fields/Slider/elements.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 //#region src/components/fields/Slider/elements.ts

package/dist/components/fields/Slider/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { __RangeSlider } from "./RangeSlider.js";
 import { __Slider } from "./Slider.js";
 import { __HueSlider } from "./HueSlider.js";

package/dist/components/fields/Switch/Switch.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useId as useId$2 } from "../../../utils/react/useId.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/fields/TextArea/TextArea.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { chain } from "../../../utils/react/chain.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/fields/TextInput/TextInput.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFieldProps } from "../../form/Form/use-field/use-field-props.js";
 import { castNullableStringValue } from "../../../utils/react/nullableValue.js";

package/dist/components/fields/TextInput/TextInputBase.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/fields/TextInputMapper/TextInputMapper.js CHANGED Viewed

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

package/dist/components/fields/color/ColorPanel.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { formatColor, getContrastingColor, toHex } from "./color.js";
 import { CHANNELS, COLOR_SPACES, COLOR_SPACE_HINTS, COLOR_SPACE_LABELS } from "./channels.js";

package/dist/components/fields/color/ColorSwatch.d.ts ADDED Viewed

@@ -0,0 +1,22 @@
+import { ColorValue } from "./color.js";
+import { BaseProps, BaseStyleProps, BlockStyleProps, DimensionStyleProps, OuterStyleProps, Styles } from "@tenphi/tasty";
+import * as react from "react";
+//#region src/components/fields/color/ColorSwatch.d.ts
+interface CubeColorSwatchProps extends BaseProps, BaseStyleProps, OuterStyleProps, BlockStyleProps, DimensionStyleProps {
+  /** The color to show. Anything the color inputs accept; `null` shows the empty state. */
+  color?: string | ColorValue | null;
+  styles?: Styles;
+}
+/**
+ * A square of color. Decorative on its own — pair it with the value as text, or
+ * with a control that names it.
+ *
+ * The color travels as an inline custom property rather than through `styles`,
+ * so the swatch keeps a single cached style rule however often it changes.
+ */
+declare const ColorSwatch: react.ForwardRefExoticComponent<CubeColorSwatchProps & react.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { ColorSwatch, CubeColorSwatchProps };
+//# sourceMappingURL=ColorSwatch.d.ts.map

package/dist/components/fields/color/ColorSwatch.js CHANGED Viewed

@@ -1,9 +1,17 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
-import { toHex } from "./color.js";
-import { tasty } from "@tenphi/tasty";
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
+import { extractStyles } from "../../../utils/styles.js";
+import { parseColor, toHex } from "./color.js";
+import { BASE_STYLES, BLOCK_STYLES, DIMENSION_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";
+import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/fields/color/ColorSwatch.tsx
+const STYLE_PROPS = [
+	...BASE_STYLES,
+	...OUTER_STYLES,
+	...BLOCK_STYLES,
+	...DIMENSION_STYLES
+];
 const SwatchElement = tasty({
 	qa: "ColorSwatch",
 	styles: {
@@ -23,19 +31,27 @@ const SwatchElement = tasty({
 	}
 });
 /**
-* The square of color both controls put in front of their value. Decorative:
-* the color is always available as text next to it.
+* A square of color. Decorative on its own — pair it with the value as text, or
+* with a control that names it.
 *
-* The color travels as an inline custom property so the swatch keeps a single
-* cached style rule however often it changes.
+* The color travels as an inline custom property rather than through `styles`,
+* so the swatch keeps a single cached style rule however often it changes.
 */
-function ColorSwatch({ color, styles }) {
+const ColorSwatch = forwardRef(function ColorSwatch(props, ref) {
+	const { color, mods, qa } = props;
+	const styles = extractStyles(props, STYLE_PROPS);
+	const resolved = typeof color === "string" ? parseColor(color) : color ?? null;
 	return /* @__PURE__ */ jsx(SwatchElement, {
-		mods: { empty: !color },
+		ref,
+		qa,
+		mods: {
+			empty: !resolved,
+			...mods
+		},
 		styles,
-		style: color ? { "--color-picker-color": toHex(color) } : void 0
+		style: resolved ? { "--color-picker-color": toHex(resolved) } : void 0
 	});
-}
+});
 //#endregion
 export { ColorSwatch };

package/dist/components/fields/color/ColorSwatch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ColorSwatch.js","names":[],"sources":["../../../../src/components/fields/color/ColorSwatch.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\n\nimport { ColorValue, toHex } from './color';\n\nconst SwatchElement = tasty({\n qa: 'ColorSwatch',\n styles: {\n display: 'block',\n width: '2.5x',\n height: '2.5x',\n radius: '1r',\n fill: {\n '': '(#color-picker, #clear)',\n empty: '#clear',\n },\n shadow: 'inset 0 0 0 1bw #dark.15',\n // A single diagonal stroke is the conventional \"no color\" swatch.\n image: {\n '': false,\n empty:\n 'linear-gradient(to bottom right, #clear 46%, #danger 46%, #danger 54%, #clear 54%)',\n },\n },\n});\n\nexport interface ~~ColorSwatchProps~~ {\n /** The color to show, or `null` ~~for~~ the empty state. /\n color: ColorValue \| null;\n styles?: Styles;\n}\n\n/\n ~~The~~ square of color ~~both~~ ~~controls~~ ~~put~~ in ~~front~~ of ~~their~~ ~~value.~~ ~~Decorative:\n~~ * ~~the~~ ~~color~~ is ~~always~~ ~~available~~ as ~~text~~ ~~next~~ to it.\n \n The color travels as an inline custom property so the swatch keeps a single\n * cached style rule however often it changes.\n */\nexport function ColorSwatch({ color, ~~styles~~ }: ~~ColorSwatchProps~~) {\n return (\n <SwatchElement\n mods={{ empty: !~~color~~ }}\n styles={styles}\n style={~~color~~ ? { '--color-picker-color': toHex(~~color~~) } : undefined}\n />\n );\n}\n"],"mappings":"~~;;;;;;AAIA~~,MAAM,gBAAgB,MAAM;CAC1B,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACD,QAAQ;EAER,OAAO;GACL,IAAI;GACJ,OACE;GACH;EACF;CACF,CAAC;;;;;;;;~~AAeF~~,~~SAAgB~~,~~YAAY~~,EAAE,OAAO,~~UAA4B~~;~~AAC/D~~,QACE,oBAAC;~~EACC~~,MAAM,~~EAAE,~~OAAO,CAAC,~~OAAO~~;~~EACf~~;EACR,OAAO,~~QAAQ~~,EAAE,wBAAwB,MAAM,~~MAAM~~,EAAE,GAAG;~~GAC1D~~"}
1	+ {"version":3,"file":"ColorSwatch.js","names":[],"sources":["../../../../src/components/fields/color/ColorSwatch.tsx"],"sourcesContent":["import {\n BASE_STYLES,\n BaseProps,\n BaseStyleProps,\n BLOCK_STYLES,\n BlockStyleProps,\n DIMENSION_STYLES,\n DimensionStyleProps,\n OUTER_STYLES,\n OuterStyleProps,\n Styles,\n tasty,\n} from '@tenphi/tasty';\nimport { ForwardedRef, forwardRef } from 'react';\n\nimport { extractStyles } from '../../../utils/styles';\n\nimport { ColorValue, parseColor, toHex } from './color';\n\nconst STYLE_PROPS = [\n ...BASE_STYLES,\n ...OUTER_STYLES,\n ...BLOCK_STYLES,\n ...DIMENSION_STYLES,\n];\n\nconst SwatchElement = tasty({\n qa: 'ColorSwatch',\n styles: {\n display: 'block',\n width: '2.5x',\n height: '2.5x',\n radius: '1r',\n fill: {\n '': '(#color-picker, #clear)',\n empty: '#clear',\n },\n shadow: 'inset 0 0 0 1bw #dark.15',\n // A single diagonal stroke is the conventional \"no color\" swatch.\n image: {\n '': false,\n empty:\n 'linear-gradient(to bottom right, #clear 46%, #danger 46%, #danger 54%, #clear 54%)',\n },\n },\n});\n\nexport interface CubeColorSwatchProps\n extends BaseProps,\n BaseStyleProps,\n OuterStyleProps,\n BlockStyleProps,\n DimensionStyleProps {\n /** The color to show. Anything the color inputs accept; `null` shows the empty state. /\n color?: string \| ColorValue \| null;\n styles?: Styles;\n}\n\n/\n A square of color. Decorative on its own — pair it with the value as text, or\n * with a control that names it.\n \n The color travels as an inline custom property rather than through `styles`,\n * so the swatch keeps a single cached style rule however often it changes.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(\n props: CubeColorSwatchProps,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const { color, mods, qa } = props;\n const styles = extractStyles(props, STYLE_PROPS);\n\n const resolved =\n typeof color === 'string' ? parseColor(color) : color ?? null;\n\n return (\n <SwatchElement\n ref={ref}\n qa={qa}\n mods={{ empty: !resolved, ...mods }}\n styles={styles}\n style={resolved ? { '--color-picker-color': toHex(resolved) } : undefined}\n />\n );\n});\n"],"mappings":";;;;;;;;AAmBA,MAAM,cAAc;CAClB,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACJ;AAED,MAAM,gBAAgB,MAAM;CAC1B,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,MAAM;GACJ,IAAI;GACJ,OAAO;GACR;EACD,QAAQ;EAER,OAAO;GACL,IAAI;GACJ,OACE;GACH;EACF;CACF,CAAC;;;;;;;;AAoBF,MAAa,cAAc,WAAW,SAAS,YAC7C,OACA,KACA;CACA,MAAM,EAAE,OAAO,MAAM,OAAO;CAC5B,MAAM,SAAS,cAAc,OAAO,YAAY;CAEhD,MAAM,WACJ,OAAO,UAAU,WAAW,WAAW,MAAM,GAAG,SAAS;AAE3D,QACE,oBAAC;EACM;EACD;EACJ,MAAM;GAAE,OAAO,CAAC;GAAU,GAAG;GAAM;EAC3B;EACR,OAAO,WAAW,EAAE,wBAAwB,MAAM,SAAS,EAAE,GAAG;GAChE;EAEJ"}

package/dist/components/fields/color/channels.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { fromOkhst, fromOklch, fromRgb, isAchromatic, maxChroma, normalizeHue, toHex, toOkhst, toOklch, toRgb } from "./color.js";
 //#region src/components/fields/color/channels.ts

package/dist/components/fields/color/color.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import "@tenphi/glaze";
+import { OkhslColor } from "@tenphi/glaze";
 //#region src/components/fields/color/color.d.ts
 /**
@@ -10,6 +10,12 @@ import "@tenphi/glaze";
  */
 declare const COLOR_FORMATS: readonly ["hex", "rgb", "hsl", "okhsl", "okhst", "oklch"];
 type ColorFormat = (typeof COLOR_FORMATS)[number];
+/**
+ * OKHSL is the canonical space of the picker: it is Glaze's authoring space,
+ * every channel is bounded, and — unlike OKLCh — every value inside those
+ * bounds is inside the sRGB gamut, so no state can be unrepresentable.
+ */
+type ColorValue = OkhslColor;
 //#endregion
-export { COLOR_FORMATS, ColorFormat };
+export { COLOR_FORMATS, ColorFormat, ColorValue };
 //# sourceMappingURL=color.d.ts.map

package/dist/components/fields/color/color.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { contrastRatioFromLuminance, formatHsl, formatOkhsl, formatOkhst, formatOklch, formatRgb, hslToSrgb, okhslToLinearSrgb, okhslToOkhst, okhslToOklch, okhslToSrgb, okhstToOkhsl, oklabToOkhsl, parseHexAlpha, relativeLuminanceFromLinearRgb, srgbToHex, srgbToOkhsl } from "@tenphi/glaze";
 //#region src/components/fields/color/color.ts

package/dist/components/fields/color/context.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/fields/color/context.ts

package/dist/components/fields/color/index.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
 import { COLOR_FORMATS, ColorFormat } from "./color.js";
+import { ColorSwatch, CubeColorSwatchProps } from "./ColorSwatch.js";
 import { COLOR_SPACES, ColorSpace } from "./channels.js";

package/dist/components/fields/index.d.ts CHANGED Viewed

@@ -19,6 +19,7 @@ import { CubeCheckboxGroupProps, _CheckboxGroup } from "./Checkbox/CheckboxGroup
 import { AriaCheckboxProps, CubeCheckboxProps, __Checkbox, useCheckbox } from "./Checkbox/Checkbox.js";
 import "./Checkbox/index.js";
 import { COLOR_FORMATS, ColorFormat } from "./color/color.js";
+import { ColorSwatch, CubeColorSwatchProps } from "./color/ColorSwatch.js";
 import { COLOR_SPACES, ColorSpace } from "./color/channels.js";
 import "./color/index.js";
 import { ColorInput, ColorInputFormatMode, CubeColorInputProps } from "./ColorInput/ColorInput.js";

package/dist/components/form/FieldWrapper/FieldWrapper.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { wrapNodeIfPlain } from "../../../utils/react/wrapNodeIfPlain.js";
 import { _Text } from "../../content/Text.js";

package/dist/components/form/Form/Field.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { warn } from "../../../utils/warnings.js";
 import { useValidationProps } from "../validation/use-validation-props.js";

package/dist/components/form/Form/Form.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { Provider, useProviderProps } from "../../../provider.js";

package/dist/components/form/Form/ResetButton/ResetButton.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps } from "../../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useProviderProps } from "../../../../provider.js";

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

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

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useI18n } from "../../../i18n/useI18n.js";
 import { FormContext } from "./Form.js";
 import { Alert } from "../../content/Alert/Alert.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | 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 CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | 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 CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useIsFirstRender } from "../../../../_internal/hooks/use-is-first-render.js";
 import { resolveValidationProps } from "../../validation/resolve-validation-props.js";

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

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

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

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

package/dist/components/form/Label.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useProviderProps } from "../../provider.js";
 import { useI18n } from "../../i18n/useI18n.js";

package/dist/components/form/validation/ValidationIndicator.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { LoadingIcon } from "../../../icons/LoadingIcon.js";
 import { hasValidationState } from "./resolve-validation-props.js";
 import { InvalidIcon } from "../../shared/InvalidIcon.js";

package/dist/components/form/validation/resolve-validation-props.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 //#region src/components/form/validation/resolve-validation-props.ts
 /**
 * Normalizes the validation props of a field into a pair of booleans.

package/dist/components/form/validation/use-validation-props.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useWarn } from "../../../_internal/hooks/use-warn.js";
 import { resolveValidationProps } from "./resolve-validation-props.js";

package/dist/components/form/wrapper.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | 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 CHANGED Viewed

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

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

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

package/dist/components/layout/Board/Board.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";

package/dist/components/layout/Board/BoardProvider.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { BoardDragActiveContext, BoardRegistryContext } from "./board-context.js";
 import { useBoardRegistry } from "./use-board-registry.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/layout/Board/BoardResponsive.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { useCombinedRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { getCompactor } from "./grid-core/compactors.js";

package/dist/components/layout/Board/Widget.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { useBoardRegistry } from "./board-context.js";

package/dist/components/layout/Board/WidgetHost.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/layout/Board/board-context.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/layout/Board/board-context.tsx

package/dist/components/layout/Board/board-store.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 //#region src/components/layout/Board/board-store.ts
 /**
 * A tiny external store mapping widget id -> registration.

package/dist/components/layout/Board/grid-core/calculate.js CHANGED Viewed

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-b3860b1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.0.0-canary-5752be7 | Cube Dev Team */
 //#region src/components/layout/Board/grid-core/calculate.ts
 /** Calculate the width of a single grid column in pixels. */
 function calcGridColWidth(positionParams) {