@eifi1/ui-kit 0.23.0 → 0.24.0

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

@@ -1,9 +1,7 @@
 import * as react from 'react';
 import { ReactElement, ComponentPropsWithoutRef, ReactNode, Ref, MouseEvent, KeyboardEvent } from 'react';
 import { LucideIcon } from 'lucide-react';
-import { bi as KitLinkComponent } from '../feedback-BxeQVzwq.js';
-import '../feedback-attachment-fGAzZPf0.js';
-import '../feedback/feedback-inbox.js';
+import { bX as KitLinkComponent } from '../feedback-DOwPu-Il.js';
 import './tooltip.js';
 import '../hooks/use-anchored-rect.js';
 import '../lib/clipping.js';

package/dist/components/time-input.d.ts

@@ -1,8 +1,5 @@
 import * as react from 'react';
-import { bf as InputProps } from '../feedback-BxeQVzwq.js';
-import '../feedback-attachment-fGAzZPf0.js';
-import '../feedback/feedback-inbox.js';
-import 'lucide-react';
+import { bU as InputProps } from '../feedback-DOwPu-Il.js';
 import './tooltip.js';
 import '../hooks/use-anchored-rect.js';
 import '../lib/clipping.js';
@@ -13,6 +10,7 @@ import './mini-calendar.js';
 import './calendar-heatmap.js';
 import './popover.js';
 import './chip.js';
+import 'lucide-react';
 import './field-sync.js';
 import '../wizard/types.js';
 import '../tour/tour.js';

package/dist/components/ui.d.ts

@@ -1,12 +1,9 @@
 import 'react';
 import './tooltip.js';
-export { B as Button, a as ButtonClassesOptions, b as ButtonLinkProps, c as ButtonProps, d as ButtonSize, e as ButtonTone, f as ButtonVariant, g as Card, h as CardAction, i as CardActionProps, j as CardContent, k as CardContentProps, l as CardDensity, m as CardDescription, n as CardDescriptionProps, o as CardFooter, p as CardFooterProps, q as CardHeader, r as CardHeaderProps, s as CardProps, t as CardTitle, u as CardTitleLevel, v as CardTitleProps, w as CardTone, x as CharacterCountLabels, X as DEFAULT_CHARACTER_COUNT_LABELS, aa as DEFAULT_PASSWORD_REVEAL_LABELS, af as DEFAULT_TABS_LABELS, an as EmptyState, ao as EmptyStateProps, ap as FIELD_BASE, aq as FIELD_DISPLAY, ar as FIELD_FLOATING_PAD, as as FIELD_INVALID, at as FIELD_TRIGGER, au as FIELD_WRITABLE_LOOK, av as FLOATING_INPUT_CLASS, aw as FLOATING_LABEL_CLASS, aJ as FieldChevron, aK as FieldChevronProps, aL as FieldHint, aM as FieldHintProps, aU as FloatingField, aV as FloatingFieldProps, b6 as IconButton, b7 as IconButtonGlyphSize, b8 as IconButtonLinkProps, b9 as IconButtonProps, ba as IconButtonSize, bb as IconButtonTone, bc as IconButtonToneColor, bd as IconButtonVariant, be as Input, bf as InputProps, bk as Label, bm as LabelProps, bo as PHONE_QUERY, bp as PasswordRevealLabels, bv as Select, bw as SelectProps, bJ as Spinner, bK as SpinnerProps, bM as TabItem, bN as Tabs, bO as TabsLabels, bP as TabsProps, bQ as Textarea, bR as TextareaProps, c1 as buttonClasses, c5 as resolvePasswordRevealLabels } from '../feedback-BxeQVzwq.js';
+export { B as Button, a as ButtonClassesOptions, b as ButtonLinkProps, c as ButtonProps, d as ButtonSize, e as ButtonTone, f as ButtonVariant, g as Card, h as CardAction, i as CardActionProps, j as CardContent, k as CardContentProps, l as CardDensity, m as CardDescription, n as CardDescriptionProps, o as CardFooter, p as CardFooterProps, q as CardHeader, r as CardHeaderProps, s as CardProps, t as CardTitle, u as CardTitleLevel, v as CardTitleProps, w as CardTone, x as CharacterCountLabels, Z as DEFAULT_CHARACTER_COUNT_LABELS, ag as DEFAULT_PASSWORD_REVEAL_LABELS, al as DEFAULT_TABS_LABELS, at as EmptyState, au as EmptyStateProps, az as FIELD_BASE, aA as FIELD_DISPLAY, aB as FIELD_FLOATING_PAD, aC as FIELD_INVALID, aD as FIELD_TRIGGER, aE as FIELD_WRITABLE_LOOK, aF as FLOATING_INPUT_CLASS, aG as FLOATING_LABEL_CLASS, bm as FieldChevron, bn as FieldChevronProps, bo as FieldHint, bp as FieldHintProps, bx as FloatingField, by as FloatingFieldProps, bL as IconButton, bM as IconButtonGlyphSize, bN as IconButtonLinkProps, bO as IconButtonProps, bP as IconButtonSize, bQ as IconButtonTone, bR as IconButtonToneColor, bS as IconButtonVariant, bT as Input, bU as InputProps, bZ as Label, b$ as LabelProps, c1 as PHONE_QUERY, c2 as PasswordRevealLabels, c8 as Select, c9 as SelectProps, cm as Spinner, cn as SpinnerProps, cp as TabItem, cq as Tabs, cr as TabsLabels, cs as TabsProps, ct as Textarea, cu as TextareaProps, cG as buttonClasses, cN as resolvePasswordRevealLabels } from '../feedback-DOwPu-Il.js';
 export { FLOATING_LABEL_STATIC, FieldLabel, FieldLabelProps } from './field-parts.js';
 import '../hooks/use-anchored-rect.js';
 import '../lib/clipping.js';
