@maanlamp/react-web-ui 0.0.0-stage → 0.1.0

package/dist/components/tag-group/tag-group.d.ts

@@ -0,0 +1,54 @@
+import type { ReactNode } from "react";
+import { type TagGroupProps as AriaTagGroupProps, type TagListProps as AriaTagListProps, type TagProps as AriaTagProps } from "react-aria-components";
+import type { Tone, ToneVariant } from "../../lib/tone.ts";
+export type TagGroupRootProps = Omit<AriaTagGroupProps, "aria-label" | "className"> & Readonly<{
+    /** What the tags are, such as "Active filters". */
+    "aria-label": string;
+    className?: string;
+}>;
+declare const Root: ({ className, ...props }: TagGroupRootProps) => ReactNode;
+export type TagGroupListProps<T extends object> = Omit<AriaTagListProps<T>, "className"> & Readonly<{
+    className?: string;
+}>;
+declare const List: <T extends object>({ className, ...props }: TagGroupListProps<T>) => ReactNode;
+export type TagGroupTagProps = Omit<AriaTagProps, "className"> & Readonly<{
+    /** Status colour. @default "neutral" */
+    tone?: Tone;
+    /** @default "subtle" */
+    variant?: ToneVariant;
+    className?: string;
+}>;
+declare const GroupTag: ({ tone, variant, className, ...props }: TagGroupTagProps) => ReactNode;
+export type TagGroupRemoveProps = Readonly<{
+    /** The action's name, such as "Remove", surfaced as the tooltip hint; the button is named by it followed by its tag. */
+    label: string;
+    className?: string;
+}>;
+declare const Remove: ({ label, className, }: TagGroupRemoveProps) => ReactNode;
+type TagGroupParts = Readonly<{
+    Root: typeof Root;
+    List: typeof List;
+    Tag: typeof GroupTag;
+    Remove: typeof Remove;
+}>;
+/**
+ * A row of tags the reader moves through with the arrow keys and removes,
+ * on react-aria's `TagGroup`. `Root` takes `onRemove`, called with the keys
+ * of the tags removed by their `Remove` button or by Backspace or Delete. A
+ * tag leads with `Tag.Dot` or `Tag.Icon` like a static `Tag`.
+ *
+ * @example
+ * <TagGroup.Root aria-label="Active filters" onRemove={keys => removeFilters(keys)}>
+ * 	<TagGroup.List items={filters}>
+ * 		{filter => (
+ * 			<TagGroup.Tag id={filter.id} textValue={filter.label}>
+ * 				{filter.label}
+ * 				<TagGroup.Remove label="Remove" />
+ * 			</TagGroup.Tag>
+ * 		)}
+ * 	</TagGroup.List>
+ * </TagGroup.Root>
+ */
+export declare const TagGroup: TagGroupParts;
+export {};
+//# sourceMappingURL=tag-group.d.ts.map

package/dist/components/tag-group/tag-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-group.d.ts","sourceRoot":"","sources":["../../../src/components/tag-group/tag-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAIN,KAAK,aAAa,IAAI,iBAAiB,EAEvC,KAAK,YAAY,IAAI,gBAAgB,EACrC,KAAK,QAAQ,IAAI,YAAY,EAC7B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAK3D,MAAM,MAAM,iBAAiB,GAAG,IAAI,CACnC,iBAAiB,EACjB,YAAY,GAAG,WAAW,CAC1B,GACA,QAAQ,CAAC;IACR,mDAAmD;IACnD,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEJ,QAAA,MAAM,IAAI,4BAGP,iBAAiB,KAAG,SAKtB,CAAC;AAEF,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,MAAM,IAAI,IAAI,CACrD,gBAAgB,CAAC,CAAC,CAAC,EACnB,WAAW,CACX,GACA,QAAQ,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAElC,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,MAAM,2BAG3B,iBAAiB,CAAC,CAAC,CAAC,KAAG,SAKzB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAClC,YAAY,EACZ,WAAW,CACX,GACA,QAAQ,CAAC;IACR,wCAAwC;IACxC,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,wBAAwB;IACxB,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEJ,QAAA,MAAM,QAAQ,2CAKX,gBAAgB,KAAG,SAOrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IAC1C,wHAAwH;IACxH,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,QAAA,MAAM,MAAM,0BAGT,mBAAmB,KAAG,SAUxB,CAAC;AAEF,KAAK,aAAa,GAAG,QAAQ,CAAC;IAC7B,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,GAAG,EAAE,OAAO,QAAQ,CAAC;IACrB,MAAM,EAAE,OAAO,MAAM,CAAC;CACtB,CAAC,CAAC;AAEH;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,QAAQ,EAAE,aAKtB,CAAC"}

