@cube-dev/ui-kit 0.201.0 → 0.202.0

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | 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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useProviderProps } from "../../../../provider.js";
 import { Button } from "../../../actions/Button/Button.js";
 import { isModernFormController } from "../backend.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useI18n } from "../../../i18n/useI18n.js";
 import { ModernControllerContext } from "./modern/context.js";
 import { FormContext } from "./Form.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 //#region src/components/form/Form/backend.ts
 /**
 * Nominal branding for the two Form backends (modernization plan §5.1).

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useFormControllerContext } from "./modern/context.js";
 import { useForm } from "./use-form.js";
 import { Form as _Form, FormContext, FormScopeMask, useFormProps } from "./Form.js";

package/dist/components/form/Form/modern/actions.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useProviderProps } from "../../../../provider.js";
 import { Button } from "../../../actions/Button/Button.js";

package/dist/components/form/Form/modern/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 //#region src/components/form/Form/modern/context.ts
 const ModernControllerContext = createContext(null);

package/dist/components/form/Form/modern/controller.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { FORM_BACKEND, isModernFormController } from "../backend.js";
 import { createFormField } from "./field.js";
 import { createFormStore } from "./store.js";

package/dist/components/form/Form/modern/field-binding.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { getFieldKey, hasPath, normalizePath, readPath } from "./values.js";
 import { getControllerInternals } from "./controller.js";
 //#region src/components/form/Form/modern/field-binding.ts

package/dist/components/form/Form/modern/field.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { normalizePath } from "./values.js";
 //#region src/components/form/Form/modern/field.ts
 function createFormField(form, path, options = {}) {

package/dist/components/form/Form/modern/react.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../../utils/react/useLayoutEffect.js";
 import { ModernControllerContext } from "./context.js";
 import { getFieldKey, normalizePath, readPath } from "./values.js";

package/dist/components/form/Form/modern/store.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { FORM_BACKEND } from "../backend.js";
 import { createValueSnapshotter, defineValue, formValueEqual, freezeContainer, getFieldKey, hasPath, isPlainObject, normalizePath, pathValueChanged, readPath, readonlySet, sameMembers, writePath } from "./values.js";
 import { rulesSignature, runRules } from "./validation.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { applyRule } from "../validation.js";
 //#region src/components/form/Form/modern/validation.ts
 /** Compare constraints and function source; captures still need deps/rulesKey. */

