themelia-react-ui 2.0.3 → 2.0.4

package/dist/components/base/navigation/page-header/page-header.d.ts

@@ -7,7 +7,7 @@
  * on it.
  */
 import type { Key, ReactNode } from 'react';
-import { type HeadingTag } from '../../../typography';
+import { type HeadingSize, type HeadingTag } from '../../../typography';
 import { type BadgeTone } from '../../badge';
 import { type TextGap } from '../../structure';
 import { type PageHeaderAction, type PageHeaderLinkRenderer } from './page-header-commands';
@@ -41,6 +41,8 @@ export interface PageHeadingProps {
     textGap?: TextGap;
     /** Heading level for a plain-text `title`. Default: `'h2'`. Set for correct document outline. */
     headingTag?: HeadingTag;
+    /** Visual title scale, independent of heading level. Defaults to the subject role (`base`). */
+    titleSize?: HeadingSize;
     /** Convenience for a single badge beside the title. Ignored when `badges` is set. */
     badge?: PageHeadingBadge;
     /** Badges beside the title, in order. Takes precedence over `badge`. */
@@ -108,7 +110,7 @@ export interface PageHeadingProps {
      */
     withSeparator?: boolean;
 }
-export declare function PageHeading({ eyebrow, title, description, textGap, headingTag, badge, badges, breadcrumbs, leading, beforeTitle, titlePrefix, titleSuffix, afterDescription, actions, primaryAction, secondaryActions, moreActionsLabel, renderLink, children, className, contentClassName, eyebrowClassName, titleClassName, titleRowClassName, descriptionClassName, actionsClassName, withSeparator, }: PageHeadingProps): import("react").JSX.Element;
+export declare function PageHeading({ eyebrow, title, description, textGap, headingTag, titleSize, badge, badges, breadcrumbs, leading, beforeTitle, titlePrefix, titleSuffix, afterDescription, actions, primaryAction, secondaryActions, moreActionsLabel, renderLink, children, className, contentClassName, eyebrowClassName, titleClassName, titleRowClassName, descriptionClassName, actionsClassName, withSeparator, }: PageHeadingProps): import("react").JSX.Element;
 export declare namespace PageHeading {
     var displayName: string;
 }

package/dist/components/base/structure/composition.recipes.d.ts

@@ -0,0 +1,17 @@
+/** Private relationship defaults. Generic Stack/Grid retain their own defaults;
+ * surface regions and collection rows keep their independent recipe owners. */
+export declare const compositionRhythm: {
+    readonly commands: "md";
+    readonly compactActions: "xs";
+    readonly related: "xl";
+    readonly subjects: "2xl";
+    readonly page: "3xl";
+};
+/** Native layout owners use the same vocabulary as Stack/Grid. */
+export declare const compositionClasses: {
+    readonly commands: string;
+    readonly compactActions: string;
+    readonly related: string;
+    readonly subjects: string;
+    readonly page: string;
+};

package/dist/components/base/text-inputs/hooks/use-form-field-state.d.ts

@@ -1,6 +1,11 @@
+import { type RefObject } from 'react';
 export interface UseFormFieldStateOptions {
     /** Controlled value from parent */
-    controlledValue?: string;
+    controlledValue?: string | null;
+    /** Presence of the value prop, including an explicitly empty value. */
+    hasControlledValue?: boolean;
+    /** Native field whose value may be assigned by registration or reset. */
+    nativeRef?: RefObject<HTMLInputElement | HTMLTextAreaElement | null>;
     /** Default value for uncontrolled mode */
     defaultValue?: string;
     /** Maximum character length */
@@ -45,4 +50,4 @@ export interface UseFormFieldStateReturn {
  * - React Hook Form compatibility detection
  * - ID generation
  */
-export declare function useFormFieldState({ controlledValue, defaultValue, maxLength, showCharacterCount, providedId, idPrefix, hasOnChange, }: UseFormFieldStateOptions): UseFormFieldStateReturn;
+export declare function useFormFieldState({ controlledValue, hasControlledValue, nativeRef, defaultValue, maxLength, showCharacterCount, providedId, idPrefix, hasOnChange, }: UseFormFieldStateOptions): UseFormFieldStateReturn;

package/dist/components/base/text-inputs/input.d.ts

@@ -7,7 +7,7 @@ export interface InputStrings {
     clear: string;
 }
 export declare const defaultInputStrings: InputStrings;
-export interface InputProps extends Omit<React.ComponentProps<'input'>, 'onChange' | 'size'> {
+export interface InputProps extends Omit<React.ComponentProps<'input'>, 'onChange' | 'size' | 'value'> {
     /** Decorative or semantic icon rendered before the value. */
     startIcon?: LucideIcon;
     /** Decorative or semantic icon rendered after the value. */
@@ -34,8 +34,10 @@ export interface InputProps extends Omit<React.ComponentProps<'input'>, 'onChang
     size?: FormControlSize;
     /** Native-style value callback for the controlled raw string. */
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    /** Raw string callback, emitted alongside the native change event. */
+    onValueChange?: (value: string) => void;
     /** Controlled raw string value. */
-    value?: string;
+    value?: string | null;
     /** Initial raw string value for uncontrolled usage. */
     defaultValue?: string;
     /** Accessible copy overrides for input-owned actions. */

package/dist/components/base/text-inputs/textarea.d.ts

@@ -5,7 +5,7 @@ export interface TextareaStrings {
     clear: string;
 }
 export declare const defaultTextareaStrings: TextareaStrings;
-export interface TextareaProps extends Omit<React.ComponentProps<'textarea'>, 'onChange'> {
+export interface TextareaProps extends Omit<React.ComponentProps<'textarea'>, 'onChange' | 'value'> {
     /** Overrides the character-count and clear copy. */
     strings?: StringsProp<TextareaStrings>;
     /** Character cap, also used as the denominator of the count. */
@@ -28,8 +28,10 @@ export interface TextareaProps extends Omit<React.ComponentProps<'textarea'>, 'o
     /** Height at which the field stops growing and starts scrolling. */
     maxRows?: number;
     onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    /** Raw string callback, emitted alongside the native change event. */
+    onValueChange?: (value: string) => void;
     /** Current text. Controlled. */
-    value?: string;
+    value?: string | null;
     /** Initial text for uncontrolled use. */
     defaultValue?: string;
 }

package/dist/components/base/value-inputs/date-time-input.d.ts

@@ -1,4 +1,5 @@
-export interface DateTimeInputProps {
+import type { DatePickerBaseProps } from '../date-pickers/datepicker.types';
+export interface DateTimeInputProps extends Pick<DatePickerBaseProps, 'triggerRef' | 'onBlur' | 'aria-describedby' | 'aria-invalid'> {
     /** Controlled value (ISO string) */
     value?: string;
     /** Change handler */

package/dist/components/base/value-inputs/slider.d.ts

@@ -12,9 +12,13 @@ export interface SliderImitationEvent {
     };
 }
 export interface SliderProps {
+    /** Native range input ref; the forwarded ref continues to name the slider root. */
+    inputRef?: React.Ref<HTMLInputElement>;
+    /** Blur callback from the native range input. */
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
     /** Field name for form integration */
     name?: string;
-    /** Element id */
+    /** Slider group id; use aria-labelledby to associate visible copy with its native range input. */
     id?: string;
     /** Accessible name when a visible label is not associated with the slider. */
     'aria-label'?: string;

package/dist/components/base/value-inputs/tags-input.d.ts

@@ -21,6 +21,10 @@ export interface TagsInputStrings {
 }
 export declare const defaultTagsInputStrings: TagsInputStrings;
 export interface TagsInputProps<T = string> {
+    /** Ref to the editable input, for focus and form registration. */
+    inputRef?: React.Ref<HTMLInputElement>;
+    /** Native blur callback, emitted even when there is no draft to commit. */
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
     /** ID of the editable input, for an external field label. */
     id?: string;
     /** Names the editable input when no visible label points at it. */
@@ -87,7 +91,7 @@ export interface TagsInputProps<T = string> {
     /** Additional class names */
     className?: string;
 }
-export declare function TagsInput<T = string>({ id, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, value, defaultValue, onValueChange, name, placeholder, recommendations, maxTags, showMaxTags, allowDuplicates, validate, disabled, showClearAll, renderTag, delimiter, addOnBlur, minLength, maxLength, sortTags, caseSensitive, field, invalid, className, strings: stringsProp, }: TagsInputProps<T>): React.JSX.Element;
+export declare function TagsInput<T = string>({ id, inputRef: forwardedInputRef, onBlur, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, value, defaultValue, onValueChange, name, placeholder, recommendations, maxTags, showMaxTags, allowDuplicates, validate, disabled, showClearAll, renderTag, delimiter, addOnBlur, minLength, maxLength, sortTags, caseSensitive, field, invalid, className, strings: stringsProp, }: TagsInputProps<T>): React.JSX.Element;
 export declare namespace TagsInput {
     var displayName: string;
 }

package/dist/components/typography/text.styles.d.ts

@@ -38,6 +38,31 @@ export declare const headingSizes: {
     readonly '3xl': "text-3xl leading-tight tracking-tight";
     readonly '4xl': "text-4xl leading-tight tracking-tight";
 };
+/** Library-owned title responsibilities; semantic heading tags remain separate.
+ * A nested record title is a subject, even when its component is called a header. */
+export declare const headingRoleSizes: {
+    readonly route: "xl";
+    readonly subject: "base";
+    readonly subsection: "sm";
+};
+/** Shared copy intent without fixing the provider's ordinary text size.
+ * Compact supporting copy deliberately uses the smaller secondary role. */
+export declare const copyRoleProps: {
+    readonly primary: {
+        readonly type: "inherit";
+    };
+    readonly structuralDescription: {
+        readonly type: "secondary";
+    };
+    readonly supporting: {
+        readonly type: "secondary";
+        readonly size: "xs";
+    };
+    readonly subsection: {
+        readonly type: "inherit";
+        readonly weight: "semibold";
+    };
+};
 export declare const textWeights: {
     readonly normal: "font-normal";
     readonly regular: "font-normal";
@@ -72,7 +97,7 @@ export declare const textLineHeights: {
 export declare const textVariants: (props?: ({
     type?: "primary" | "secondary" | "success" | "inherit" | "main" | "inverse" | "discrete" | "error" | null | undefined;
     size?: "sm" | "lg" | "inherit" | "xxs" | "xs" | "pxs" | "base" | "xl" | null | undefined;
-    weight?: "inherit" | "bold" | "normal" | "medium" | "regular" | "semibold" | null | undefined;
+    weight?: "inherit" | "bold" | "normal" | "medium" | "semibold" | "regular" | null | undefined;
     align?: "center" | "left" | "right" | null | undefined;
     lineHeight?: "inherit" | "none" | "normal" | "loose" | "relaxed" | "tight" | "snug" | null | undefined;
     numeric?: boolean | null | undefined;

package/dist/composition.recipes-COdiFhxB.js

@@ -0,0 +1,19 @@
+import { n as e } from "./structure.recipes-BB4-n58V.js";
+//#region src/components/base/structure/composition.recipes.ts
+var t = {
+	commands: "md",
+	compactActions: "xs",
+	related: "xl",
+	subjects: "2xl",
+	page: "3xl"
+}, n = {
+	commands: e({ gap: t.commands }).join(" "),
+	compactActions: e({ gap: t.compactActions }).join(" "),
+	related: e({ gap: t.related }).join(" "),
+	subjects: e({ gap: t.subjects }).join(" "),
+	page: e({ gap: t.page }).join(" ")
+};
+//#endregion
+export { t as n, n as t };
+
+//# sourceMappingURL=composition.recipes-COdiFhxB.js.map

package/dist/composition.recipes-COdiFhxB.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"composition.recipes-COdiFhxB.js","names":["gapRecipe","compositionRhythm","compositionClasses"],"sources":["../src/components/base/structure/composition.recipes.ts"],"sourcesContent":["import {gapRecipe} from './structure.recipes';\nimport type {StructureGap} from './structure.types';\n\n/** Private relationship defaults. Generic Stack/Grid retain their own defaults;\n * surface regions and collection rows keep their independent recipe owners. */\nexport const compositionRhythm = {\n commands: 'md',\n compactActions: 'xs',\n related: 'xl',\n subjects: '2xl',\n page: '3xl',\n} as const satisfies Record<string, StructureGap>;\n\n/** Native layout owners use the same vocabulary as Stack/Grid. */\nexport const compositionClasses = {\n commands: gapRecipe({gap: compositionRhythm.commands}).join(' '),\n compactActions: gapRecipe({gap: compositionRhythm.compactActions}).join(' '),\n related: gapRecipe({gap: compositionRhythm.related}).join(' '),\n subjects: gapRecipe({gap: compositionRhythm.subjects}).join(' '),\n page: gapRecipe({gap: compositionRhythm.page}).join(' '),\n} as const satisfies Record<keyof typeof compositionRhythm, string>;\n"],"mappings":";;AAKA,IAAaC,IAAoB;CAChC,UAAU;CACV,gBAAgB;CAChB,SAAS;CACT,UAAU;CACV,MAAM;AACP,GAGaC,IAAqB;CACjC,UAAUF,EAAU,EAAC,KAAKC,EAAkB,SAAQ,CAAC,CAAC,CAAC,KAAK,GAAG;CAC/D,gBAAgBD,EAAU,EAAC,KAAKC,EAAkB,eAAc,CAAC,CAAC,CAAC,KAAK,GAAG;CAC3E,SAASD,EAAU,EAAC,KAAKC,EAAkB,QAAO,CAAC,CAAC,CAAC,KAAK,GAAG;CAC7D,UAAUD,EAAU,EAAC,KAAKC,EAAkB,SAAQ,CAAC,CAAC,CAAC,KAAK,GAAG;CAC/D,MAAMD,EAAU,EAAC,KAAKC,EAAkB,KAAI,CAAC,CAAC,CAAC,KAAK,GAAG;AACxD"}

package/dist/containers-CRmHf7GP.js

@@ -0,0 +1,104 @@
+"use client";
+import { t as e } from "./utils-CF3c95Io.js";
+import { t } from "./focus-recipes-B653VaLq.js";
+import { o as n } from "./structure.recipes-BB4-n58V.js";
+import { n as r, t as i } from "./composition.recipes-COdiFhxB.js";
+import { t as a } from "./container.recipes-D9t8MHR3.js";
+import { forwardRef as o } from "react";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useRender as u } from "@base-ui/react/use-render";
+//#region src/components/layout/containers/content-container.tsx
+var d = o(function({ className: t, maxWidth: n, gutter: r, render: i, ...o }, s) {
+	return u({
+		defaultTagName: "div",
+		ref: s,
+		render: i,
+		props: {
+			...o,
+			className: e("container--component @container/content", a({
+				maxWidth: n,
+				gutter: r
+			}), t)
+		},
+		state: {}
+	});
+});
+d.displayName = "Container";
+//#endregion
+//#region src/components/layout/containers/page-viewport.tsx
+var f = o(function({ className: n, render: r, tabIndex: i = 0, ...a }, o) {
+	return u({
+		defaultTagName: "div",
+		ref: o,
+		render: r,
+		props: {
+			...a,
+			tabIndex: i,
+			className: e(`page-viewport--component min-h-0 min-w-0 flex-1 overflow-auto overscroll-contain [scrollbar-gutter:stable] @container/page focus-visible:outline-none ${t.inset}`, n)
+		},
+		state: {}
+	});
+});
+f.displayName = "PageViewport";
+//#endregion
+//#region src/components/layout/containers/section.tsx
+var p = o(function({ className: t, gap: i, render: a, ...o }, s) {
+	return u({
+		defaultTagName: "section",
+		ref: s,
+		render: a,
+		props: {
+			...o,
+			className: e("section--component", n({ gap: i ?? r.related }), t)
+		},
+		state: {}
+	});
+});
+p.displayName = "Section";
+//#endregion
+//#region src/components/layout/containers/two-column-layout.tsx
+var m = o(function({ header: t, main: n, aside: r, footer: a, stickyAside: o = !1, adaptTo: d = "viewport", slotProps: f, className: p, render: m, ...h }, g) {
+	let { className: _, ...v } = f?.header ?? {}, { className: y, ...b } = f?.main ?? {}, { className: x, ...S } = f?.aside ?? {}, { className: C, ...w } = f?.footer ?? {};
+	return u({
+		defaultTagName: "div",
+		ref: g,
+		render: m,
+		props: {
+			...h,
+			"data-slot": "two-column-layout",
+			className: e("two-column-layout--component grid min-w-0 grid-cols-1", i.subjects, d === "container" ? "@3xl:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]" : "lg:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]", p),
+			children: /* @__PURE__ */ l(s, { children: [
+				t == null ? null : /* @__PURE__ */ c("div", {
+					...v,
+					"data-slot": "two-column-layout-header",
+					className: e("two-column-layout--header col-span-full min-w-0", _),
+					children: t
+				}),
+				/* @__PURE__ */ c("div", {
+					...b,
+					"data-slot": "two-column-layout-main",
+					className: e("two-column-layout--main flex min-h-0 min-w-0 flex-col", i.subjects, y),
+					children: n
+				}),
+				/* @__PURE__ */ c("aside", {
+					...S,
+					"data-slot": "two-column-layout-aside",
+					className: e("two-column-layout--aside flex min-h-0 min-w-0 flex-col", i.subjects, o && (d === "container" ? "@3xl:sticky @3xl:top-space-2xl @3xl:self-start" : "lg:sticky lg:top-space-2xl lg:self-start"), x),
+					children: r
+				}),
+				a == null ? null : /* @__PURE__ */ c("div", {
+					...w,
+					"data-slot": "two-column-layout-footer",
+					className: e("two-column-layout--footer col-span-full min-w-0", C),
+					children: a
+				})
+			] })
+		},
+		state: {}
+	});
+});
+m.displayName = "TwoColumnLayout";
+//#endregion
+export { d as i, p as n, f as r, m as t };
+
+//# sourceMappingURL=containers-CRmHf7GP.js.map

package/dist/containers-CRmHf7GP.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"containers-CRmHf7GP.js","names":["_Fragment","cn","stackRecipe","compositionRhythm","compositionClasses","containerRecipe","Fragment$1","Container","forwardRef","props","useRender","className","PageViewport","focusRecipes","Section","gap","TwoColumnLayout","headerClassName","headerProps","slotProps","mainClassName","mainProps","asideClassName","asideProps","footerClassName","footerProps","adaptTo","header","main","stickyAside","aside","footer"],"sources":["../src/components/layout/containers/content-container.tsx","../src/components/layout/containers/page-viewport.tsx","../src/components/layout/containers/section.tsx","../src/components/layout/containers/two-column-layout.tsx"],"sourcesContent":["import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport { containerRecipe } from './container.recipes';\nimport type { ContainerProps } from './containers.types';\n\n/** Container — one centered content-width and inline-gutter owner. */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(function Container(\n\t{ className, maxWidth, gutter, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('container--component @container/content', containerRecipe({ maxWidth, gutter }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nContainer.displayName = 'Container';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { cn } from '../../../lib/utils';\n\nimport type { PageViewportProps } from './containers.types';\nimport { focusRecipes } from '../../../lib/focus-recipes';\n\n/** PageViewport — the single page-scroll and page-container-query owner. */\nexport const PageViewport = forwardRef<HTMLDivElement, PageViewportProps>(function PageViewport(\n\t{ className, render, tabIndex = 0, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'div',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\ttabIndex,\n\t\t\tclassName: cn(\n\t\t\t\t`page-viewport--component min-h-0 min-w-0 flex-1 overflow-auto overscroll-contain [scrollbar-gutter:stable] @container/page focus-visible:outline-none ${focusRecipes.inset}`,\n\t\t\t\tclassName,\n\t\t\t),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nPageViewport.displayName = 'PageViewport';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\n\nimport { stackRecipe } from '../../base/structure/structure.recipes';\nimport {compositionRhythm} from '../../base/structure/composition.recipes';\nimport { cn } from '../../../lib/utils';\n\nimport type { SectionProps } from './containers.types';\n\n/** Section — a semantic vertical-rhythm owner for page content groups. */\nexport const Section = forwardRef<HTMLElement, SectionProps>(function Section(\n\t{ className, gap, render, ...props },\n\tref,\n) {\n\treturn useRender({\n\t\tdefaultTagName: 'section',\n\t\tref,\n\t\trender,\n\t\tprops: {\n\t\t\t...props,\n\t\t\tclassName: cn('section--component', stackRecipe({ gap: gap ?? compositionRhythm.related }), className),\n\t\t},\n\t\tstate: {},\n\t});\n});\n\nSection.displayName = 'Section';\n","import { useRender } from '@base-ui/react/use-render';\nimport { forwardRef } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '../../../lib/utils';\nimport {compositionClasses} from '../../base/structure/composition.recipes';\nimport type { LayoutSlotAttributes } from '../layout.types';\n\nexport interface TwoColumnLayoutSlotProps {\n\theader?: LayoutSlotAttributes<HTMLDivElement>;\n\tmain?: LayoutSlotAttributes<HTMLDivElement>;\n\taside?: LayoutSlotAttributes<HTMLElement>;\n\tfooter?: LayoutSlotAttributes<HTMLDivElement>;\n}\n\nexport interface TwoColumnLayoutProps extends useRender.ComponentProps<'div'> {\n\t/** Optional content spanning both columns before the work regions. */\n\theader?: ReactNode;\n\t/** Primary detail, form, or index content. */\n\tmain: ReactNode;\n\t/** Secondary summary, support, or action rail. */\n\taside: ReactNode;\n\t/** Optional content spanning both columns after the work regions. */\n\tfooter?: ReactNode;\n\t/** Keep the aside visible while the nearest page viewport scrolls. */\n\tstickyAside?: boolean;\n\t/** Preserve viewport breakpoints by default, or adapt inside Container/PageViewport. */\n\tadaptTo?: 'viewport' | 'container';\n\t/** Native attributes for each stable region. */\n\tslotProps?: TwoColumnLayoutSlotProps;\n}\n\n/** TwoColumnLayout — one truthful, stable-order main/aside grid. */\nexport const TwoColumnLayout = forwardRef<HTMLDivElement, TwoColumnLayoutProps>(\n\tfunction TwoColumnLayout(\n\t\t{\n\t\t\theader,\n\t\t\tmain,\n\t\t\taside,\n\t\t\tfooter,\n\t\t\tstickyAside = false,\n\t\t\tadaptTo = 'viewport',\n\t\t\tslotProps,\n\t\t\tclassName,\n\t\t\trender,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst { className: headerClassName, ...headerProps } = slotProps?.header ?? {};\n\t\tconst { className: mainClassName, ...mainProps } = slotProps?.main ?? {};\n\t\tconst { className: asideClassName, ...asideProps } = slotProps?.aside ?? {};\n\t\tconst { className: footerClassName, ...footerProps } = slotProps?.footer ?? {};\n\n\t\treturn useRender({\n\t\t\tdefaultTagName: 'div',\n\t\t\tref,\n\t\t\trender,\n\t\t\tprops: {\n\t\t\t\t...props,\n\t\t\t\t'data-slot': 'two-column-layout',\n\t\t\t\tclassName: cn(\n\t\t\t\t\t'two-column-layout--component grid min-w-0 grid-cols-1', compositionClasses.subjects,\n\t\t\t\t\tadaptTo === 'container' ? '@3xl:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]' : 'lg:grid-cols-[minmax(0,2fr)_minmax(18rem,1fr)]',\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t\tchildren: (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{header !== undefined && header !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...headerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-header\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--header col-span-full min-w-0', headerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{header}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t{...mainProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-main\"\n\t\t\t\t\t\t\tclassName={cn('two-column-layout--main flex min-h-0 min-w-0 flex-col', compositionClasses.subjects, mainClassName)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{main}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<aside\n\t\t\t\t\t\t\t{...asideProps}\n\t\t\t\t\t\t\tdata-slot=\"two-column-layout-aside\"\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t'two-column-layout--aside flex min-h-0 min-w-0 flex-col', compositionClasses.subjects,\n\t\t\t\t\t\t\t\tstickyAside && (adaptTo === 'container' ? '@3xl:sticky @3xl:top-space-2xl @3xl:self-start' : 'lg:sticky lg:top-space-2xl lg:self-start'),\n\t\t\t\t\t\t\t\tasideClassName,\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{aside}\n\t\t\t\t\t\t</aside>\n\t\t\t\t\t\t{footer !== undefined && footer !== null ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...footerProps}\n\t\t\t\t\t\t\t\tdata-slot=\"two-column-layout-footer\"\n\t\t\t\t\t\t\t\tclassName={cn('two-column-layout--footer col-span-full min-w-0', footerClassName)}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{footer}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t</>\n\t\t\t\t),\n\t\t\t},\n\t\t\tstate: {},\n\t\t});\n\t},\n);\n\nTwoColumnLayout.displayName = 'TwoColumnLayout';\n"],"mappings":";;;;;;;;;;AASA,IAAaO,IAAYC,EAA2C,SACnE,EAAE,cAAW,aAAU,WAAQ,WAAQ,GAAGC,KAC1C,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,2CAA2CI,EAAgB;IAAE;IAAU;GAAO,CAAC,GAAGM,CAAS;EAC1G;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAU,cAAc;;;AChBxB,IAAaC,IAAeJ,EAA8C,SACzE,EAAE,cAAW,WAAQ,cAAW,GAAG,GAAGC,KACtC,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH;GACA,WAAWR,EACV,yJAAyJY,EAAa,SACtKF,CACD;EACD;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAa,cAAc;;;ACnB3B,IAAaG,IAAUN,EAAsC,SAC5D,EAAE,cAAW,QAAK,WAAQ,GAAGC,KAC7B,GACC;CACD,OAAOC,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,WAAWR,EAAG,sBAAsBC,EAAY,EAAE,KAAKa,KAAOZ,EAAkB,QAAQ,CAAC,GAAGQ,CAAS;EACtG;EACA,OAAO,CAAC;CACT,CAAC;AACF,CAAC;AAED,EAAQ,cAAc;;;ACOtB,IAAaK,IAAkBR,EAC9B,SACC,EACC,WACA,SACA,UACA,WACA,iBAAc,IACd,aAAU,YACV,cACA,cACA,WACA,GAAGC,KAEJ,GACC;CACD,IAAM,EAAE,WAAWQ,GAAiB,GAAGC,MAAgBC,GAAW,UAAU,CAAC,GACvE,EAAE,WAAWC,GAAe,GAAGC,MAAcF,GAAW,QAAQ,CAAC,GACjE,EAAE,WAAWG,GAAgB,GAAGC,MAAeJ,GAAW,SAAS,CAAC,GACpE,EAAE,WAAWK,GAAiB,GAAGC,MAAgBN,GAAW,UAAU,CAAC;CAE7E,OAAOT,EAAU;EAChB,gBAAgB;EAChB;EACA;EACA,OAAO;GACN,GAAGD;GACH,aAAa;GACb,WAAWR,EACV,yDAAyDG,EAAmB,UAC5EsB,MAAY,cAAc,qDAAqD,kDAC/Ef,CACD;GACA,UACC,kBAAAX,GAAA,EAAA,UAAA;IACE2B,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIT;KACJ,aAAU;KACV,WAAWjB,EAAG,mDAAmDgB,CAAe;KAE/E,UAAAU;IACG,CAAA;IAEN,kBAAC,OAAD;KACC,GAAIN;KACJ,aAAU;KACV,WAAWpB,EAAG,yDAAyDG,EAAmB,UAAUgB,CAAa;KAEhH,UAAAQ;IACG,CAAA;IACL,kBAAC,SAAD;KACC,GAAIL;KACJ,aAAU;KACV,WAAWtB,EACV,0DAA0DG,EAAmB,UAC7EyB,MAAgBH,MAAY,cAAc,mDAAmD,6CAC7FJ,CACD;KAEC,UAAAQ;IACK,CAAA;IACNC,KAAmC,OAQhC,OAPH,kBAAC,OAAD;KACC,GAAIN;KACJ,aAAU;KACV,WAAWxB,EAAG,mDAAmDuB,CAAe;KAE/E,UAAAO;IACG,CAAA;GAEL,EAAA,CAAA;EAEJ;EACA,OAAO,CAAC;CACT,CAAC;AACF,CACD;AAEA,EAAgB,cAAc"}

package/dist/{copyable-ClBuk_UK.js → copyable-CnGCZdX4.js}

@@ -1,8 +1,8 @@
 "use client";
 import { useStrings as e } from "./lib/strings.js";
-import { t } from "./utils-BRhFDwuU.js";
-import { n } from "./buttons-DPZekJFu.js";
-import { c as r } from "./typography-UTnveOEy.js";
+import { t } from "./utils-CF3c95Io.js";
+import { n } from "./buttons-BbfzgczK.js";
+import { c as r } from "./typography-CSyJrh28.js";
 import { forwardRef as i, useEffect as a, useState as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 import { Check as l, Copy as u } from "lucide-react";
@@ -62,4 +62,4 @@ p.displayName = "Copyable";
 //#endregion
 export { f as n, p as t };
 
-//# sourceMappingURL=copyable-ClBuk_UK.js.map
+//# sourceMappingURL=copyable-CnGCZdX4.js.map

package/dist/{copyable-ClBuk_UK.js.map → copyable-CnGCZdX4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"copyable-ClBuk_UK.js","names":["Text","defaultCopyableStrings","Copyable","forwardRef","stringsProp","props","strings","useStrings","copied","setCopied","useState","timeout","handleCopy","value","toast","onCopy","error","onError","hasRichDisplayValue","displayValue","buttonClassName","buttonAriaLabel","copyButtonProps","buttonProps","cn","truncate","className","mono","contentClassName","Button","Check","Copy"],"sources":["../src/components/base/copyable/copyable.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport {\n\tforwardRef,\n\tuseEffect,\n\tuseState,\n\ttype ComponentPropsWithoutRef,\n\ttype ReactNode,\n} from 'react';\n\nimport { toast } from 'sonner';\n\nimport { Button, type ButtonActionProps } from '../buttons';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nexport interface CopyableStrings {\n\tcopyLabel: string;\n\tcopiedLabel: string;\n\tsuccess: string;\n\terror: string;\n}\n\nexport const defaultCopyableStrings: CopyableStrings = {\n\tcopyLabel: 'Copy value',\n\tcopiedLabel: 'Copied',\n\tsuccess: 'Copied to clipboard',\n\terror: 'Failed to copy',\n};\n\nexport interface CopyableProps extends Omit<\n\tComponentPropsWithoutRef<'span'>,\n\t'children' | 'onCopy' | 'onError'\n> {\n\t/** Value written to the clipboard. */\n\tvalue: string;\n\t/** Optional display content when it differs from the copied value. */\n\tdisplayValue?: ReactNode;\n\t/** Use monospace typography for scalar display content. */\n\tmono?: boolean;\n\t/** Truncate scalar display content with an ellipsis at the width the caller allots. */\n\ttruncate?: boolean;\n\t/** Classes for the scalar display-content wrapper. */\n\tcontentClassName?: string;\n\t/** Classes and native action props for the dedicated copy button. */\n\tbuttonProps?: Omit<ButtonActionProps, 'children' | 'onClick' | 'type'>;\n\t/** Localizable copy affordance and toast copy. */\n\tstrings?: StringsProp<CopyableStrings>;\n\t/** Called after the Clipboard API successfully writes the value. */\n\tonCopy?: (value: string) => void;\n\t/** Called when the Clipboard API rejects the write. */\n\tonError?: (error: unknown) => void;\n}\n\n/**\n * Copyable keeps display content passive and renders a sibling copy button.\n * This permits rich display nodes such as Email or Url without nesting one\n * interactive element inside another.\n */\nexport const Copyable = forwardRef<HTMLSpanElement, CopyableProps>(function Copyable({\n\tvalue,\n\tdisplayValue,\n\tmono = false,\n\ttruncate = false,\n\tclassName,\n\tcontentClassName,\n\tbuttonProps,\n\tstrings: stringsProp,\n\tonCopy,\n\tonError,\n\t...props\n}, ref) {\n\tconst strings = useStrings(defaultCopyableStrings, stringsProp);\n\tconst [copied, setCopied] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!copied) return;\n\t\tconst timeout = window.setTimeout(() => setCopied(false), 2000);\n\t\treturn () => window.clearTimeout(timeout);\n\t}, [copied]);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(value);\n\t\t\tsetCopied(true);\n\t\t\ttoast.success(strings.success);\n\t\t\tonCopy?.(value);\n\t\t} catch (error) {\n\t\t\ttoast.error(strings.error);\n\t\t\tonError?.(error);\n\t\t}\n\t};\n\n\tconst isSimpleText =\n\t\ttypeof displayValue === 'string' ||\n\t\ttypeof displayValue === 'number' ||\n\t\ttypeof displayValue === 'bigint';\n\tconst hasRichDisplayValue = displayValue !== undefined && !isSimpleText;\n\tconst {\n\t\tclassName: buttonClassName,\n\t\t'aria-label': buttonAriaLabel,\n\t\t...copyButtonProps\n\t} = buttonProps ?? {};\n\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t'copyable--component group inline-flex min-w-0 items-center gap-space-sm',\n\t\t\t\t// An inline-flex root sizes to its content, so without this it grew\n\t\t\t\t// past the width the caller allotted and took the copy button out of\n\t\t\t\t// view with it. Capping the root is what gives the content something\n\t\t\t\t// to truncate against; `block` on the value below is the other half.\n\t\t\t\ttruncate && 'max-w-full',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"copyable--content min-w-0 text-link-color\">\n\t\t\t\t{hasRichDisplayValue ? (\n\t\t\t\t\tdisplayValue\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tmono && 'font-mono',\n\t\t\t\t\t\t\t// `block` is load-bearing: Text renders a <span>, and overflow\n\t\t\t\t\t\t\t// and max-width do not apply to a non-replaced inline box, so\n\t\t\t\t\t\t\t// `truncate` alone set only white-space and the value ran past\n\t\t\t\t\t\t\t// its container with no ellipsis. Truncating against the width\n\t\t\t\t\t\t\t// the caller allots also retires a hardcoded max-w-[300px],\n\t\t\t\t\t\t\t// which no consumer token could reach.\n\t\t\t\t\t\t\ttruncate && 'block truncate',\n\t\t\t\t\t\t\t'text-link-color',\n\t\t\t\t\t\t\tcontentClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{displayValue ?? value}\n\t\t\t\t\t</Text>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t\t<Button\n\t\t\t\t{...copyButtonProps}\n\t\t\t\ttype=\"button\"\n\t\t\t\tsize=\"sm\" iconOnly\n\t\t\t\ttone=\"secondary\"\n\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\taria-label={buttonAriaLabel ?? (copied ? strings.copiedLabel : strings.copyLabel)}\n\t\t\t\tonClick={() => void handleCopy()}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'copyable--trigger shrink-0 text-link-color opacity-60 transition-opacity hover:opacity-100 focus-visible:opacity-100',\n\t\t\t\t\tbuttonClassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{copied ? (\n\t\t\t\t\t<Check className=\"size-icon-sm text-success\" aria-hidden=\"true\" />\n\t\t\t\t) : (\n\t\t\t\t\t<Copy className=\"size-icon-sm\" aria-hidden=\"true\" />\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t</span>\n\t);\n});\n\nCopyable.displayName = 'Copyable';\n"],"mappings":";;;;;;;;;;AAuBA,IAAaC,IAA0C;CACtD,WAAW;CACX,aAAa;CACb,SAAS;CACT,OAAO;AACR,GA+BaC,IAAWC,EAA2C,SAAkB,EACpF,UACA,iBACA,UAAO,IACP,cAAW,IACX,cACA,qBACA,gBACA,SAASC,GACT,WACA,YACA,GAAGC,KACD,GAAK;CACP,IAAMC,IAAUC,EAAWN,GAAwBG,CAAW,GACxD,CAACI,GAAQC,KAAaC,EAAS,EAAK;CAE1C,QAAgB;EACf,IAAI,CAACF,GAAQ;EACb,IAAMG,IAAU,OAAO,iBAAiBF,EAAU,EAAK,GAAG,GAAI;EAC9D,aAAa,OAAO,aAAaE,CAAO;CACzC,GAAG,CAACH,CAAM,CAAC;CAEX,IAAMI,IAAa,YAAY;EAC9B,IAAI;GAIH,AAHA,MAAM,UAAU,UAAU,UAAUC,CAAK,GACzCJ,EAAU,EAAI,GACdK,EAAM,QAAQR,EAAQ,OAAO,GAC7BS,IAASF,CAAK;EACf,SAASG,GAAO;GAEf,AADAF,EAAM,MAAMR,EAAQ,KAAK,GACzBW,IAAUD,CAAK;EAChB;CACD,GAMME,IAAsBC,MAAiB,KAAA,KAH5C,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,UAEnB,EACL,WAAWC,GACX,cAAcC,GACd,GAAGC,MACAC,KAAe,CAAC;CAEpB,OACC,kBAAC,QAAD;EACM;EACL,WAAWC,EACV,2EAKAC,KAAY,cACZC,CACD;EACA,GAAIrB;EAXL,UAAA,CAaC,kBAAC,QAAD;GAAM,WAAU;GACd,UAAAa,IACAC,IAEA,kBAACnB,GAAD;IACC,KAAI;IACJ,WAAWwB,EACVG,KAAQ,aAORF,KAAY,kBACZ,mBACAG,CACD;IAEC,UAAAT,KAAgBN;GACZ,CAAA;EAEF,CAAA,GACN,kBAACgB,GAAD;GACC,GAAIP;GACJ,MAAK;GACL,MAAK;GAAK,UAAA;GACV,MAAK;GACL,aAAY;GACZ,cAAYD,MAAoBb,IAASF,EAAQ,cAAcA,EAAQ;GACvE,eAAe,KAAKM,EAAW;GAC/B,WAAWY,EACV,wHACAJ,CACD;GAEC,UAAAZ,IACA,kBAACsB,GAAD;IAAO,WAAU;IAA4B,eAAY;GAAQ,CAAA,IAEjE,kBAACC,GAAD;IAAM,WAAU;IAAe,eAAY;GAAQ,CAAA;EAE7C,CAAA,CACH;;AAER,CAAC;AAED,EAAS,cAAc"}
+{"version":3,"file":"copyable-CnGCZdX4.js","names":["Text","defaultCopyableStrings","Copyable","forwardRef","stringsProp","props","strings","useStrings","copied","setCopied","useState","timeout","handleCopy","value","toast","onCopy","error","onError","hasRichDisplayValue","displayValue","buttonClassName","buttonAriaLabel","copyButtonProps","buttonProps","cn","truncate","className","mono","contentClassName","Button","Check","Copy"],"sources":["../src/components/base/copyable/copyable.tsx"],"sourcesContent":["import { Check, Copy } from 'lucide-react';\nimport {\n\tforwardRef,\n\tuseEffect,\n\tuseState,\n\ttype ComponentPropsWithoutRef,\n\ttype ReactNode,\n} from 'react';\n\nimport { toast } from 'sonner';\n\nimport { Button, type ButtonActionProps } from '../buttons';\nimport { Text } from '../../typography';\nimport { useStrings, type StringsProp } from '../../../lib/strings';\nimport { cn } from '../../../lib/utils';\n\nexport interface CopyableStrings {\n\tcopyLabel: string;\n\tcopiedLabel: string;\n\tsuccess: string;\n\terror: string;\n}\n\nexport const defaultCopyableStrings: CopyableStrings = {\n\tcopyLabel: 'Copy value',\n\tcopiedLabel: 'Copied',\n\tsuccess: 'Copied to clipboard',\n\terror: 'Failed to copy',\n};\n\nexport interface CopyableProps extends Omit<\n\tComponentPropsWithoutRef<'span'>,\n\t'children' | 'onCopy' | 'onError'\n> {\n\t/** Value written to the clipboard. */\n\tvalue: string;\n\t/** Optional display content when it differs from the copied value. */\n\tdisplayValue?: ReactNode;\n\t/** Use monospace typography for scalar display content. */\n\tmono?: boolean;\n\t/** Truncate scalar display content with an ellipsis at the width the caller allots. */\n\ttruncate?: boolean;\n\t/** Classes for the scalar display-content wrapper. */\n\tcontentClassName?: string;\n\t/** Classes and native action props for the dedicated copy button. */\n\tbuttonProps?: Omit<ButtonActionProps, 'children' | 'onClick' | 'type'>;\n\t/** Localizable copy affordance and toast copy. */\n\tstrings?: StringsProp<CopyableStrings>;\n\t/** Called after the Clipboard API successfully writes the value. */\n\tonCopy?: (value: string) => void;\n\t/** Called when the Clipboard API rejects the write. */\n\tonError?: (error: unknown) => void;\n}\n\n/**\n * Copyable keeps display content passive and renders a sibling copy button.\n * This permits rich display nodes such as Email or Url without nesting one\n * interactive element inside another.\n */\nexport const Copyable = forwardRef<HTMLSpanElement, CopyableProps>(function Copyable({\n\tvalue,\n\tdisplayValue,\n\tmono = false,\n\ttruncate = false,\n\tclassName,\n\tcontentClassName,\n\tbuttonProps,\n\tstrings: stringsProp,\n\tonCopy,\n\tonError,\n\t...props\n}, ref) {\n\tconst strings = useStrings(defaultCopyableStrings, stringsProp);\n\tconst [copied, setCopied] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (!copied) return;\n\t\tconst timeout = window.setTimeout(() => setCopied(false), 2000);\n\t\treturn () => window.clearTimeout(timeout);\n\t}, [copied]);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(value);\n\t\t\tsetCopied(true);\n\t\t\ttoast.success(strings.success);\n\t\t\tonCopy?.(value);\n\t\t} catch (error) {\n\t\t\ttoast.error(strings.error);\n\t\t\tonError?.(error);\n\t\t}\n\t};\n\n\tconst isSimpleText =\n\t\ttypeof displayValue === 'string' ||\n\t\ttypeof displayValue === 'number' ||\n\t\ttypeof displayValue === 'bigint';\n\tconst hasRichDisplayValue = displayValue !== undefined && !isSimpleText;\n\tconst {\n\t\tclassName: buttonClassName,\n\t\t'aria-label': buttonAriaLabel,\n\t\t...copyButtonProps\n\t} = buttonProps ?? {};\n\n\treturn (\n\t\t<span\n\t\t\tref={ref}\n\t\t\tclassName={cn(\n\t\t\t\t'copyable--component group inline-flex min-w-0 items-center gap-space-sm',\n\t\t\t\t// An inline-flex root sizes to its content, so without this it grew\n\t\t\t\t// past the width the caller allotted and took the copy button out of\n\t\t\t\t// view with it. Capping the root is what gives the content something\n\t\t\t\t// to truncate against; `block` on the value below is the other half.\n\t\t\t\ttruncate && 'max-w-full',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"copyable--content min-w-0 text-link-color\">\n\t\t\t\t{hasRichDisplayValue ? (\n\t\t\t\t\tdisplayValue\n\t\t\t\t) : (\n\t\t\t\t\t<Text\n\t\t\t\t\t\ttag=\"span\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\tmono && 'font-mono',\n\t\t\t\t\t\t\t// `block` is load-bearing: Text renders a <span>, and overflow\n\t\t\t\t\t\t\t// and max-width do not apply to a non-replaced inline box, so\n\t\t\t\t\t\t\t// `truncate` alone set only white-space and the value ran past\n\t\t\t\t\t\t\t// its container with no ellipsis. Truncating against the width\n\t\t\t\t\t\t\t// the caller allots also retires a hardcoded max-w-[300px],\n\t\t\t\t\t\t\t// which no consumer token could reach.\n\t\t\t\t\t\t\ttruncate && 'block truncate',\n\t\t\t\t\t\t\t'text-link-color',\n\t\t\t\t\t\t\tcontentClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{displayValue ?? value}\n\t\t\t\t\t</Text>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t\t<Button\n\t\t\t\t{...copyButtonProps}\n\t\t\t\ttype=\"button\"\n\t\t\t\tsize=\"sm\" iconOnly\n\t\t\t\ttone=\"secondary\"\n\t\t\t\tbuttonStyle=\"ghost\"\n\t\t\t\taria-label={buttonAriaLabel ?? (copied ? strings.copiedLabel : strings.copyLabel)}\n\t\t\t\tonClick={() => void handleCopy()}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t'copyable--trigger shrink-0 text-link-color opacity-60 transition-opacity hover:opacity-100 focus-visible:opacity-100',\n\t\t\t\t\tbuttonClassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{copied ? (\n\t\t\t\t\t<Check className=\"size-icon-sm text-success\" aria-hidden=\"true\" />\n\t\t\t\t) : (\n\t\t\t\t\t<Copy className=\"size-icon-sm\" aria-hidden=\"true\" />\n\t\t\t\t)}\n\t\t\t</Button>\n\t\t</span>\n\t);\n});\n\nCopyable.displayName = 'Copyable';\n"],"mappings":";;;;;;;;;;AAuBA,IAAaC,IAA0C;CACtD,WAAW;CACX,aAAa;CACb,SAAS;CACT,OAAO;AACR,GA+BaC,IAAWC,EAA2C,SAAkB,EACpF,UACA,iBACA,UAAO,IACP,cAAW,IACX,cACA,qBACA,gBACA,SAASC,GACT,WACA,YACA,GAAGC,KACD,GAAK;CACP,IAAMC,IAAUC,EAAWN,GAAwBG,CAAW,GACxD,CAACI,GAAQC,KAAaC,EAAS,EAAK;CAE1C,QAAgB;EACf,IAAI,CAACF,GAAQ;EACb,IAAMG,IAAU,OAAO,iBAAiBF,EAAU,EAAK,GAAG,GAAI;EAC9D,aAAa,OAAO,aAAaE,CAAO;CACzC,GAAG,CAACH,CAAM,CAAC;CAEX,IAAMI,IAAa,YAAY;EAC9B,IAAI;GAIH,AAHA,MAAM,UAAU,UAAU,UAAUC,CAAK,GACzCJ,EAAU,EAAI,GACdK,EAAM,QAAQR,EAAQ,OAAO,GAC7BS,IAASF,CAAK;EACf,SAASG,GAAO;GAEf,AADAF,EAAM,MAAMR,EAAQ,KAAK,GACzBW,IAAUD,CAAK;EAChB;CACD,GAMME,IAAsBC,MAAiB,KAAA,KAH5C,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,YACxB,OAAOA,KAAiB,UAEnB,EACL,WAAWC,GACX,cAAcC,GACd,GAAGC,MACAC,KAAe,CAAC;CAEpB,OACC,kBAAC,QAAD;EACM;EACL,WAAWC,EACV,2EAKAC,KAAY,cACZC,CACD;EACA,GAAIrB;EAXL,UAAA,CAaC,kBAAC,QAAD;GAAM,WAAU;GACd,UAAAa,IACAC,IAEA,kBAACnB,GAAD;IACC,KAAI;IACJ,WAAWwB,EACVG,KAAQ,aAORF,KAAY,kBACZ,mBACAG,CACD;IAEC,UAAAT,KAAgBN;GACZ,CAAA;EAEF,CAAA,GACN,kBAACgB,GAAD;GACC,GAAIP;GACJ,MAAK;GACL,MAAK;GAAK,UAAA;GACV,MAAK;GACL,aAAY;GACZ,cAAYD,MAAoBb,IAASF,EAAQ,cAAcA,EAAQ;GACvE,eAAe,KAAKM,EAAW;GAC/B,WAAWY,EACV,wHACAJ,CACD;GAEC,UAAAZ,IACA,kBAACsB,GAAD;IAAO,WAAU;IAA4B,eAAY;GAAQ,CAAA,IAEjE,kBAACC,GAAD;IAAM,WAAU;IAAe,eAAY;GAAQ,CAAA;EAE7C,CAAA,CACH;;AAER,CAAC;AAED,EAAS,cAAc"}