@alfadocs/ui-kit-debug 1.37.0 → 1.38.0

package/dist/_chunks/editable-description-7ptNpJEg.js

@@ -0,0 +1,142 @@
+import { jsx as s, jsxs as t } from "react/jsx-runtime";
+import { forwardRef as z, useState as I, useRef as T, useMemo as V } from "react";
+import { c as i } from "./index-D2ZczOXr.js";
+import { useTranslation as L } from "react-i18next";
+import { B as M } from "./button-nJaPh_HC.js";
+import { I as _ } from "./icon-button-8xqRnkdG.js";
+import { C as $, S as R } from "./skeleton-B1KTdJ4N.js";
+import { P as A } from "./pencil-B1sKKyuT.js";
+const x = i(
+  "ds:flex ds:min-w-0 ds:items-start ds:gap-[var(--spacing-xs)]"
+), b = i(
+  [
+    "ds:m-0 ds:flex ds:min-w-0 ds:flex-1 ds:list-none ds:flex-col ds:p-0",
+    "ds:gap-[var(--spacing-2xs)]"
+  ].join(" ")
+), O = ["80%", "60%", "66%"], P = i(
+  "ds:m-0 ds:min-w-0 ds:flex-1 type-body-sm ds:text-[color:var(--muted-foreground)]"
+), v = i(
+  "ds:flex ds:items-start ds:gap-[var(--spacing-xs)] type-body-sm ds:text-[color:var(--foreground)]"
+), N = i(
+  [
+    "ds:mt-[var(--spacing-sm)] ds:size-[var(--spacing-xs)] ds:shrink-0 ds:self-start",
+    "ds:rounded-[var(--radius-full)] ds:bg-[color:var(--border)]"
+  ].join(" ")
+), G = z(
+  ({
+    value: c,
+    maxLines: r = 3,
+    loading: d = !1,
+    onEdit: m,
+    editButtonRef: y,
+    emptyLabel: w,
+    editLabel: D,
+    seeMoreLabel: E,
+    showLessLabel: k,
+    className: p,
+    ...f
+  }, u) => {
+    const { t: n } = L(), [o, C] = I(!1), h = T(!1);
+    d && (h.current = !0);
+    const j = h.current ? $ : "", a = V(
+      () => (c ?? "").split(/\r?\n/).map((e) => e.trim()).filter(Boolean),
+      [c]
+    ), B = Math.max(0, a.length - r), S = o ? a : a.slice(0, r), g = D ?? n("editableDescription.edit");
+    return d && a.length === 0 ? /* @__PURE__ */ s(
+      "div",
+      {
+        ...f,
+        ref: u,
+        "data-component": "editable-description",
+        "data-loading": "",
+        "aria-busy": "true",
+        className: [x(), p].filter(Boolean).join(" "),
+        children: /* @__PURE__ */ s("ul", { "aria-hidden": "true", className: b(), children: O.slice(0, Math.max(1, r)).map(
+          (e, l) => /* @__PURE__ */ t("li", { className: v(), children: [
+            /* @__PURE__ */ s("span", { className: N() }),
+            /* @__PURE__ */ s(
+              R,
+              {
+                variant: "text",
+                size: "sm",
+                stagger: l,
+                width: e,
+                className: "ds:mt-[var(--spacing-xs)]"
+              }
+            )
+          ] }, e)
+        ) })
+      }
+    ) : /* @__PURE__ */ t(
+      "div",
+      {
+        ...f,
+        ref: u,
+        "data-component": "editable-description",
+        "data-empty": a.length === 0 ? "" : void 0,
+        "aria-busy": d || void 0,
+        className: [x(), p].filter(Boolean).join(" "),
+        children: [
+          a.length === 0 ? /* @__PURE__ */ s("p", { "data-editable-description-empty": "", className: P(), children: w ?? n("editableDescription.empty") }) : /* @__PURE__ */ t("ul", { className: `${b()} ${j}`.trim(), children: [
+            S.map((e, l) => /* @__PURE__ */ t(
+              "li",
+              {
+                "data-editable-description-line": "",
+                className: v(),
+                children: [
+                  /* @__PURE__ */ s("span", { "aria-hidden": "true", className: N() }),
+                  /* @__PURE__ */ s("span", { className: "ds:min-w-0 ds:[overflow-wrap:anywhere]", children: e })
+                ]
+              },
+              `${l}-${e}`
+            )),
+            B > 0 ? (
+              // An ITEM of the list, aligned with the text rather than the
+              // dots, so opening it does not shift the column.
+              /* @__PURE__ */ t("li", { className: "ds:flex ds:items-start ds:gap-[var(--spacing-xs)]", children: [
+                /* @__PURE__ */ s(
+                  "span",
+                  {
+                    "aria-hidden": "true",
+                    className: "ds:size-[var(--spacing-xs)] ds:shrink-0"
+                  }
+                ),
+                /* @__PURE__ */ s(
+                  M,
+                  {
+                    intent: "link",
+                    size: "sm",
+                    "data-editable-description-toggle": "",
+                    className: "ds:!ps-0 ds:!pe-0",
+                    "aria-expanded": o,
+                    onClick: () => C((e) => !e),
+                    children: o ? k ?? n("editableDescription.showLess") : E ?? n("editableDescription.seeMore")
+                  }
+                )
+              ] })
+            ) : null
+          ] }),
+          m ? /* @__PURE__ */ s(
+            _,
+            {
+              ref: y,
+              icon: /* @__PURE__ */ s(A, { "aria-hidden": "true" }),
+              intent: "ghost",
+              size: "sm",
+              className: "ds:-mt-[var(--spacing-sm)] ds:shrink-0",
+              "aria-label": g,
+              tooltip: g,
+              "data-editable-description-edit": "",
+              onClick: m
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+G.displayName = "EditableDescription";
+export {
+  G as E
+};
+//# sourceMappingURL=editable-description-7ptNpJEg.js.map

package/dist/_chunks/editable-description-7ptNpJEg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editable-description-7ptNpJEg.js","sources":["../../src/components/editable-description/editable-description.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type Ref,\n} from 'react';\nimport { cva } from 'class-variance-authority';\nimport { Pencil } from 'lucide-react';\nimport { useTranslation } from 'react-i18next';\nimport { Button } from '../button/button';\nimport { IconButton } from '../button/icon-button';\nimport { CONTENT_ENTER_CLASS, Skeleton } from '../skeleton/skeleton';\n\n/* -------------------------------------------------------------------- */\n/* EditableDescription                                                   */\n/*                                                                        */\n/* A record's free-text description, set as bulleted lines, with a pencil */\n/* beside it when the reader may edit. An appointment's description, a    */\n/* task's description, a treatment's remark. PLAIN text only: patient     */\n/* notes are rich text and belong to NotesPanel and NoteTimeline.         */\n/*                                                                        */\n/* In practice this text is written as a list (\"sensitive lower left\",    */\n/* \"review the bitewings\", \"allow extra time\"), so it is set as one, a    */\n/* dot per line, rather than as a paragraph pretending to be prose.       */\n/*                                                                        */\n/* Long descriptions cut at the LINE, not at a rendered row: `maxLines`   */\n/* bullets, then a \"See more\" that is itself an item of the list, so the  */\n/* column does not shift when it opens.                                   */\n/*                                                                        */\n/* It DISPLAYS and asks to edit; it does not own the editor. `onEdit`     */\n/* hands over to the host, which opens its form, in a rail panel a        */\n/* `PanelSubview` with a `TextArea`. Omit `onEdit` for a read-only view.  */\n/* -------------------------------------------------------------------- */\n\nconst rootVariants = cva(\n  'ds:flex ds:min-w-0 ds:items-start ds:gap-[var(--spacing-xs)]',\n);\n\nconst listVariants = cva(\n  [\n    'ds:m-0 ds:flex ds:min-w-0 ds:flex-1 ds:list-none ds:flex-col ds:p-0',\n    'ds:gap-[var(--spacing-2xs)]',\n  ].join(' '),\n);\n\n/* Ragged on purpose: three lines of one length read as a block, not text. */\nconst LOADING_LINE_WIDTHS = ['80%', '60%', '66%'] as const;\n\nconst emptyVariants = cva(\n  'ds:m-0 ds:min-w-0 ds:flex-1 type-body-sm ds:text-[color:var(--muted-foreground)]',\n);\n\nconst lineVariants = cva(\n  'ds:flex ds:items-start ds:gap-[var(--spacing-xs)] type-body-sm ds:text-[color:var(--foreground)]',\n);\n\n/* `--spacing-sm` is (line-height − dot) / 2 for this type scale, so the dot\n   centres on the FIRST line; `self-start` keeps it there when a line wraps. */\nconst dotVariants = cva(\n  [\n    'ds:mt-[var(--spacing-sm)] ds:size-[var(--spacing-xs)] ds:shrink-0 ds:self-start',\n    'ds:rounded-[var(--radius-full)] ds:bg-[color:var(--border)]',\n  ].join(' '),\n);\n\nexport interface EditableDescriptionProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'onChange'\n> {\n  /** The description. One bullet per non-empty line. */\n  value?: string | null;\n  /** Lines shown before the rest go behind \"See more\". Default `3`. */\n  maxLines?: number;\n  /**\n   * The description is being read. With nothing to show yet, it renders\n   * bulleted placeholder lines and no pencil. With a `value` already on screen\n   * (a refresh) it keeps the text and only sets `aria-busy`.\n   */\n  loading?: boolean;\n  /** Fires from the pencil. Omit for a read-only description. */\n  onEdit?: () => void;\n  /** Receives the pencil button, so a host can return focus to it. */\n  editButtonRef?: Ref<HTMLButtonElement>;\n  /** Shown when there are no lines. Defaults to the kit's translated text. */\n  emptyLabel?: string;\n  /** Accessible name and tooltip of the pencil. Defaults to the kit's text. */\n  editLabel?: string;\n  /** Disclosure labels. Default to the kit's translated text. */\n  seeMoreLabel?: string;\n  showLessLabel?: string;\n}\n\nexport const EditableDescription = forwardRef<\n  HTMLDivElement,\n  EditableDescriptionProps\n>(\n  (\n    {\n      value,\n      maxLines = 3,\n      loading = false,\n      onEdit,\n      editButtonRef,\n      emptyLabel,\n      editLabel,\n      seeMoreLabel,\n      showLessLabel,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n    const [expanded, setExpanded] = useState(false);\n    /* Settle in only when this content REPLACES a skeleton. Content that was\n       simply there from the start must not fade: it would read as invisible\n       for one animation to any test or reader that looks at once. */\n    const followedLoading = useRef(false);\n    if (loading) followedLoading.current = true;\n    const enterClass = followedLoading.current ? CONTENT_ENTER_CLASS : '';\n\n    const lines = useMemo(\n      () =>\n        (value ?? '')\n          .split(/\\r?\\n/)\n          .map((line) => line.trim())\n          .filter(Boolean),\n      [value],\n    );\n\n    const hiddenCount = Math.max(0, lines.length - maxLines);\n    const shown = expanded ? lines : lines.slice(0, maxLines);\n    const resolvedEditLabel = editLabel ?? t('editableDescription.edit');\n\n    // A first read shows the placeholder. A REFRESH keeps the lines it has and\n    // only marks the block busy: real text never gives way to a skeleton.\n    if (loading && lines.length === 0) {\n      return (\n        <div\n          {...rest}\n          ref={ref}\n          data-component=\"editable-description\"\n          data-loading=\"\"\n          aria-busy=\"true\"\n          className={[rootVariants(), className].filter(Boolean).join(' ')}\n        >\n          <ul aria-hidden=\"true\" className={listVariants()}>\n            {LOADING_LINE_WIDTHS.slice(0, Math.max(1, maxLines)).map(\n              (width, index) => (\n                <li key={width} className={lineVariants()}>\n                  <span className={dotVariants()} />\n                  <Skeleton\n                    variant=\"text\"\n                    size=\"sm\"\n                    stagger={index}\n                    width={width}\n                    className=\"ds:mt-[var(--spacing-xs)]\"\n                  />\n                </li>\n              ),\n            )}\n          </ul>\n        </div>\n      );\n    }\n\n    return (\n      <div\n        {...rest}\n        ref={ref}\n        data-component=\"editable-description\"\n        data-empty={lines.length === 0 ? '' : undefined}\n        aria-busy={loading || undefined}\n        className={[rootVariants(), className].filter(Boolean).join(' ')}\n      >\n        {lines.length === 0 ? (\n          <p data-editable-description-empty=\"\" className={emptyVariants()}>\n            {emptyLabel ?? t('editableDescription.empty')}\n          </p>\n        ) : (\n          <ul className={`${listVariants()} ${enterClass}`.trim()}>\n            {shown.map((line, index) => (\n              <li\n                key={`${index}-${line}`}\n                data-editable-description-line=\"\"\n                className={lineVariants()}\n              >\n                <span aria-hidden=\"true\" className={dotVariants()} />\n                <span className=\"ds:min-w-0 ds:[overflow-wrap:anywhere]\">\n                  {line}\n                </span>\n              </li>\n            ))}\n            {hiddenCount > 0 ? (\n              // An ITEM of the list, aligned with the text rather than the\n              // dots, so opening it does not shift the column.\n              <li className=\"ds:flex ds:items-start ds:gap-[var(--spacing-xs)]\">\n                <span\n                  aria-hidden=\"true\"\n                  className=\"ds:size-[var(--spacing-xs)] ds:shrink-0\"\n                />\n                <Button\n                  intent=\"link\"\n                  size=\"sm\"\n                  data-editable-description-toggle=\"\"\n                  className=\"ds:!ps-0 ds:!pe-0\"\n                  aria-expanded={expanded}\n                  onClick={() => setExpanded((previous) => !previous)}\n                >\n                  {expanded\n                    ? (showLessLabel ?? t('editableDescription.showLess'))\n                    : (seeMoreLabel ?? t('editableDescription.seeMore'))}\n                </Button>\n              </li>\n            ) : null}\n          </ul>\n        )}\n        {onEdit ? (\n          <IconButton\n            ref={editButtonRef}\n            icon={<Pencil aria-hidden=\"true\" />}\n            intent=\"ghost\"\n            size=\"sm\"\n            // Pulled up so the 2rem button centres on the first text line.\n            className=\"ds:-mt-[var(--spacing-sm)] ds:shrink-0\"\n            aria-label={resolvedEditLabel}\n            tooltip={resolvedEditLabel}\n            data-editable-description-edit=\"\"\n            onClick={onEdit}\n          />\n        ) : null}\n      </div>\n    );\n  },\n);\nEditableDescription.displayName = 'EditableDescription';\n"],"names":["rootVariants","cva","listVariants","LOADING_LINE_WIDTHS","emptyVariants","lineVariants","dotVariants","EditableDescription","forwardRef","value","maxLines","loading","onEdit","editButtonRef","emptyLabel","editLabel","seeMoreLabel","showLessLabel","className","rest","ref","t","useTranslation","expanded","setExpanded","useState","followedLoading","useRef","enterClass","CONTENT_ENTER_CLASS","lines","useMemo","line","hiddenCount","shown","resolvedEditLabel","jsx","width","index","Skeleton","jsxs","Button","previous","IconButton","Pencil"],"mappings":"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"}

package/dist/_chunks/{file-manager-DvkFgj7d.js → file-manager-UlcYQv8n.js}

@@ -4,7 +4,7 @@ import { c as Ve } from "./index-D2ZczOXr.js";
 import { useTranslation as J } from "react-i18next";
 import { B as kt, b as He, c as ge } from "./breadcrumb-agut0PwN.js";
 import { E as Mt } from "./empty-state-X0sVPfVo.js";
-import { S as he } from "./skeleton-CZbwyJAA.js";
+import { S as he } from "./skeleton-B1KTdJ4N.js";
 import { u as Ct } from "./use-controllable-state-BiY4xTzM.js";
 import { u as wt } from "./registry-DvAUVLHh.js";
 import { B as X } from "./button-nJaPh_HC.js";
@@ -16,7 +16,7 @@ import { F as Nt, a as Tt } from "./file-Cwe9VC1A.js";
 import { F as Ft } from "./file-text-5yv6r2ls.js";
 import { F as At } from "./file-spreadsheet-DmwyfV4O.js";
 import { C as Dt } from "./chevron-right-I9AeSxH2.js";
-import { D as Te } from "./data-table-BYGK-gUJ.js";
+import { D as Te } from "./data-table-Dy1lyumT.js";
 import { A as Rt, a as It } from "./actions-cell-renderer-CUn1pqEq.js";
 import { B as $e } from "./badge-BudgzTe_.js";
 import { D as Ge } from "./download-CfYKJO_j.js";
@@ -1757,4 +1757,4 @@ export {
   yn as F,
   Gt as f
 };
-//# sourceMappingURL=file-manager-DvkFgj7d.js.map
+//# sourceMappingURL=file-manager-UlcYQv8n.js.map