package/dist/components/form/Form/modern/values.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 //#region src/components/form/Form/modern/values.ts
 const ownedContainers = /* @__PURE__ */ new WeakSet();
 function freezeContainer(value) {

package/dist/components/form/Form/reset-unbound-controls.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 //#region src/components/form/Form/reset-unbound-controls.ts
 /**
 * Both form roots cancel a native reset, because the browser would put a bound

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../../utils/react/useLayoutEffect.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { isModernFormController } from "../backend.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | 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.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../../utils/react/useLayoutEffect.js";
 import { useEvent } from "../../../../_internal/hooks/use-event.js";
 import { useIsFirstRender } from "../../../../_internal/hooks/use-is-first-render.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { FORM_BACKEND, isModernFormController, modernBackendUnavailableError } from "./backend.js";
 import { applyRules } from "./validation.js";
 import { dotizeConvert } from "../../../utils/dotize.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { validate } from "email-validator";
 import validUrl from "valid-url";
 //#region src/components/form/Form/validation.ts

package/dist/components/form/Label.js

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

package/dist/components/form/field-chrome.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { warn } from "../../utils/warnings.js";
 //#region src/components/form/field-chrome.ts
 /** Empty slot values suppress content; numeric zero is still text. */

package/dist/components/form/field-chrome.js.map

@@ -1 +1 @@
-{"version":3,"file":"field-chrome.js","names":["warn","ReactNode","hasFieldContent","content","FIELD_CHROME_PROPS","const","asksForFieldChrome","props","some","key","withFieldChrome","P","isBare","hasWarnedAboutForceField","warnAboutForceField","forceField"],"sources":["../../../src/components/form/field-chrome.ts"],"sourcesContent":["import { warn } from '../../utils/warnings';\n\nimport type { ReactNode } from 'react';\n\n/** Empty slot values suppress content; numeric zero is still text. */\nexport function hasFieldContent(content: ReactNode) {\n  return content != null && typeof content !== 'boolean' && content !== '';\n}\n\n/**\n * The caller's props that give a field without a `label` something to show\n * under its control or something for the wrapper to do: texts for its slots,\n * styles for the wrapper, or hiding it.\n */\nconst FIELD_CHROME_PROPS = [\n  'description',\n  'errorMessage',\n  'message',\n  'fieldStyles',\n  'fieldProps',\n  'isHidden',\n] as const;\n\n/**\n * Whether the caller of a field without a `label` passes one of\n * `FIELD_CHROME_PROPS`, so the field still needs its chrome. A form binding\n * needs it too; `useFieldProps` adds that. An explicit `isBare` overrides both\n * in `rendersFieldChrome`.\n *\n * It does not depend on what the field shows at the moment. A prop counts\n * whatever it holds — `undefined`, `null` and `''` too — because a decision\n * taken from the text would move the control in and out of the wrapper as an\n * error comes and goes, and React would remount it and drop its focus\n * mid-keystroke.\n *\n * Read the caller's own props: a form binding adds message props of its own.\n */\nexport function asksForFieldChrome(props: object) {\n  return FIELD_CHROME_PROPS.some((key) => key in props);\n}\n\n/** Asks `wrapWithField` for the field chrome, unless the caller set `isBare`. */\nexport function withFieldChrome<P extends object>(props: P): P {\n  return { ...props, isBare: (props as { isBare?: boolean }).isBare ?? false };\n}\n\nlet hasWarnedAboutForceField = false;\n\n/** Warn once about the obsolete opt-in: `isBare={false}` replaces it. */\nexport function warnAboutForceField(props: { forceField?: boolean }) {\n  if (hasWarnedAboutForceField || props.forceField == null) return;\n\n  hasWarnedAboutForceField = true;\n\n  warn(\n    'A field received `forceField`, which is deprecated. Pass `isBare={false}` to render the field chrome even with nothing to show.',\n  );\n}\n"],"mappings":";;;;AAKA,SAAgBE,gBAAgBC,SAAoB;CAClD,OAAOA,WAAW,QAAQ,OAAOA,YAAY,aAAaA,YAAY;AACxE;;;;;;AAOA,MAAMC,qBAAqB;CACzB;CACA;CACA;CACA;CACA;CACA;AAAU;;;;;;;;;;;;;;;AAiBZ,SAAgBE,mBAAmBC,OAAe;CAChD,OAAOH,mBAAmBI,MAAMC,QAAQA,OAAOF,KAAK;AACtD;;AAGA,SAAgBG,gBAAkCH,OAAa;CAC7D,OAAO;EAAE,GAAGA;EAAOK,QAASL,MAA+BK,UAAU;CAAM;AAC7E;AAEA,IAAIC,2BAA2B;;AAG/B,SAAgBC,oBAAoBP,OAAiC;CACnE,IAAIM,4BAA4BN,MAAMQ,cAAc,MAAM;CAE1DF,2BAA2B;CAE3Bb,KACE,iIACF;AACF"}
+{"version":3,"file":"field-chrome.js","names":["warn","ReactNode","FieldBaseProps","hasFieldContent","content","RESERVED_FIELD_PROPS","const","SHARED_FIELD_PROPS","FIELD_CHROME_PROPS","asksForFieldChrome","props","some","key","withFieldChrome","P","isBare","hasWarnedAboutForceField","warnAboutForceField","forceField"],"sources":["../../../src/components/form/field-chrome.ts"],"sourcesContent":["import { warn } from '../../utils/warnings';\n\nimport type { ReactNode } from 'react';\nimport type { FieldBaseProps } from '../../shared/form';\n\n/** Empty slot values suppress content; numeric zero is still text. */\nexport function hasFieldContent(content: ReactNode) {\n  return content != null && typeof content !== 'boolean' && content !== '';\n}\n\n/**\n * The field chrome's own props. `wrapWithField` reads them off an input's\n * props by name, for the label, its badge and suffix, the texts and the\n * wrapper, so an input never takes one of these names for a prop of its own:\n * the chrome would render it too. The input's own version takes its part's\n * prefix (`triggerDescription`, `inputStyles`) or a name the chrome does not\n * own (`tooltip`, the control's tooltip).\n */\nexport const RESERVED_FIELD_PROPS = [\n  'label',\n  'labelPosition',\n  'labelStyles',\n  'labelProps',\n  'labelRef',\n  'labelSuffix',\n  'labelTooltip',\n  'extra',\n  'description',\n  'message',\n  'errorMessage',\n  'messageStyles',\n  'necessityIndicator',\n  'requiredMark',\n  'isOptional',\n  'isBare',\n  'forceField',\n  'isHidden',\n  'fieldProps',\n  'fieldStyles',\n] as const satisfies readonly (keyof FieldBaseProps)[];\n\n/**\n * The props both the chrome and its control read, by design: the control\n * behaves by them, the chrome shows them, and `id` ties the texts to the\n * control.\n */\nexport const SHARED_FIELD_PROPS = [\n  'id',\n  'isDisabled',\n  'isRequired',\n  'isInvalid',\n  'isValid',\n] as const satisfies readonly (keyof FieldBaseProps)[];\n\n/**\n * The caller's props that give a field without a `label` something to show\n * under its control or something for the wrapper to do: texts for its slots,\n * styles for the wrapper, or hiding it.\n */\nconst FIELD_CHROME_PROPS = [\n  'description',\n  'errorMessage',\n  'message',\n  'fieldStyles',\n  'fieldProps',\n  'isHidden',\n] as const;\n\n/**\n * Whether the caller of a field without a `label` passes one of\n * `FIELD_CHROME_PROPS`, so the field still needs its chrome. A form binding\n * needs it too; `useFieldProps` adds that. An explicit `isBare` overrides both\n * in `rendersFieldChrome`.\n *\n * It does not depend on what the field shows at the moment. A prop counts\n * whatever it holds — `undefined`, `null` and `''` too — because a decision\n * taken from the text would move the control in and out of the wrapper as an\n * error comes and goes, and React would remount it and drop its focus\n * mid-keystroke.\n *\n * Read the caller's own props: a form binding adds message props of its own.\n */\nexport function asksForFieldChrome(props: object) {\n  return FIELD_CHROME_PROPS.some((key) => key in props);\n}\n\n/** Asks `wrapWithField` for the field chrome, unless the caller set `isBare`. */\nexport function withFieldChrome<P extends object>(props: P): P {\n  return { ...props, isBare: (props as { isBare?: boolean }).isBare ?? false };\n}\n\nlet hasWarnedAboutForceField = false;\n\n/** Warn once about the obsolete opt-in: `isBare={false}` replaces it. */\nexport function warnAboutForceField(props: { forceField?: boolean }) {\n  if (hasWarnedAboutForceField || props.forceField == null) return;\n\n  hasWarnedAboutForceField = true;\n\n  warn(\n    'A field received `forceField`, which is deprecated. Pass `isBare={false}` to render the field chrome even with nothing to show.',\n  );\n}\n"],"mappings":";;;;AAMA,SAAgBG,gBAAgBC,SAAoB;CAClD,OAAOA,WAAW,QAAQ,OAAOA,YAAY,aAAaA,YAAY;AACxE;;;;;;AAmDA,MAAMI,qBAAqB;CACzB;CACA;CACA;CACA;CACA;CACA;AAAU;;;;;;;;;;;;;;;AAiBZ,SAAgBC,mBAAmBC,OAAe;CAChD,OAAOF,mBAAmBG,MAAMC,QAAQA,OAAOF,KAAK;AACtD;;AAGA,SAAgBG,gBAAkCH,OAAa;CAC7D,OAAO;EAAE,GAAGA;EAAOK,QAASL,MAA+BK,UAAU;CAAM;AAC7E;AAEA,IAAIC,2BAA2B;;AAG/B,SAAgBC,oBAAoBP,OAAiC;CACnE,IAAIM,4BAA4BN,MAAMQ,cAAc,MAAM;CAE1DF,2BAA2B;CAE3BhB,KACE,iIACF;AACF"}

package/dist/components/form/field-layout.d.ts

@@ -0,0 +1,10 @@
+
+import { DimensionStyleProps, PositionStyleProps, Styles } from "@tenphi/tasty";
+//#region src/components/form/field-layout.d.ts
+/**
+ * An input's style props. They place and size its outer element: the field
+ * wrapper when it renders, the input itself otherwise.
+ */
+export interface FieldLayoutStyleProps extends PositionStyleProps, DimensionStyleProps {}
+//#endregion
+//# sourceMappingURL=field-layout.d.ts.map

package/dist/components/form/field-layout.js

@@ -0,0 +1,96 @@
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+import { extractStyles, mergeStyleLayers } from "../../utils/styles.js";
+import { mergeProps } from "../../utils/react/mergeProps.js";
+import { rendersFieldChrome } from "./wrapper.js";
+import { DIMENSION_STYLES, POSITION_STYLES } from "@tenphi/tasty";
+//#region src/components/form/field-layout.ts
+/** The names of `FieldLayoutStyleProps`. */
+const FIELD_LAYOUT_STYLES = [...POSITION_STYLES, ...DIMENSION_STYLES];
+/**
+* Style props that size the wrapper across, so the input fills its width.
+* `inlineSize` counts as `width`, below.
+*/
+const FILL_WIDTH_STYLES = [
+	"width",
+	"flexBasis",
+	"flexGrow",
+	"flex"
+];
+/**
+* Style props that size the wrapper down, so the input fills its height.
+* `blockSize` counts as `height`, below.
+*/
+const FILL_HEIGHT_STYLES = ["height"];
+const FLEX_STYLES = [
+	"flexBasis",
+	"flexGrow",
+	"flex"
+];
+/** Values that leave an element at its natural size, `false` from a `cond && size` included. */
+const NOT_SIZING = /* @__PURE__ */ new Set([
+	false,
+	0,
+	"0",
+	"none",
+	"auto",
+	"initial"
+]);
+/** A value that sizes its element: set, and not a reset or a no-op. */
+function isSizing(value) {
+	return value != null && !NOT_SIZING.has(value);
+}
+/**
+* The wrapper's own `width` follows a logical size in the same CSS rule and
+* overrides it, so on the wrapper a logical size takes its physical name. A
+* physical one given as well, `null` included, wins.
+*/
+const PHYSICAL_SIZES = [["inlineSize", "width"], ["blockSize", "height"]];
+/**
+* Routes an input's style props to its outer element. Bare, they join the
+* input's `styles`. With the field chrome, they go to the wrapper over
+* `fieldStyles`, and a wrapper they size gets `fill-width` / `fill-height`,
+* under which `FieldWrapper` lets the input stretch as it would in a grid cell
+* of that size. `styles` always stays on the input.
+*/
+function splitFieldLayout(props, options = {}) {
+	const { hasChrome = rendersFieldChrome(props), fillHeightOnFlex = false, defaultStyles } = options;
+	const record = props;
+	if (!hasChrome) return {
+		styles: extractStyles(props, FIELD_LAYOUT_STYLES, defaultStyles),
+		field: {},
+		fillWidth: false,
+		fillHeight: false
+	};
+	const styles = mergeStyleLayers(defaultStyles, record.styles);
+	const layoutStyles = extractStyles(props, FIELD_LAYOUT_STYLES, void 0, void 0, ["styles"]);
+	if (!Object.keys(layoutStyles).length) return {
+		styles,
+		field: {},
+		fillWidth: false,
+		fillHeight: false
+	};
+	for (const [logical, physical] of PHYSICAL_SIZES) {
+		if (!(logical in layoutStyles)) continue;
+		if (layoutStyles[physical] === void 0) layoutStyles[physical] = layoutStyles[logical];
+		delete layoutStyles[logical];
+	}
+	const sizes = (names) => names.some((name) => isSizing(layoutStyles[name]));
+	const fillWidth = sizes(FILL_WIDTH_STYLES);
+	const fillHeight = sizes(FILL_HEIGHT_STYLES) || fillHeightOnFlex && sizes(FLEX_STYLES);
+	return {
+		styles,
+		field: {
+			fieldStyles: mergeStyleLayers(record.fieldStyles, layoutStyles),
+			fieldProps: fillWidth || fillHeight ? mergeProps(record.fieldProps, { mods: {
+				"fill-width": fillWidth,
+				"fill-height": fillHeight
+			} }) : record.fieldProps
+		},
+		fillWidth,
+		fillHeight
+	};
+}
+//#endregion
+export { FIELD_LAYOUT_STYLES, splitFieldLayout };
+
+//# sourceMappingURL=field-layout.js.map

package/dist/components/form/field-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-layout.js","names":["DIMENSION_STYLES","POSITION_STYLES","mergeProps","extractStyles","mergeStyleLayers","rendersFieldChrome","DimensionStyleProps","PositionStyleProps","Styles","Props","FieldLayoutStyleProps","FIELD_LAYOUT_STYLES","FILL_WIDTH_STYLES","FILL_HEIGHT_STYLES","FLEX_STYLES","NOT_SIZING","Set","isSizing","value","has","PHYSICAL_SIZES","const","FieldLayoutOptions","hasChrome","fillHeightOnFlex","defaultStyles","FieldLayout","styles","field","fieldStyles","fieldProps","fillWidth","fillHeight","splitFieldLayout","props","options","record","Record","layoutStyles","undefined","Object","keys","length","logical","physical","sizes","names","some","name","mods"],"sources":["../../../src/components/form/field-layout.ts"],"sourcesContent":["import { DIMENSION_STYLES, POSITION_STYLES } from '@tenphi/tasty';\n\nimport { mergeProps } from '../../utils/react/index';\nimport { extractStyles, mergeStyleLayers } from '../../utils/styles';\n\nimport { rendersFieldChrome } from './wrapper';\n\nimport type {\n  DimensionStyleProps,\n  PositionStyleProps,\n  Styles,\n} from '@tenphi/tasty';\nimport type { Props } from '../../props';\n\n/**\n * An input's style props. They place and size its outer element: the field\n * wrapper when it renders, the input itself otherwise.\n */\nexport interface FieldLayoutStyleProps\n  extends PositionStyleProps, DimensionStyleProps {}\n\n/** The names of `FieldLayoutStyleProps`. */\nexport const FIELD_LAYOUT_STYLES: readonly string[] = [\n  ...POSITION_STYLES,\n  ...DIMENSION_STYLES,\n];\n\n/**\n * Style props that size the wrapper across, so the input fills its width.\n * `inlineSize` counts as `width`, below.\n */\nconst FILL_WIDTH_STYLES = ['width', 'flexBasis', 'flexGrow', 'flex'];\n/**\n * Style props that size the wrapper down, so the input fills its height.\n * `blockSize` counts as `height`, below.\n */\nconst FILL_HEIGHT_STYLES = ['height'];\nconst FLEX_STYLES = ['flexBasis', 'flexGrow', 'flex'];\n\n/** Values that leave an element at its natural size, `false` from a `cond && size` included. */\nconst NOT_SIZING = new Set<unknown>([false, 0, '0', 'none', 'auto', 'initial']);\n\n/** A value that sizes its element: set, and not a reset or a no-op. */\nfunction isSizing(value: unknown) {\n  return value != null && !NOT_SIZING.has(value);\n}\n\n/**\n * The wrapper's own `width` follows a logical size in the same CSS rule and\n * overrides it, so on the wrapper a logical size takes its physical name. A\n * physical one given as well, `null` included, wins.\n */\nconst PHYSICAL_SIZES = [\n  ['inlineSize', 'width'],\n  ['blockSize', 'height'],\n] as const;\n\nexport interface FieldLayoutOptions {\n  /**\n   * Whether the input renders its field wrapper. Defaults to\n   * `rendersFieldChrome(props)`, so pass the props `wrapWithField` receives. A\n   * grouped option, which never wraps, passes `false`.\n   */\n  hasChrome?: boolean;\n  /**\n   * Whether flex props also fill the wrapper's height: set by the inputs whose\n   * bare form grows with its flex line (lists, text areas). A single-line input\n   * would only collect the spare height between itself and its message.\n   */\n  fillHeightOnFlex?: boolean;\n  /** The input's own default styles, under `styles`. */\n  defaultStyles?: Styles;\n}\n\nexport interface FieldLayout {\n  /** The input's styles: `styles`, plus the style props when it is bare. */\n  styles: Styles;\n  /**\n   * Spread into the props of `wrapWithField`: the wrapper's `fieldStyles`,\n   * with the style props over them, and its `fieldProps`, with the fill mods.\n   */\n  field: { fieldStyles?: Styles; fieldProps?: Props };\n  /** Whether the style props size the wrapper across: the input fills it. */\n  fillWidth: boolean;\n  /** Whether the style props size the wrapper down: the input fills it. */\n  fillHeight: boolean;\n}\n\n/**\n * Routes an input's style props to its outer element. Bare, they join the\n * input's `styles`. With the field chrome, they go to the wrapper over\n * `fieldStyles`, and a wrapper they size gets `fill-width` / `fill-height`,\n * under which `FieldWrapper` lets the input stretch as it would in a grid cell\n * of that size. `styles` always stays on the input.\n */\nexport function splitFieldLayout(\n  props: object,\n  options: FieldLayoutOptions = {},\n): FieldLayout {\n  const {\n    hasChrome = rendersFieldChrome(props),\n    fillHeightOnFlex = false,\n    defaultStyles,\n  } = options;\n  const record = props as Record<string, unknown> & {\n    styles?: Styles;\n    fieldStyles?: Styles;\n    fieldProps?: Props;\n  };\n\n  if (!hasChrome) {\n    return {\n      styles: extractStyles(props, FIELD_LAYOUT_STYLES, defaultStyles),\n      field: {},\n      fillWidth: false,\n      fillHeight: false,\n    };\n  }\n\n  const styles = mergeStyleLayers(defaultStyles, record.styles);\n  const layoutStyles = extractStyles(\n    props,\n    FIELD_LAYOUT_STYLES,\n    undefined,\n    undefined,\n    ['styles'],\n  );\n\n  if (!Object.keys(layoutStyles).length) {\n    return { styles, field: {}, fillWidth: false, fillHeight: false };\n  }\n\n  for (const [logical, physical] of PHYSICAL_SIZES) {\n    if (!(logical in layoutStyles)) continue;\n\n    if (layoutStyles[physical] === undefined) {\n      layoutStyles[physical] = layoutStyles[logical];\n    }\n\n    delete layoutStyles[logical];\n  }\n\n  const sizes = (names: string[]) =>\n    names.some((name) => isSizing(layoutStyles[name]));\n  const fillWidth = sizes(FILL_WIDTH_STYLES);\n  const fillHeight =\n    sizes(FILL_HEIGHT_STYLES) || (fillHeightOnFlex && sizes(FLEX_STYLES));\n\n  return {\n    styles,\n    field: {\n      fieldStyles: mergeStyleLayers(record.fieldStyles, layoutStyles),\n      fieldProps:\n        fillWidth || fillHeight\n          ? mergeProps(record.fieldProps, {\n              mods: { 'fill-width': fillWidth, 'fill-height': fillHeight },\n            })\n          : record.fieldProps,\n    },\n    fillWidth,\n    fillHeight,\n  };\n}\n"],"mappings":";;;;;;;AAsBA,MAAaW,sBAAyC,CACpD,GAAGV,iBACH,GAAGD,gBAAgB;;;;;AAOrB,MAAMY,oBAAoB;CAAC;CAAS;CAAa;CAAY;AAAM;;;;;AAKnE,MAAMC,qBAAqB,CAAC,QAAQ;AACpC,MAAMC,cAAc;CAAC;CAAa;CAAY;AAAM;;AAGpD,MAAMC,6BAAa,IAAIC,IAAa;CAAC;CAAO;CAAG;CAAK;CAAQ;CAAQ;AAAS,CAAC;;AAG9E,SAASC,SAASC,OAAgB;CAChC,OAAOA,SAAS,QAAQ,CAACH,WAAWI,IAAID,KAAK;AAC/C;;;;;;AAOA,MAAME,iBAAiB,CACrB,CAAC,cAAc,OAAO,GACtB,CAAC,aAAa,QAAQ,CAAC;;;;;;;;AAyCzB,SAAgBa,iBACdC,OACAC,UAA8B,CAAC,GAClB;CACb,MAAM,EACJZ,YAAYlB,mBAAmB6B,KAAK,GACpCV,mBAAmB,OACnBC,kBACEU;CACJ,MAAMC,SAASF;CAMf,IAAI,CAACX,WACH,OAAO;EACLI,QAAQxB,cAAc+B,OAAOvB,qBAAqBc,aAAa;EAC/DG,OAAO,CAAC;EACRG,WAAW;EACXC,YAAY;CACd;CAGF,MAAML,SAASvB,iBAAiBqB,eAAeW,OAAOT,MAAM;CAC5D,MAAMW,eAAenC,cACnB+B,OACAvB,qBACA4B,KAAAA,GACAA,KAAAA,GACA,CAAC,QAAQ,CACX;CAEA,IAAI,CAACC,OAAOC,KAAKH,YAAY,CAAC,CAACI,QAC7B,OAAO;EAAEf;EAAQC,OAAO,CAAC;EAAGG,WAAW;EAAOC,YAAY;CAAM;CAGlE,KAAK,MAAM,CAACW,SAASC,aAAaxB,gBAAgB;EAChD,IAAI,EAAEuB,WAAWL,eAAe;EAEhC,IAAIA,aAAaM,cAAcL,KAAAA,GAC7BD,aAAaM,YAAYN,aAAaK;EAGxC,OAAOL,aAAaK;CACtB;CAEA,MAAME,SAASC,UACbA,MAAMC,MAAMC,SAAS/B,SAASqB,aAAaU,KAAK,CAAC;CACnD,MAAMjB,YAAYc,MAAMjC,iBAAiB;CACzC,MAAMoB,aACJa,MAAMhC,kBAAkB,KAAMW,oBAAoBqB,MAAM/B,WAAW;CAErE,OAAO;EACLa;EACAC,OAAO;GACLC,aAAazB,iBAAiBgC,OAAOP,aAAaS,YAAY;GAC9DR,YACEC,aAAaC,aACT9B,WAAWkC,OAAON,YAAY,EAC5BmB,MAAM;IAAE,cAAclB;IAAW,eAAeC;GAAW,EAC7D,CAAC,IACDI,OAAON;EACf;EACAC;EACAC;CACF;AACF"}

package/dist/components/form/index.d.ts

@@ -6,6 +6,7 @@ import { ModernValidationContext } from "./Form/modern/validation.js";
 import { FormChange, ModernSubmitContext, SetValueOptions } from "./Form/modern/types.js";
 import { FormController, ModernFieldState, ModernFieldValidationResult, ModernFormState, ModernSubmitFailure, ModernSubmitResult, ModernValidationResult, ModernValidationRule, UseFormControllerOptions } from "./Form/modern/controller.js";
 import { FormField, FormFieldContext, FormFieldOptions } from "./Form/modern/field.js";
+import { FieldLayoutStyleProps } from "./field-layout.js";
 import { FieldTypes, Fields } from "./Form/types.js";
 import { CubeFormInstance, useForm } from "./Form/use-form.js";
 import { ModernFormProps } from "./Form/ModernFormRoot.js";
@@ -28,4 +29,4 @@ import { ResolvableValidationProps, ResolvedValidationProps, getValidationMods,
 import { useValidationProps } from "./validation/use-validation-props.js";
 import { ValidationIndicator, ValidationIndicatorProps, getValidationIcon, hasValidationIndicator } from "./validation/ValidationIndicator.js";
 import "./validation/index.js";
-export { type CubeFieldProps, CubeFieldWrapperProps, type CubeFormInstance, type CubeFormProps, CubeLabelProps, CubeNecessityIndicatorProps, CubeResetButtonProps, CubeSubmitButtonProps, CubeSubmitErrorProps, Field, FieldReturnValue, type FieldTypes, FieldWrapper, type Fields, Form, type FormChange, FormComponent, FormContext, type FormController, type FormField, type FormFieldContext, type FormFieldOptions, type FormPath, type FormReadValue, FormScopeMask, type FormSelectorOptions, type FormSubscribeProps, type FormValueAtPath, type FormValues, INLINE_LABEL_STYLES, LABEL_STYLES, _Label as Label, type ModernFieldState, type ModernFieldValidationResult, type ModernFormProps, type ModernFormState, type ModernSubmitContext, type ModernSubmitFailure, type ModernSubmitResult, type ModernValidationContext, type ModernValidationResult, type ModernValidationRule, NecessityIndicatorMark, _ResetButton as ResetButton, ResolvableValidationProps, ResolvedValidationProps, type SetValueOptions, _SubmitButton as SubmitButton, _SubmitError as SubmitError, UseFieldParams, UseFieldProps, UseFieldPropsParams, type UseFormControllerOptions, ValidationIndicator, ValidationIndicatorProps, getValidationIcon, getValidationMods, getValidationTheme, hasValidationIndicator, hasValidationState, rendersFieldChrome, resolveValidationProps, useField, useFieldProps, useForm, useFormProps, useValidationProps, wrapWithField };
+export { type CubeFieldProps, CubeFieldWrapperProps, type CubeFormInstance, type CubeFormProps, CubeLabelProps, CubeNecessityIndicatorProps, CubeResetButtonProps, CubeSubmitButtonProps, CubeSubmitErrorProps, Field, type FieldLayoutStyleProps, FieldReturnValue, type FieldTypes, FieldWrapper, type Fields, Form, type FormChange, FormComponent, FormContext, type FormController, type FormField, type FormFieldContext, type FormFieldOptions, type FormPath, type FormReadValue, FormScopeMask, type FormSelectorOptions, type FormSubscribeProps, type FormValueAtPath, type FormValues, INLINE_LABEL_STYLES, LABEL_STYLES, _Label as Label, type ModernFieldState, type ModernFieldValidationResult, type ModernFormProps, type ModernFormState, type ModernSubmitContext, type ModernSubmitFailure, type ModernSubmitResult, type ModernValidationContext, type ModernValidationResult, type ModernValidationRule, NecessityIndicatorMark, _ResetButton as ResetButton, ResolvableValidationProps, ResolvedValidationProps, type SetValueOptions, _SubmitButton as SubmitButton, _SubmitError as SubmitError, UseFieldParams, UseFieldProps, UseFieldPropsParams, type UseFormControllerOptions, ValidationIndicator, ValidationIndicatorProps, getValidationIcon, getValidationMods, getValidationTheme, hasValidationIndicator, hasValidationState, rendersFieldChrome, resolveValidationProps, useField, useFieldProps, useForm, useFormProps, useValidationProps, wrapWithField };

package/dist/components/form/legacy-tooltip.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { warn } from "../../utils/warnings.js";
 //#region src/components/form/legacy-tooltip.ts
 let hasWarnedAboutLegacyTooltip = false;
@@ -21,7 +21,20 @@ function warnAboutLegacyTooltip(props) {
 	hasWarnedAboutLegacyTooltip = true;
 	warn("A field received `tooltip`, which no longer renders the info badge next to its label. Pass the badge content as `labelTooltip` instead.");
 }
+/**
+* The trigger's tooltip on `Picker`, `FilterPicker` and `ColorPicker` was
+* `triggerTooltip`. It is `tooltip` now, as on `Select`, `Button` and `Item`,
+* since a field's own props never take the field chrome's names and `tooltip`
+* is not one of them. The pickers render `tooltip ?? triggerTooltip` and pass
+* this to `useWarn` while the old name is used.
+*
+* A migration aid; remove with `triggerTooltip`.
+*/
+const TRIGGER_TOOLTIP_WARNING = {
+	key: "picker-trigger-tooltip",
+	args: ["A picker received `triggerTooltip`, which is deprecated. Pass the trigger tooltip as `tooltip` instead."]
+};
 //#endregion
-export { warnAboutLegacyTooltip };
+export { TRIGGER_TOOLTIP_WARNING, warnAboutLegacyTooltip };
 
 //# sourceMappingURL=legacy-tooltip.js.map

package/dist/components/form/legacy-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"legacy-tooltip.js","names":["warn","hasWarnedAboutLegacyTooltip","warnAboutLegacyTooltip","props","tooltip"],"sources":["../../../src/components/form/legacy-tooltip.ts"],"sourcesContent":["import { warn } from '../../utils/warnings';\n\nlet hasWarnedAboutLegacyTooltip = false;\n\n/**\n * `tooltip` used to be the field-level prop for the label's info badge. It is\n * `labelTooltip` now, and TypeScript flags every old call site — but not a JS\n * caller, an `as any`, or an untyped spread. Those would lose the badge\n * without a word, so say it once.\n *\n * Called by `wrapWithField` once it knows a label renders (without one the old\n * prop did nothing either), and by the legacy `Field` and `FieldWrapper`,\n * which a caller can reach without going through `wrapWithField`.\n *\n * A migration aid; remove once consumers are off `tooltip`.\n */\nexport function warnAboutLegacyTooltip(props: object) {\n  if (hasWarnedAboutLegacyTooltip) return;\n\n  const { tooltip } = props as { tooltip?: unknown };\n\n  if (tooltip == null || tooltip === false) return;\n\n  hasWarnedAboutLegacyTooltip = true;\n\n  warn(\n    'A field received `tooltip`, which no longer renders the info badge next to its label. Pass the badge content as `labelTooltip` instead.',\n  );\n}\n"],"mappings":";;;AAEA,IAAIC,8BAA8B;;;;;;;;;;;;;AAclC,SAAgBC,uBAAuBC,OAAe;CACpD,IAAIF,6BAA6B;CAEjC,MAAM,EAAEG,YAAYD;CAEpB,IAAIC,WAAW,QAAQA,YAAY,OAAO;CAE1CH,8BAA8B;CAE9BD,KACE,yIACF;AACF"}
+{"version":3,"file":"legacy-tooltip.js","names":["warn","WarnParameters","hasWarnedAboutLegacyTooltip","warnAboutLegacyTooltip","props","tooltip","TRIGGER_TOOLTIP_WARNING","key","args"],"sources":["../../../src/components/form/legacy-tooltip.ts"],"sourcesContent":["import { warn } from '../../utils/warnings';\n\nimport type { WarnParameters } from '../../_internal/hooks/use-warn';\n\nlet hasWarnedAboutLegacyTooltip = false;\n\n/**\n * `tooltip` used to be the field-level prop for the label's info badge. It is\n * `labelTooltip` now, and TypeScript flags every old call site — but not a JS\n * caller, an `as any`, or an untyped spread. Those would lose the badge\n * without a word, so say it once.\n *\n * Called by `wrapWithField` once it knows a label renders (without one the old\n * prop did nothing either), and by the legacy `Field` and `FieldWrapper`,\n * which a caller can reach without going through `wrapWithField`.\n *\n * A migration aid; remove once consumers are off `tooltip`.\n */\nexport function warnAboutLegacyTooltip(props: object) {\n  if (hasWarnedAboutLegacyTooltip) return;\n\n  const { tooltip } = props as { tooltip?: unknown };\n\n  if (tooltip == null || tooltip === false) return;\n\n  hasWarnedAboutLegacyTooltip = true;\n\n  warn(\n    'A field received `tooltip`, which no longer renders the info badge next to its label. Pass the badge content as `labelTooltip` instead.',\n  );\n}\n\n/**\n * The trigger's tooltip on `Picker`, `FilterPicker` and `ColorPicker` was\n * `triggerTooltip`. It is `tooltip` now, as on `Select`, `Button` and `Item`,\n * since a field's own props never take the field chrome's names and `tooltip`\n * is not one of them. The pickers render `tooltip ?? triggerTooltip` and pass\n * this to `useWarn` while the old name is used.\n *\n * A migration aid; remove with `triggerTooltip`.\n */\nexport const TRIGGER_TOOLTIP_WARNING = {\n  key: 'picker-trigger-tooltip',\n  args: [\n    'A picker received `triggerTooltip`, which is deprecated. Pass the trigger tooltip as `tooltip` instead.',\n  ],\n} satisfies WarnParameters;\n"],"mappings":";;;AAIA,IAAIE,8BAA8B;;;;;;;;;;;;;AAclC,SAAgBC,uBAAuBC,OAAe;CACpD,IAAIF,6BAA6B;CAEjC,MAAM,EAAEG,YAAYD;CAEpB,IAAIC,WAAW,QAAQA,YAAY,OAAO;CAE1CH,8BAA8B;CAE9BF,KACE,yIACF;AACF;;;;;;;;;;AAWA,MAAaM,0BAA0B;CACrCC,KAAK;CACLC,MAAM,CACJ,yGAAyG;AAE7G"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | 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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | 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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useWarn } from "../../../_internal/hooks/use-warn.js";
 import { resolveValidationProps } from "./resolve-validation-props.js";
 import { c } from "react/compiler-runtime";

package/dist/components/form/wrapper.js

@@ -1,4 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
+import { mergeStyleLayers } from "../../utils/styles.js";
 import { mergeProps } from "../../utils/react/mergeProps.js";
 import { hasFieldContent, warnAboutForceField } from "./field-chrome.js";
 import { warnAboutLegacyTooltip } from "./legacy-tooltip.js";
@@ -24,7 +25,10 @@ function wrapWithField(component, ...args) {
 	let { label, extra, labelPosition = "top", labelStyles, isRequired, isOptional, isDisabled, necessityIndicator, message, messageStyles, description, errorMessage, isInvalid, isValid, labelProps, labelRef, fieldProps, fieldStyles, requiredMark = true, labelTooltip, isHidden, labelSuffix } = props;
 	warnAboutForceField(props);
 	warnAboutLegacyTooltip(props);
-	const mergedFieldProps = fieldStyles ? mergeProps(fieldProps, { styles: fieldStyles }) : fieldProps;
+	const mergedFieldProps = fieldStyles ? {
+		...fieldProps,
+		styles: mergeStyleLayers(fieldProps?.styles, fieldStyles)
+	} : fieldProps;
 	const mergedLabelProps = labelStyles ? mergeProps(labelProps, { styles: labelStyles }) : labelProps;
 	const { id: _id, ...fieldPropsWithoutId } = mergedFieldProps || {};
 	return /* @__PURE__ */ jsx(FieldWrapper, {

package/dist/components/form/wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"wrapper.js","names":["DOMRef","FocusableRef","BaseProps","ReactElement","RefObject","FieldBaseProps","FormBaseProps","mergeProps","hasFieldContent","warnAboutForceField","FieldWrapper","warnAboutLegacyTooltip","WrapWithFieldProps","Omit","rendersFieldChrome","props","isBare","label","forceField","LegacyFieldRef","HTMLElement","wrapWithField","component","T","ref","args","length","extra","labelPosition","labelStyles","isRequired","isOptional","isDisabled","necessityIndicator","message","messageStyles","description","errorMessage","isInvalid","isValid","labelProps","labelRef","fieldProps","fieldStyles","requiredMark","labelTooltip","isHidden","labelSuffix","mergedFieldProps","styles","mergedLabelProps","id","_id","fieldPropsWithoutId","Component","controlId"],"sources":["../../../src/components/form/wrapper.tsx"],"sourcesContent":["import { DOMRef, FocusableRef } from '@react-types/shared';\nimport { BaseProps } from '@tenphi/tasty';\nimport { ReactElement, RefObject } from 'react';\n\nimport { FieldBaseProps, FormBaseProps } from '../../shared/index';\nimport { mergeProps } from '../../utils/react/index';\n\nimport { hasFieldContent, warnAboutForceField } from './field-chrome';\nimport { FieldWrapper } from './FieldWrapper/index';\nimport { warnAboutLegacyTooltip } from './legacy-tooltip';\n\n// The input is passed as `component`, never through props.children.\ninterface WrapWithFieldProps\n  extends FieldBaseProps, Omit<BaseProps, 'children'>, FormBaseProps {}\n\n/**\n * Whether `wrapWithField` renders the field chrome for these props. An\n * explicit `isBare` decides; `useFieldProps` sets `isBare={false}` on a bound\n * field, one passed a chrome prop, or one with a `validate` whose errors the\n * control shows (`withFieldChrome`).\n * Otherwise a non-empty `label` renders it, as does the deprecated\n * `forceField`.\n */\nexport function rendersFieldChrome(props: object) {\n  const { isBare, label, forceField } = props as WrapWithFieldProps;\n\n  if (isBare != null) return !isBare;\n\n  return hasFieldContent(label) || !!forceField;\n}\n\ntype LegacyFieldRef =\n  | RefObject<unknown>\n  | FocusableRef<HTMLElement>\n  | DOMRef<HTMLElement>\n  | null\n  | undefined;\n\n/**\n * Wraps a control in its field chrome when it has one, and forwards its chrome\n * props. The chrome takes no ref: the control attaches the field's `ref` to\n * its own root, so the ref is the same element with or without the chrome, and\n * `labelRef` reaches the label.\n */\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  props: T,\n): ReactElement;\n/**\n * @deprecated Attach the field's ref to the control's root and call\n * `wrapWithField(component, props)`. The `ref` passed here is ignored.\n */\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  ref: LegacyFieldRef,\n  props: T,\n): ReactElement;\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  ...args: [props: T] | [ref: LegacyFieldRef, props: T]\n) {\n  const props = args[args.length - 1] as T;\n  const isBare = !rendersFieldChrome(props);\n  let {\n    label,\n    extra,\n    labelPosition = 'top',\n    labelStyles,\n    isRequired,\n    isOptional,\n    isDisabled,\n    necessityIndicator,\n    message,\n    messageStyles,\n    description,\n    errorMessage,\n    isInvalid,\n    isValid,\n    labelProps,\n    labelRef,\n    fieldProps,\n    fieldStyles,\n    requiredMark = true,\n    labelTooltip,\n    isHidden,\n    labelSuffix,\n  } = props;\n\n  warnAboutForceField(props);\n\n  warnAboutLegacyTooltip(props);\n\n  // Merge fieldStyles as shorthand for fieldProps.styles (fieldStyles takes priority)\n  const mergedFieldProps = fieldStyles\n    ? mergeProps(fieldProps, { styles: fieldStyles })\n    : fieldProps;\n\n  // Merge labelStyles as shorthand for labelProps.styles (labelStyles takes priority)\n  const mergedLabelProps = labelStyles\n    ? mergeProps(labelProps, { styles: labelStyles })\n    : labelProps;\n\n  // Remove id from fieldProps to avoid duplication (id should be on the input element, not the field wrapper)\n  const { id: _id, ...fieldPropsWithoutId } = (mergedFieldProps as any) || {};\n\n  return (\n    <FieldWrapper\n      {...{\n        label,\n        isBare,\n        extra,\n        labelPosition,\n        isRequired,\n        isOptional,\n        isDisabled,\n        necessityIndicator,\n        labelProps: mergedLabelProps,\n        labelRef,\n        fieldProps: fieldPropsWithoutId,\n        message,\n        messageStyles,\n        description,\n        errorMessage,\n        isInvalid,\n        isValid,\n        requiredMark,\n        labelTooltip,\n        isHidden,\n        labelSuffix,\n        Component: component,\n        // Where the description and message ids come from; see\n        // `useFieldDescribedBy`, which points the control at them.\n        controlId: props.id,\n      }}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAuBA,SAAgBc,mBAAmBC,OAAe;CAChD,MAAM,EAAEC,QAAQC,OAAOC,eAAeH;CAEtC,IAAIC,UAAU,MAAM,OAAO,CAACA;CAE5B,OAAOR,gBAAgBS,KAAK,KAAK,CAAC,CAACC;AACrC;AA4BA,SAAgBG,cACdC,WACA,GAAGG,MACH;CACA,MAAMV,QAAQU,KAAKA,KAAKC,SAAS;CACjC,MAAMV,SAAS,CAACF,mBAAmBC,KAAK;CACxC,IAAI,EACFE,OACAU,OACAC,gBAAgB,OAChBC,aACAC,YACAC,YACAC,YACAC,oBACAC,SACAC,eACAC,aACAC,cACAC,WACAC,SACAC,YACAC,UACAC,YACAC,aACAC,eAAe,MACfC,cACAC,UACAC,gBACEhC;CAEJN,oBAAoBM,KAAK;CAEzBJ,uBAAuBI,KAAK;CAG5B,MAAMiC,mBAAmBL,cACrBpC,WAAWmC,YAAY,EAAEO,QAAQN,YAAY,CAAC,IAC9CD;CAGJ,MAAMQ,mBAAmBrB,cACrBtB,WAAWiC,YAAY,EAAES,QAAQpB,YAAY,CAAC,IAC9CW;CAGJ,MAAM,EAAEW,IAAIC,KAAK,GAAGC,wBAAyBL,oBAA4B,CAAC;CAE1E,OACE,oBAAC,cAAD;EAEI/B;EACAD;EACAW;EACAC;EACAE;EACAC;EACAC;EACAC;EACAO,YAAYU;EACZT;EACAC,YAAYW;EACZnB;EACAC;EACAC;EACAC;EACAC;EACAC;EACAK;EACAC;EACAC;EACAC;EACAO,WAAWhC;EAGXiC,WAAWxC,MAAMoC;CACjB,CAAA;AAGR"}
+{"version":3,"file":"wrapper.js","names":["DOMRef","FocusableRef","BaseProps","Styles","ReactElement","RefObject","FieldBaseProps","FormBaseProps","mergeProps","mergeStyleLayers","hasFieldContent","warnAboutForceField","FieldWrapper","warnAboutLegacyTooltip","WrapWithFieldProps","Omit","rendersFieldChrome","props","isBare","label","forceField","LegacyFieldRef","HTMLElement","wrapWithField","component","T","ref","args","length","extra","labelPosition","labelStyles","isRequired","isOptional","isDisabled","necessityIndicator","message","messageStyles","description","errorMessage","isInvalid","isValid","labelProps","labelRef","fieldProps","fieldStyles","requiredMark","labelTooltip","isHidden","labelSuffix","mergedFieldProps","styles","mergedLabelProps","id","_id","fieldPropsWithoutId","Component","controlId"],"sources":["../../../src/components/form/wrapper.tsx"],"sourcesContent":["import { DOMRef, FocusableRef } from '@react-types/shared';\nimport { BaseProps, Styles } from '@tenphi/tasty';\nimport { ReactElement, RefObject } from 'react';\n\nimport { FieldBaseProps, FormBaseProps } from '../../shared/index';\nimport { mergeProps } from '../../utils/react/index';\nimport { mergeStyleLayers } from '../../utils/styles';\n\nimport { hasFieldContent, warnAboutForceField } from './field-chrome';\nimport { FieldWrapper } from './FieldWrapper/index';\nimport { warnAboutLegacyTooltip } from './legacy-tooltip';\n\n// The input is passed as `component`, never through props.children.\ninterface WrapWithFieldProps\n  extends FieldBaseProps, Omit<BaseProps, 'children'>, FormBaseProps {}\n\n/**\n * Whether `wrapWithField` renders the field chrome for these props. An\n * explicit `isBare` decides; `useFieldProps` sets `isBare={false}` on a bound\n * field, one passed a chrome prop, or one with a `validate` whose errors the\n * control shows (`withFieldChrome`).\n * Otherwise a non-empty `label` renders it, as does the deprecated\n * `forceField`.\n */\nexport function rendersFieldChrome(props: object) {\n  const { isBare, label, forceField } = props as WrapWithFieldProps;\n\n  if (isBare != null) return !isBare;\n\n  return hasFieldContent(label) || !!forceField;\n}\n\ntype LegacyFieldRef =\n  | RefObject<unknown>\n  | FocusableRef<HTMLElement>\n  | DOMRef<HTMLElement>\n  | null\n  | undefined;\n\n/**\n * Wraps a control in its field chrome when it has one, and forwards its chrome\n * props. The chrome takes no ref: the control attaches the field's `ref` to\n * its own root, so the ref is the same element with or without the chrome, and\n * `labelRef` reaches the label.\n */\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  props: T,\n): ReactElement;\n/**\n * @deprecated Attach the field's ref to the control's root and call\n * `wrapWithField(component, props)`. The `ref` passed here is ignored.\n */\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  ref: LegacyFieldRef,\n  props: T,\n): ReactElement;\nexport function wrapWithField<T extends WrapWithFieldProps>(\n  component: ReactElement,\n  ...args: [props: T] | [ref: LegacyFieldRef, props: T]\n) {\n  const props = args[args.length - 1] as T;\n  const isBare = !rendersFieldChrome(props);\n  let {\n    label,\n    extra,\n    labelPosition = 'top',\n    labelStyles,\n    isRequired,\n    isOptional,\n    isDisabled,\n    necessityIndicator,\n    message,\n    messageStyles,\n    description,\n    errorMessage,\n    isInvalid,\n    isValid,\n    labelProps,\n    labelRef,\n    fieldProps,\n    fieldStyles,\n    requiredMark = true,\n    labelTooltip,\n    isHidden,\n    labelSuffix,\n  } = props;\n\n  warnAboutForceField(props);\n\n  warnAboutLegacyTooltip(props);\n\n  // `fieldStyles` is the shorthand for `fieldProps.styles` and wins over it.\n  // Merged as layers, so a `null` reset in either survives to the wrapper.\n  const mergedFieldProps = fieldStyles\n    ? {\n        ...fieldProps,\n        styles: mergeStyleLayers(\n          (fieldProps as { styles?: Styles } | undefined)?.styles,\n          fieldStyles,\n        ),\n      }\n    : fieldProps;\n\n  // Merge labelStyles as shorthand for labelProps.styles (labelStyles takes priority)\n  const mergedLabelProps = labelStyles\n    ? mergeProps(labelProps, { styles: labelStyles })\n    : labelProps;\n\n  // Remove id from fieldProps to avoid duplication (id should be on the input element, not the field wrapper)\n  const { id: _id, ...fieldPropsWithoutId } = (mergedFieldProps as any) || {};\n\n  return (\n    <FieldWrapper\n      {...{\n        label,\n        isBare,\n        extra,\n        labelPosition,\n        isRequired,\n        isOptional,\n        isDisabled,\n        necessityIndicator,\n        labelProps: mergedLabelProps,\n        labelRef,\n        fieldProps: fieldPropsWithoutId,\n        message,\n        messageStyles,\n        description,\n        errorMessage,\n        isInvalid,\n        isValid,\n        requiredMark,\n        labelTooltip,\n        isHidden,\n        labelSuffix,\n        Component: component,\n        // Where the description and message ids come from; see\n        // `useFieldDescribedBy`, which points the control at them.\n        controlId: props.id,\n      }}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAwBA,SAAgBgB,mBAAmBC,OAAe;CAChD,MAAM,EAAEC,QAAQC,OAAOC,eAAeH;CAEtC,IAAIC,UAAU,MAAM,OAAO,CAACA;CAE5B,OAAOR,gBAAgBS,KAAK,KAAK,CAAC,CAACC;AACrC;AA4BA,SAAgBG,cACdC,WACA,GAAGG,MACH;CACA,MAAMV,QAAQU,KAAKA,KAAKC,SAAS;CACjC,MAAMV,SAAS,CAACF,mBAAmBC,KAAK;CACxC,IAAI,EACFE,OACAU,OACAC,gBAAgB,OAChBC,aACAC,YACAC,YACAC,YACAC,oBACAC,SACAC,eACAC,aACAC,cACAC,WACAC,SACAC,YACAC,UACAC,YACAC,aACAC,eAAe,MACfC,cACAC,UACAC,gBACEhC;CAEJN,oBAAoBM,KAAK;CAEzBJ,uBAAuBI,KAAK;CAI5B,MAAMiC,mBAAmBL,cACrB;EACE,GAAGD;EACHO,QAAQ1C,iBACLmC,YAAgDO,QACjDN,WACF;CACF,IACAD;CAGJ,MAAMQ,mBAAmBrB,cACrBvB,WAAWkC,YAAY,EAAES,QAAQpB,YAAY,CAAC,IAC9CW;CAGJ,MAAM,EAAEW,IAAIC,KAAK,GAAGC,wBAAyBL,oBAA4B,CAAC;CAE1E,OACE,oBAAC,cAAD;EAEI/B;EACAD;EACAW;EACAC;EACAE;EACAC;EACAC;EACAC;EACAO,YAAYU;EACZT;EACAC,YAAYW;EACZnB;EACAC;EACAC;EACAC;EACAC;EACAC;EACAK;EACAC;EACAC;EACAC;EACAO,WAAWhC;EAGXiC,WAAWxC,MAAMoC;CACjB,CAAA;AAGR"}

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { useCallback, 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.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | 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/Flex.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/layout/Flow.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/layout/Grid.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/layout/Panel.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { BASE_STYLES, BLOCK_STYLES, COLOR_STYLES, DIMENSION_STYLES, OUTER_STYLES, tasty } from "@tenphi/tasty";

package/dist/components/layout/Prefix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../utils/react/useLayoutEffect.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";

package/dist/components/layout/ResizablePanel.js

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

package/dist/components/layout/Space.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/layout/Suffix.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { c } from "react/compiler-runtime";

package/dist/components/navigation/Pagination/Pagination.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/navigation/Pagination/use-pagination.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { c } from "react/compiler-runtime";
 import { useControlledState } from "@react-stately/utils";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { c } from "react/compiler-runtime";
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { DraggableCollection } from "../../shared/DraggableCollection.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { DropIndicatorElement } from "./styled.js";
 import { useTabsContext } from "./TabsContext.js";
 import { c } from "react/compiler-runtime";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { TabPanelElement } from "./styled.js";
 import { c } from "react/compiler-runtime";
 import { useEffect, useMemo, useRef } from "react";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { useI18n } from "../../../i18n/useI18n.js";
 import { CloseIcon } from "../../../icons/CloseIcon.js";

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

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.201.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.202.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";