package/dist/components/tag-group/tag-group.js

@@ -0,0 +1,182 @@
+import SvgClose from "../../vendor/@material-design-icons/svg/outlined/close.js";
+import { Icon } from "../icon/icon.js";
+import { Tooltip } from "../tooltip/tooltip.js";
+import tag_group_module_default from "./tag-group.module.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Button, Tag, TagGroup, TagList } from "react-aria-components";
+// src/components/tag-group/tag-group.tsx
+var Root = (t0) => {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = clsx(tag_group_module_default.root, className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(TagGroup, {
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+};
+var List = (t0) => {
+	const $ = c(8);
+	let className;
+	let props;
+	if ($[0] !== t0) {
+		({className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+	} else {
+		className = $[1];
+		props = $[2];
+	}
+	let t1;
+	if ($[3] !== className) {
+		t1 = clsx(tag_group_module_default.list, className);
+		$[3] = className;
+		$[4] = t1;
+	} else t1 = $[4];
+	let t2;
+	if ($[5] !== props || $[6] !== t1) {
+		t2 = /* @__PURE__ */ jsx(TagList, {
+			className: t1,
+			...props
+		});
+		$[5] = props;
+		$[6] = t1;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+};
+var GroupTag = (t0) => {
+	const $ = c(12);
+	let className;
+	let props;
+	let t1;
+	let t2;
+	if ($[0] !== t0) {
+		({tone: t1, variant: t2, className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = props;
+		$[3] = t1;
+		$[4] = t2;
+	} else {
+		className = $[1];
+		props = $[2];
+		t1 = $[3];
+		t2 = $[4];
+	}
+	const tone = t1 === void 0 ? "neutral" : t1;
+	const variant = t2 === void 0 ? "subtle" : t2;
+	let t3;
+	if ($[5] !== className) {
+		t3 = clsx(tag_group_module_default.tag, className);
+		$[5] = className;
+		$[6] = t3;
+	} else t3 = $[6];
+	let t4;
+	if ($[7] !== props || $[8] !== t3 || $[9] !== tone || $[10] !== variant) {
+		t4 = /* @__PURE__ */ jsx(Tag, {
+			"data-tone": tone,
+			"data-variant": variant,
+			className: t3,
+			...props
+		});
+		$[7] = props;
+		$[8] = t3;
+		$[9] = tone;
+		$[10] = variant;
+		$[11] = t4;
+	} else t4 = $[11];
+	return t4;
+};
+var Remove = (t0) => {
+	const $ = c(9);
+	const { label, className } = t0;
+	let t1;
+	if ($[0] !== className) {
+		t1 = clsx(tag_group_module_default.remove, className);
+		$[0] = className;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = /* @__PURE__ */ jsx(Icon, {
+			svg: SvgClose,
+			label: "",
+			size: .875
+		});
+		$[2] = t2;
+	} else t2 = $[2];
+	let t3;
+	if ($[3] !== label || $[4] !== t1) {
+		t3 = /* @__PURE__ */ jsx(Button, {
+			slot: "remove",
+			excludeFromTabOrder: true,
+			"aria-label": label,
+			className: t1,
+			children: t2
+		});
+		$[3] = label;
+		$[4] = t1;
+		$[5] = t3;
+	} else t3 = $[5];
+	let t4;
+	if ($[6] !== label || $[7] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Tooltip, {
+			content: label,
+			children: t3
+		});
+		$[6] = label;
+		$[7] = t3;
+		$[8] = t4;
+	} else t4 = $[8];
+	return t4;
+};
+/**
+* A row of tags the reader moves through with the arrow keys and removes,
+* on react-aria's `TagGroup`. `Root` takes `onRemove`, called with the keys
+* of the tags removed by their `Remove` button or by Backspace or Delete. A
+* tag leads with `Tag.Dot` or `Tag.Icon` like a static `Tag`.
+*
+* @example
+* <TagGroup.Root aria-label="Active filters" onRemove={keys => removeFilters(keys)}>
+* 	<TagGroup.List items={filters}>
+* 		{filter => (
+* 			<TagGroup.Tag id={filter.id} textValue={filter.label}>
+* 				{filter.label}
+* 				<TagGroup.Remove label="Remove" />
+* 			</TagGroup.Tag>
+* 		)}
+* 	</TagGroup.List>
+* </TagGroup.Root>
+*/
+var TagGroup$1 = {
+	Root,
+	List,
+	Tag: GroupTag,
+	Remove
+};
+export { TagGroup$1 as TagGroup };

package/dist/components/tag-group/tag-group.module.js

@@ -0,0 +1,12 @@
+import './tag-group.css';// src/components/tag-group/tag-group.module.scss
+var root = "_root_siv3m_3";
+var list = "_list_siv3m_9";
+var tag = "_tag_siv3m_15";
+var remove = "_remove_siv3m_121";
+var tag_group_module_default = {
+	root,
+	list,
+	tag,
+	remove
+};
+export { tag_group_module_default as default, list, remove, root, tag };

package/dist/components/text-field/connect-text-preset.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentType, ReactNode } from "react";
+import { type ConnectedFieldProps } from "../../lib/forms/use-connected-field.ts";
+import type { TextPresetProps } from "./text-preset.ts";
+/** The props a text preset's bridge takes: the preset's own, less what the form supplies. */
+export type TSFTextPresetProps<TExtra extends object> = Omit<TextPresetProps, keyof ConnectedFieldProps | "value" | "onValueChange"> & TExtra;
+/**
+ * Wraps a text preset as a TanStack Form bridge. The format is the preset's;
+ * the rule behind it belongs to the form's schema.
+ *
+ * @example
+ * export const TSFEmailField = connectTextPreset(EmailField);
+ */
+export declare const connectTextPreset: <TExtra extends object>(Preset: ComponentType<TextPresetProps & TExtra>) => ((props: TSFTextPresetProps<TExtra>) => ReactNode);
+//# sourceMappingURL=connect-text-preset.d.ts.map

package/dist/components/text-field/connect-text-preset.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"connect-text-preset.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/connect-text-preset.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EACN,KAAK,mBAAmB,EAExB,MAAM,wCAAwC,CAAC;AAChD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAExD,6FAA6F;AAC7F,MAAM,MAAM,kBAAkB,CAAC,MAAM,SAAS,MAAM,IACnD,IAAI,CACH,eAAe,EACf,MAAM,mBAAmB,GAAG,OAAO,GAAG,eAAe,CACrD,GACA,MAAM,CAAC;AAET;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,GAAI,MAAM,SAAS,MAAM,UAC9C,aAAa,CAAC,eAAe,GAAG,MAAM,CAAC,KAC7C,CAAC,CAAC,KAAK,EAAE,kBAAkB,CAAC,MAAM,CAAC,KAAK,SAAS,CAgBnD,CAAC"}

package/dist/components/text-field/connect-text-preset.js

@@ -0,0 +1,34 @@
+import { useConnectedField } from "../../lib/forms/use-connected-field.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+// src/components/text-field/connect-text-preset.tsx
+/**
+* Wraps a text preset as a TanStack Form bridge. The format is the preset's;
+* the rule behind it belongs to the form's schema.
+*
+* @example
+* export const TSFEmailField = connectTextPreset(EmailField);
+*/
+var connectTextPreset = (Preset) => {
+	const Connected = (props) => {
+		const $ = c(5);
+		const { field, props: connected } = useConnectedField();
+		let t0;
+		if ($[0] !== connected || $[1] !== field.handleChange || $[2] !== field.state.value || $[3] !== props) {
+			t0 = /* @__PURE__ */ jsx(Preset, {
+				...props,
+				...connected,
+				value: field.state.value,
+				onValueChange: field.handleChange
+			});
+			$[0] = connected;
+			$[1] = field.handleChange;
+			$[2] = field.state.value;
+			$[3] = props;
+			$[4] = t0;
+		} else t0 = $[4];
+		return t0;
+	};
+	return Connected;
+};
+export { connectTextPreset };

package/dist/components/text-field/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./connect-text-preset.tsx";
+export * from "./text-field.tsx";
+export * from "./text-input.tsx";
+export * from "./text-preset.ts";
+export * from "./tsf-text-field.tsx";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/text-field/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/index.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC"}

package/dist/components/text-field/index.js

@@ -0,0 +1,5 @@
+import { connectTextPreset } from "./connect-text-preset.js";
+import { TextField } from "./text-field.js";
+import { TextInput } from "./text-input.js";
+import { TSFTextField } from "./tsf-text-field.js";
+export { TSFTextField, TextField, TextInput, connectTextPreset };

package/dist/components/text-field/text-field.css

@@ -0,0 +1,164 @@
+@layer kit.reset, kit.base, kit.components;
+@layer kit.components {
+  ._root_15bd7_3 {
+    min-inline-size: 0;
+  }
+  ._group_15bd7_6 {
+    --field-fg: var(--sys-color-text);
+    --field-muted-fg: var(--sys-color-text-muted);
+    align-items: center;
+    box-sizing: border-box;
+    min-block-size: calc(1lh + 2 * var(--sys-unit-6) + 2 * 1px);
+    border: 1px solid var(--sys-color-border);
+    border-radius: var(--sys-radius-sm);
+    background: var(--sys-color-surface);
+    padding: var(--sys-unit-6);
+    color: var(--field-fg);
+    font: var(--sys-font-body-medium);
+  }
+  ._group_15bd7_6 {
+    outline: 0 solid var(--sys-color-focus-ring);
+    outline-offset: var(--sys-focus-ring-offset);
+  }
+  ._group_15bd7_6[data-focus-visible] {
+    outline-width: var(--sys-focus-ring-width);
+  }
+  @media not (prefers-reduced-motion) {
+    ._group_15bd7_6 {
+      transition: border-color var(--sys-motion-instant) var(--sys-motion-standard), background var(--sys-motion-instant) var(--sys-motion-standard);
+    }
+  }
+  ._group_15bd7_6:hover:not([data-disabled], [data-readonly]), ._group_15bd7_6[data-focused], ._group_15bd7_6[data-popup-open] {
+    border-color: var(--sys-color-primary);
+  }
+  ._group_15bd7_6[data-readonly] {
+    --field-fg: var(--sys-color-text);
+    border-style: dashed;
+    border-color: var(--sys-color-outline);
+    background: var(--sys-color-surface-high);
+    color: var(--field-fg);
+  }
+  ._group_15bd7_6[data-pending] {
+    cursor: progress;
+    caret-color: var(--sys-color-text-muted);
+  }
+  ._group_15bd7_6[data-invalid] {
+    --field-fg: var(--sys-color-error-fg);
+    --field-muted-fg: var(--sys-color-error-fg);
+    border-color: var(--sys-color-error-fg);
+    background-color: var(--sys-color-error-bg);
+    color: var(--field-fg);
+  }
+  ._group_15bd7_6[data-disabled] {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+  ._group_15bd7_6 {
+    position: relative;
+    display: flex;
+    gap: var(--sys-unit-4);
+  }
+  ._group_15bd7_6 {
+    inline-size: 100%;
+    cursor: text;
+  }
+  ._control_15bd7_65 {
+    flex: 1;
+    min-inline-size: 0;
+    border: none;
+    background: none;
+    padding: 0;
+    color: inherit;
+    font: inherit;
+  }
+  ._control_15bd7_65::-webkit-search-cancel-button {
+    display: none;
+    appearance: none;
+  }
+  ._control_15bd7_65::-webkit-search-decoration {
+    display: none;
+    appearance: none;
+  }
+  ._control_15bd7_65 {
+    line-height: normal;
+  }
+  ._control_15bd7_65::placeholder {
+    color: var(--field-muted-fg);
+  }
+  ._bar_15bd7_88 {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: var(--sys-unit-4);
+    pointer-events: none;
+  }
+  ._bar_15bd7_88:empty {
+    display: none;
+  }
+  ._inlay_15bd7_98 {
+    display: inline-flex;
+    flex: none;
+    align-items: center;
+    gap: var(--sys-unit-2);
+    color: var(--field-muted-fg);
+    font: var(--sys-font-body-medium);
+    cursor: default;
+    pointer-events: none;
+    line-height: normal;
+  }
+  ._action_15bd7_109 {
+    position: relative;
+    flex: none;
+    margin-block: calc(-1 * var(--sys-unit-6));
+    cursor: pointer;
+  }
+  @media (any-pointer: coarse) {
+    ._action_15bd7_109::before {
+      content: "";
+      position: absolute;
+      inset: 50%;
+      translate: -50% -50%;
+      inline-size: max(100%, var(--sys-unit-22));
+      block-size: var(--sys-unit-22);
+    }
+  }
+  ._copyStatus_15bd7_125 {
+    position: absolute;
+    overflow: hidden;
+    clip-path: inset(50%);
+    inline-size: 1px;
+    block-size: 1px;
+    white-space: nowrap;
+  }
+  ._counter_15bd7_133 {
+    --counter-fg: var(
+    	--text-field-counter-fg,
+    	var(--sys-color-text-muted)
+    );
+    align-self: flex-end;
+    color: var(--counter-fg);
+    font: var(--text-field-counter-font, var(--sys-font-body-small));
+    font-variant-numeric: tabular-nums;
+    cursor: default;
+  }
+  ._counter_15bd7_133[data-tone=warning] {
+    --counter-fg: var(
+    	--text-field-counter-warning-fg,
+    	var(--sys-color-warning-fg)
+    );
+  }
+  ._counter_15bd7_133[data-tone=error] {
+    --counter-fg: var(
+    	--text-field-counter-error-fg,
+    	var(--sys-color-error-fg)
+    );
+  }
+  ._visuallyHidden_15bd7_156 {
+    position: absolute;
+    overflow: hidden;
+    clip-path: inset(50%);
+    inline-size: 1px;
+    block-size: 1px;
+    white-space: nowrap;
+  }
+}

package/dist/components/text-field/text-field.d.ts

@@ -0,0 +1,57 @@
+import type { ReactNode } from "react";
+import type { FieldProps } from "../field/index.ts";
+import { type SvgComponent } from "../icon/index.ts";
+import { type TextInputInputProps, type TextInputRootProps } from "./text-input.tsx";
+/** The clear button: off, or on with its accessible name. */
+export type TextFieldClearProps = Readonly<{
+    clearable?: false;
+    clearLabel?: undefined;
+}> | Readonly<{
+    /** Adds the clear button once the field holds a value. */
+    clearable: true;
+    /** The clear button's accessible name and tooltip, such as "Clear". */
+    clearLabel: string;
+}>;
+/** The copy-to-clipboard button: off, or on with the copy it shows. */
+export type TextFieldCopyProps = Readonly<{
+    copyable?: false;
+    copyLabel?: undefined;
+    copiedLabel?: undefined;
+    copyFailedLabel?: undefined;
+}> | Readonly<{
+    /** Adds a copy-to-clipboard button once the field holds a value. */
+    copyable: true;
+    /** The copy button's accessible name and tooltip, such as "Copy". */
+    copyLabel: string;
+    /** Announced once the value is on the clipboard, such as "Copied". */
+    copiedLabel: string;
+    /** Announced when copying failed and the text is selected instead. */
+    copyFailedLabel: string;
+}>;
+/** Every `TextField` prop but the optional clear and copy buttons. */
+export type TextFieldBaseProps = FieldProps & Omit<TextInputRootProps, keyof FieldProps | "children"> & Pick<TextInputInputProps, "type" | "placeholder" | "name" | "id" | "autoComplete" | "autoCapitalize" | "inputMode" | "enterKeyHint" | "spellCheck" | "onBlur" | "onFocus"> & Readonly<{
+    /** Keeps the label in the accessibility tree but out of view. */
+    labelHidden?: boolean;
+    /** Decorative leading icon inside the group. */
+    icon?: SvgComponent;
+    /** Static leading text, such as a currency sign. */
+    prefix?: ReactNode;
+    /** Static trailing text, such as a unit. */
+    suffix?: ReactNode;
+}>;
+export type TextFieldProps = TextFieldBaseProps & TextFieldClearProps & TextFieldCopyProps;
+/**
+ * A labelled text field: label, a bordered group holding the control with its
+ * optional icon, affixes, pending spinner, clear and copy buttons, then the
+ * counter, description and error. Assembled from `TextInput`'s parts.
+ *
+ * @example
+ * <TextField
+ * 	label="Name"
+ * 	optionalLabel="optional"
+ * 	value={name}
+ * 	onValueChange={setName}
+ * />
+ */
+export declare const TextField: ({ label, labelHidden, description, errors, requiredness, optionalLabel, icon, prefix, suffix, clearable, clearLabel, copyable, copyLabel, copiedLabel, copyFailedLabel, value, onValueChange, disabled, readOnly, dirty, touched, pending, maxLength, state, className, ...inputProps }: TextFieldProps) => ReactNode;
+//# sourceMappingURL=text-field.d.ts.map

package/dist/components/text-field/text-field.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/text-field.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAQ,KAAK,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAEN,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,MAAM,kBAAkB,CAAC;AAG1B,6DAA6D;AAC7D,MAAM,MAAM,mBAAmB,GAC5B,QAAQ,CAAC;IACT,SAAS,CAAC,EAAE,KAAK,CAAC;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC,GACF,QAAQ,CAAC;IACT,0DAA0D;IAC1D,SAAS,EAAE,IAAI,CAAC;IAChB,uEAAuE;IACvE,UAAU,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEN,uEAAuE;AACvE,MAAM,MAAM,kBAAkB,GAC3B,QAAQ,CAAC;IACT,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,eAAe,CAAC,EAAE,SAAS,CAAC;CAC3B,CAAC,GACF,QAAQ,CAAC;IACT,oEAAoE;IACpE,QAAQ,EAAE,IAAI,CAAC;IACf,qEAAqE;IACrE,SAAS,EAAE,MAAM,CAAC;IAClB,sEAAsE;IACtE,WAAW,EAAE,MAAM,CAAC;IACpB,sEAAsE;IACtE,eAAe,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEN,sEAAsE;AACtE,MAAM,MAAM,kBAAkB,GAAG,UAAU,GAC1C,IAAI,CAAC,kBAAkB,EAAE,MAAM,UAAU,GAAG,UAAU,CAAC,GACvD,IAAI,CACH,mBAAmB,EACjB,MAAM,GACN,aAAa,GACb,MAAM,GACN,IAAI,GACJ,cAAc,GACd,gBAAgB,GAChB,WAAW,GACX,cAAc,GACd,YAAY,GACZ,QAAQ,GACR,SAAS,CACX,GACD,QAAQ,CAAC;IACR,iEAAiE;IACjE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gDAAgD;IAChD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,oDAAoD;IACpD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC9C,mBAAmB,GACnB,kBAAkB,CAAC;AAEpB;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,SAAS,4RA2BnB,cAAc,KAAG,SAoDnB,CAAC"}