-import '../feedback-attachment-fGAzZPf0.js';
-import '../feedback/feedback-inbox.js';
-import 'lucide-react';
 import '../data-table-labels-B7OdnM0S.js';
 import './data-table-sort.js';
 import './swipeable-row.js';
@@ -14,6 +11,7 @@ import './mini-calendar.js';
 import './calendar-heatmap.js';
 import './popover.js';
 import './chip.js';
+import 'lucide-react';
 import './field-sync.js';
 import '../wizard/types.js';
 import '../tour/tour.js';

package/dist/components/ui.js

@@ -1126,6 +1126,41 @@ const Select = forwardRef(function Select2(props, ref) {
   ) });
 });
 Select.displayName = "Select";
+const TEXTAREA_LABEL_STRIP = cn(
+  "pointer-events-none absolute inset-x-px top-px hidden h-4 rounded-t-[5px] bg-[var(--bg-surface)]",
+  "peer-focus:block peer-[:not(:placeholder-shown)]:block",
+  "peer-disabled:bg-[var(--bg-surface-2)] peer-[[readonly]]:bg-[var(--bg-surface-2)]"
+);
+function TextareaLabelStrip() {
+  const ref = useRef(null);
+  useLayoutEffect(() => {
+    const strip = ref.current;
+    const field = strip?.previousElementSibling;
+    if (!strip || !(field instanceof HTMLTextAreaElement)) return;
+    const fit = () => {
+      if (field.offsetWidth === 0) return;
+      const style = getComputedStyle(field);
+      const borderLeft = parseFloat(style.borderLeftWidth) || 0;
+      const borderRight = parseFloat(style.borderRightWidth) || 0;
+      const gutter = field.offsetWidth - field.clientWidth - borderLeft - borderRight;
+      const bar = gutter > 1.5;
+      const onLeft = field.clientLeft - borderLeft > 1.5;
+      const rtl = style.direction === "rtl";
+      const atEnd = onLeft === rtl;
+      const border = (end) => end === rtl ? borderLeft : borderRight;
+      strip.style.insetInlineEnd = bar && atEnd ? `${border(true) + gutter}px` : "";
+      strip.style.insetInlineStart = bar && !atEnd ? `${border(false) + gutter}px` : "";
+      strip.style.borderStartEndRadius = bar && atEnd ? "0" : "";
+      strip.style.borderStartStartRadius = bar && !atEnd ? "0" : "";
+    };
+    fit();
+    if (typeof ResizeObserver === "undefined") return;
+    const observer = new ResizeObserver(fit);
+    observer.observe(field);
+    return () => observer.disconnect();
+  }, []);
+  return /* @__PURE__ */ jsx("span", { ref, "aria-hidden": true, "data-slot": "label-strip", className: TEXTAREA_LABEL_STRIP });
+}
 const Textarea = forwardRef(function Textarea2(props, ref) {
   const { className, label, id, placeholder, invalid, error, hint, showCount, countLabels, ...rest } = props;
   const reserve = "error" in props || "hint" in props || "showCount" in props;
@@ -1175,23 +1210,26 @@ const Textarea = forwardRef(function Textarea2(props, ref) {
     ) }) });
   }
   const ownPlaceholder = hasPlaceholderText(placeholder);
-  return /* @__PURE__ */ jsx(FieldGroup, { errorEl: below, reserve, children: /* @__PURE__ */ jsx(FloatingField, { className, htmlFor: fieldId, label, hint: hintParts.labelHint, children: /* @__PURE__ */ jsx(
-    "textarea",
-    {
-      ref,
-      id: fieldId,
-      placeholder: ownPlaceholder ? placeholder : " ",
-      ...rest,
-      "aria-invalid": isInvalid || rest["aria-invalid"] || void 0,
-      "aria-describedby": describedBy,
-      onChange,
-      className: cn(
-        FLOATING_INPUT_CLASS,
-        ownPlaceholder && FLOATING_PLACEHOLDER_ON_FOCUS,
-        isInvalid && FIELD_INVALID
-      )
-    }
-  ) }) });
+  return /* @__PURE__ */ jsx(FieldGroup, { errorEl: below, reserve, children: /* @__PURE__ */ jsxs(FloatingField, { className, htmlFor: fieldId, label, hint: hintParts.labelHint, children: [
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref,
+        id: fieldId,
+        placeholder: ownPlaceholder ? placeholder : " ",
+        ...rest,
+        "aria-invalid": isInvalid || rest["aria-invalid"] || void 0,
+        "aria-describedby": describedBy,
+        onChange,
+        className: cn(
+          FLOATING_INPUT_CLASS,
+          ownPlaceholder && FLOATING_PLACEHOLDER_ON_FOCUS,
+          isInvalid && FIELD_INVALID
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(TextareaLabelStrip, {})
+  ] }) });
 });
 Textarea.displayName = "Textarea";
 const CARD_TONES = {