@protonradio/proton-ui 0.11.10 → 0.11.12

package/dist/components/Table/Table.es.js

@@ -0,0 +1,89 @@
+import { j as a } from "../../node_modules/react/jsx-runtime.es.js";
+import { useMemo as p } from "react";
+import { parseTableChildren as m } from "./Collection/collectionParser.es.js";
+import { TableHeader as b, TableColumn as T, TableBody as u, TableRow as x, TableCell as h } from "./Collection/CompoundComponents.es.js";
+import { useTableCollection as y } from "./Collection/useTableCollection.es.js";
+/* empty css             */
+const _ = ({ children: s, name: i }) => {
+  const c = p(
+    () => m(s),
+    [s]
+  ), o = y(c);
+  return /* @__PURE__ */ a.jsxs(
+    "table",
+    {
+      className: "proton-Table",
+      role: "table",
+      "aria-rowcount": o.getTotalRowCount,
+      "aria-colcount": o.columns.length,
+      "aria-label": i,
+      children: [
+        /* @__PURE__ */ a.jsx("caption", { className: "proton-Table__caption", children: i }),
+        /* @__PURE__ */ a.jsx(
+          "thead",
+          {
+            className: "proton-Table__rowGroup--header",
+            role: "rowgroup",
+            style: o.isHeaderHidden ? { display: "none" } : void 0,
+            children: /* @__PURE__ */ a.jsx("tr", { className: "proton-Table__header-row", role: "row", "aria-rowindex": 1, children: o.columns.map((e, t) => /* @__PURE__ */ a.jsx(
+              "th",
+              {
+                className: "proton-Table__header",
+                role: "columnheader",
+                scope: "col",
+                "aria-colindex": t + 1,
+                "aria-sort": e.ariaSort,
+                children: e.header
+              },
+              e.key
+            )) })
+          }
+        ),
+        /* @__PURE__ */ a.jsx("tbody", { className: "proton-Table__body", role: "rowgroup", children: o.rows.map((e, t) => /* @__PURE__ */ a.jsx(
+          "tr",
+          {
+            className: "proton-Table__row",
+            role: "row",
+            "aria-rowindex": o.getRowAriaIndex(t),
+            onClick: e == null ? void 0 : e.onClick,
+            tabIndex: e != null && e.onClick ? 0 : void 0,
+            onKeyDown: e != null && e.onClick ? (l) => {
+              var r;
+              (l.key === "Enter" || l.key === " ") && (l.preventDefault(), (r = e.onClick) == null || r.call(e));
+            } : void 0,
+            children: o.columns.map((l, r) => {
+              const n = e.cells.find((d) => d.columnKey === l.key);
+              return /* @__PURE__ */ a.jsx(
+                "td",
+                {
+                  className: "proton-Table__cell",
+                  role: "cell",
+                  "aria-colindex": r + 1,
+                  colSpan: n == null ? void 0 : n.colSpan,
+                  children: (n == null ? void 0 : n.value) || ""
+                },
+                l.key
+              );
+            })
+          },
+          e.key
+        )) })
+      ]
+    }
+  );
+}, v = Object.assign(_, {
+  /** Table header: {@link TableHeaderProps} */
+  Header: b,
+  /** Table column: {@link TableColumnProps} */
+  Column: T,
+  /** Table body: {@link TableBodyProps} */
+  Body: u,
+  /** Table row: {@link TableRowProps} */
+  Row: x,
+  /** Table cell: {@link TableCellProps} */
+  Cell: h
+});
+export {
+  v as Table
+};
+//# sourceMappingURL=Table.es.js.map

package/dist/components/Table/Table.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.es.js","sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["import { ReactElement, useMemo } from \"react\";\nimport { parseTableChildren } from \"./Collection/collectionParser\";\nimport {\n  TableHeader,\n  TableColumn,\n  TableBody,\n  TableRow,\n  TableCell,\n  TableHeaderProps,\n  TableColumnProps,\n  TableBodyProps,\n  TableRowProps,\n  TableCellProps,\n} from \"./Collection/CompoundComponents\";\nimport { useTableCollection } from \"./Collection/useTableCollection\";\nimport type {\n  TableData,\n  TableColumnData,\n  TableRowData,\n  TableCellData,\n} from \"./types\";\nimport \"./Table.css\";\n\nexport type { TableColumnData, TableCellData, TableRowData, TableData };\n\nexport interface TableProps {\n  children: [ReactElement<TableHeaderProps>, ReactElement<TableBodyProps>];\n  /** Table name/caption for accessibility. Provides essential context for screen readers about table content. */\n  name: string;\n}\n\nconst TableComponent = ({ children, name }: TableProps) => {\n  const tableData: TableData = useMemo(\n    () => parseTableChildren(children),\n    [children]\n  );\n  const collection = useTableCollection(tableData);\n\n  return (\n    <table\n      className=\"proton-Table\"\n      role=\"table\"\n      aria-rowcount={collection.getTotalRowCount}\n      aria-colcount={collection.columns.length}\n      aria-label={name}\n    >\n      <caption className=\"proton-Table__caption\">{name}</caption>\n\n      {/* Header */}\n      <thead\n        className=\"proton-Table__rowGroup--header\"\n        role=\"rowgroup\"\n        style={collection.isHeaderHidden ? { display: \"none\" } : undefined}\n      >\n        <tr className=\"proton-Table__header-row\" role=\"row\" aria-rowindex={1}>\n          {collection.columns.map((column, index) => (\n            <th\n              key={column.key}\n              className=\"proton-Table__header\"\n              role=\"columnheader\"\n              scope=\"col\"\n              aria-colindex={index + 1}\n              aria-sort={column.ariaSort}\n            >\n              {column.header}\n            </th>\n          ))}\n        </tr>\n      </thead>\n\n      {/* Body */}\n      <tbody className=\"proton-Table__body\" role=\"rowgroup\">\n        {collection.rows.map((row, rowIndex) => (\n          <tr\n            key={row.key}\n            className=\"proton-Table__row\"\n            role=\"row\"\n            aria-rowindex={collection.getRowAriaIndex(rowIndex)}\n            onClick={row?.onClick}\n            tabIndex={row?.onClick ? 0 : undefined}\n            onKeyDown={\n              row?.onClick\n                ? (e) => {\n                    if (e.key === \"Enter\" || e.key === \" \") {\n                      // Enable keyboard navigation\n                      e.preventDefault();\n                      row.onClick?.();\n                    }\n                  }\n                : undefined\n            }\n          >\n            {collection.columns.map((column, colIndex) => {\n              const cell = row.cells.find((c) => c.columnKey === column.key);\n              return (\n                <td\n                  key={column.key}\n                  className=\"proton-Table__cell\"\n                  role=\"cell\"\n                  aria-colindex={colIndex + 1}\n                  colSpan={cell?.colSpan}\n                >\n                  {cell?.value || \"\"}\n                </td>\n              );\n            })}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n};\n\n/**\n * Base Table component that renders data in rows and columns using collections.\n *\n * - Built-in keyboard navigation for interactive rows.\n * - Full ARIA table semantics with proper roles, labels, and indices.\n *\n * API:\n *  - {@link TableProps}\n *\n * @example\n * ```tsx\n * <Table caption=\"Employee Directory\">\n *   <Table.Header>\n *     <Table.Column id=\"name\">Name</Table.Column>\n *   </Table.Header>\n *   <Table.Body>\n *     <Table.Row key=\"1\">\n *       <Table.Cell>Joe</Table.Cell>\n *     </Table.Row>\n *   </Table.Body>\n * </Table>\n * ```\n */\nconst Table = Object.assign(TableComponent, {\n  /** Table header: {@link TableHeaderProps} */\n  Header: TableHeader,\n  /** Table column: {@link TableColumnProps} */\n  Column: TableColumn,\n  /** Table body: {@link TableBodyProps} */\n  Body: TableBody,\n  /** Table row: {@link TableRowProps} */\n  Row: TableRow,\n  /** Table cell: {@link TableCellProps} */\n  Cell: TableCell,\n});\n\nexport { Table };\nexport type {\n  TableHeaderProps,\n  TableColumnProps,\n  TableBodyProps,\n  TableRowProps,\n  TableCellProps,\n};\n"],"names":["TableComponent","children","name","tableData","useMemo","parseTableChildren","collection","useTableCollection","jsxs","jsx","column","index","row","rowIndex","e","_a","colIndex","cell","c","Table","TableHeader","TableColumn","TableBody","TableRow","TableCell"],"mappings":";;;;;;AA+BA,MAAMA,IAAiB,CAAC,EAAE,UAAAC,GAAU,MAAAC,QAAuB;AACzD,QAAMC,IAAuBC;AAAA,IAC3B,MAAMC,EAAmBJ,CAAQ;AAAA,IACjC,CAACA,CAAQ;AAAA,EAAA,GAELK,IAAaC,EAAmBJ,CAAS;AAG7C,SAAAK,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,iBAAeF,EAAW;AAAA,MAC1B,iBAAeA,EAAW,QAAQ;AAAA,MAClC,cAAYJ;AAAA,MAEZ,UAAA;AAAA,QAACO,gBAAAA,EAAA,IAAA,WAAA,EAAQ,WAAU,yBAAyB,UAAKP,GAAA;AAAA,QAGjDO,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,OAAOH,EAAW,iBAAiB,EAAE,SAAS,OAAW,IAAA;AAAA,YAEzD,UAACG,gBAAAA,EAAA,IAAA,MAAA,EAAG,WAAU,4BAA2B,MAAK,OAAM,iBAAe,GAChE,UAAWH,EAAA,QAAQ,IAAI,CAACI,GAAQC,MAC/BF,gBAAAA,EAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBAEC,WAAU;AAAA,gBACV,MAAK;AAAA,gBACL,OAAM;AAAA,gBACN,iBAAeE,IAAQ;AAAA,gBACvB,aAAWD,EAAO;AAAA,gBAEjB,UAAOA,EAAA;AAAA,cAAA;AAAA,cAPHA,EAAO;AAAA,YASf,CAAA,GACH;AAAA,UAAA;AAAA,QACF;AAAA,QAGAD,gBAAAA,EAAAA,IAAC,SAAM,EAAA,WAAU,sBAAqB,MAAK,YACxC,UAAAH,EAAW,KAAK,IAAI,CAACM,GAAKC,MACzBJ,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,iBAAeH,EAAW,gBAAgBO,CAAQ;AAAA,YAClD,SAASD,KAAA,gBAAAA,EAAK;AAAA,YACd,UAAUA,KAAA,QAAAA,EAAK,UAAU,IAAI;AAAA,YAC7B,WACEA,KAAA,QAAAA,EAAK,UACD,CAACE,MAAM;;AACL,eAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SAEjCA,EAAE,eAAe,IACjBC,IAAAH,EAAI,YAAJ,QAAAG,EAAA,KAAAH;AAAA,YAGJ,IAAA;AAAA,YAGL,UAAWN,EAAA,QAAQ,IAAI,CAACI,GAAQM,MAAa;AACtC,oBAAAC,IAAOL,EAAI,MAAM,KAAK,CAACM,MAAMA,EAAE,cAAcR,EAAO,GAAG;AAE3D,qBAAAD,gBAAAA,EAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,WAAU;AAAA,kBACV,MAAK;AAAA,kBACL,iBAAeO,IAAW;AAAA,kBAC1B,SAASC,KAAA,gBAAAA,EAAM;AAAA,kBAEd,kCAAM,UAAS;AAAA,gBAAA;AAAA,gBANXP,EAAO;AAAA,cAAA;AAAA,YAOd,CAEH;AAAA,UAAA;AAAA,UA/BIE,EAAI;AAAA,QAiCZ,CAAA,GACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAyBMO,IAAQ,OAAO,OAAOnB,GAAgB;AAAA;AAAA,EAE1C,QAAQoB;AAAA;AAAA,EAER,QAAQC;AAAA;AAAA,EAER,MAAMC;AAAA;AAAA,EAEN,KAAKC;AAAA;AAAA,EAEL,MAAMC;AACR,CAAC;"}

package/dist/components/Text/TextEllipsis/TextEllipsis.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../node_modules/react/jsx-runtime.cjs.js");;/* empty css                      */const o=require("../../../utils/string.cjs.js"),p=({children:e,maxWidth:i,singleLine:s=!0,lines:t=1,title:l,"data-testid":r})=>n.jsxRuntimeExports.jsx("div",{className:o.csx("proton-TextEllipsis",s||t===1?"proton-TextEllipsis--single-line":t>1?"proton-TextEllipsis--multi-line":""),style:{maxWidth:i,WebkitLineClamp:t},title:l,"data-testid":r,children:e});exports.TextEllipsis=p;
+//# sourceMappingURL=TextEllipsis.cjs.js.map

package/dist/components/Text/TextEllipsis/TextEllipsis.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEllipsis.cjs.js","sources":["../../../../src/components/Text/TextEllipsis/TextEllipsis.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport { csx } from \"../../../utils\";\nimport \"./TextEllipsis.css\";\n\ninterface TextEllipsisProps {\n  /**\n   * The content to display within the text ellipsis.\n   */\n  children: ReactNode;\n\n  /**\n   * The maximum width of the text container in any valid CSS unit (px, rem, em, %, etc.).\n   * When the container width is less than this value, text will be truncated with an ellipsis.\n   */\n  maxWidth?: string | number;\n\n  /**\n   * Whether to truncate the text to a single line. Default is true.\n   * If false, the text will wrap to multiple lines.\n   */\n  singleLine?: boolean;\n\n  /**\n   * The number of lines to show before truncating with an ellipsis.\n   * Only applies when singleLine is false.\n   */\n  lines?: number;\n\n  /**\n   * The title attribute to show on hover. If not provided and singleLine is true,\n   * the children will be used as the title (if children is a string).\n   */\n  title?: string;\n\n  /**\n   * A test ID.\n   */\n  \"data-testid\"?: string;\n}\n\n/**\n * A component that displays text with an ellipsis when it overflows its container.\n *\n * API:\n *  - {@link TextEllipsisProps}\n */\nexport const TextEllipsis = ({\n  children,\n  maxWidth,\n  singleLine = true,\n  lines = 1,\n  title,\n  \"data-testid\": testId,\n}: TextEllipsisProps) => {\n  return (\n    <div\n      className={csx(\n        \"proton-TextEllipsis\",\n        singleLine || lines === 1\n          ? \"proton-TextEllipsis--single-line\"\n          : lines > 1\n            ? \"proton-TextEllipsis--multi-line\"\n            : \"\"\n      )}\n      style={{\n        maxWidth: maxWidth,\n        WebkitLineClamp: lines,\n      }}\n      title={title}\n      data-testid={testId}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["TextEllipsis","children","maxWidth","singleLine","lines","title","testId","jsx","csx"],"mappings":"uOAgDaA,EAAe,CAAC,CAC3B,SAAAC,EACA,SAAAC,EACA,WAAAC,EAAa,GACb,MAAAC,EAAQ,EACR,MAAAC,EACA,cAAeC,CACjB,IAEIC,EAAA,kBAAA,IAAC,MAAA,CACC,UAAWC,EAAA,IACT,sBACAL,GAAcC,IAAU,EACpB,mCACAA,EAAQ,EACN,kCACA,EACR,EACA,MAAO,CACL,SAAAF,EACA,gBAAiBE,CACnB,EACA,MAAAC,EACA,cAAaC,EAEZ,SAAAL,CAAA,CAAA"}

package/dist/components/Text/TextEllipsis/TextEllipsis.es.js

@@ -0,0 +1,30 @@
+import { j as p } from "../../../node_modules/react/jsx-runtime.es.js";
+/* empty css                    */
+import { csx as r } from "../../../utils/string.es.js";
+const n = ({
+  children: i,
+  maxWidth: s,
+  singleLine: e = !0,
+  lines: t = 1,
+  title: o,
+  "data-testid": l
+}) => /* @__PURE__ */ p.jsx(
+  "div",
+  {
+    className: r(
+      "proton-TextEllipsis",
+      e || t === 1 ? "proton-TextEllipsis--single-line" : t > 1 ? "proton-TextEllipsis--multi-line" : ""
+    ),
+    style: {
+      maxWidth: s,
+      WebkitLineClamp: t
+    },
+    title: o,
+    "data-testid": l,
+    children: i
+  }
+);
+export {
+  n as TextEllipsis
+};
+//# sourceMappingURL=TextEllipsis.es.js.map

package/dist/components/Text/TextEllipsis/TextEllipsis.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEllipsis.es.js","sources":["../../../../src/components/Text/TextEllipsis/TextEllipsis.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport { csx } from \"../../../utils\";\nimport \"./TextEllipsis.css\";\n\ninterface TextEllipsisProps {\n  /**\n   * The content to display within the text ellipsis.\n   */\n  children: ReactNode;\n\n  /**\n   * The maximum width of the text container in any valid CSS unit (px, rem, em, %, etc.).\n   * When the container width is less than this value, text will be truncated with an ellipsis.\n   */\n  maxWidth?: string | number;\n\n  /**\n   * Whether to truncate the text to a single line. Default is true.\n   * If false, the text will wrap to multiple lines.\n   */\n  singleLine?: boolean;\n\n  /**\n   * The number of lines to show before truncating with an ellipsis.\n   * Only applies when singleLine is false.\n   */\n  lines?: number;\n\n  /**\n   * The title attribute to show on hover. If not provided and singleLine is true,\n   * the children will be used as the title (if children is a string).\n   */\n  title?: string;\n\n  /**\n   * A test ID.\n   */\n  \"data-testid\"?: string;\n}\n\n/**\n * A component that displays text with an ellipsis when it overflows its container.\n *\n * API:\n *  - {@link TextEllipsisProps}\n */\nexport const TextEllipsis = ({\n  children,\n  maxWidth,\n  singleLine = true,\n  lines = 1,\n  title,\n  \"data-testid\": testId,\n}: TextEllipsisProps) => {\n  return (\n    <div\n      className={csx(\n        \"proton-TextEllipsis\",\n        singleLine || lines === 1\n          ? \"proton-TextEllipsis--single-line\"\n          : lines > 1\n            ? \"proton-TextEllipsis--multi-line\"\n            : \"\"\n      )}\n      style={{\n        maxWidth: maxWidth,\n        WebkitLineClamp: lines,\n      }}\n      title={title}\n      data-testid={testId}\n    >\n      {children}\n    </div>\n  );\n};\n"],"names":["TextEllipsis","children","maxWidth","singleLine","lines","title","testId","jsx","csx"],"mappings":";;;AAgDO,MAAMA,IAAe,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,OAAAC,IAAQ;AAAA,EACR,OAAAC;AAAA,EACA,eAAeC;AACjB,MAEIC,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAL,KAAcC,MAAU,IACpB,qCACAA,IAAQ,IACN,oCACA;AAAA,IACR;AAAA,IACA,OAAO;AAAA,MACL,UAAAF;AAAA,MACA,iBAAiBE;AAAA,IACnB;AAAA,IACA,OAAAC;AAAA,IACA,eAAaC;AAAA,IAEZ,UAAAL;AAAA,EAAA;AAAA;"}

package/dist/components/Text/TextEmphasis/TextEmphasis.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../node_modules/react/jsx-runtime.cjs.js");;/* empty css                      */const m=require("../../ThemeProvider.cjs.js"),u=require("../../Tooltip/Tooltip.cjs.js"),x=require("../../../utils/navigation.cjs.js"),c=require("../../../utils/string.cjs.js"),p=({to:e,children:n,tooltipProps:s,"data-testid":i})=>{const{className:a}=m.useTheme(),o=s?t.jsxRuntimeExports.jsx(u.TooltipTrigger,{delay:50,closeDelay:75,...s,children:n}):n;if(e){const r=x.isUrlExternal(e);return t.jsxRuntimeExports.jsx("span",{className:c.csx("proton-TextEmphasis",s&&"proton-TextEmphasis--tooltip",a),children:t.jsxRuntimeExports.jsx("a",{"data-testid":i,href:e,target:r?"_blank":void 0,rel:r?"noopener noreferrer":void 0,onClick:r?void 0:l=>x.handleInternalNavigation(l,e),children:o})})}return t.jsxRuntimeExports.jsx("span",{className:c.csx("proton-TextEmphasis",s&&"proton-TextEmphasis--tooltip",a),"data-testid":i,children:o})};exports.TextEmphasis=p;
+//# sourceMappingURL=TextEmphasis.cjs.js.map

package/dist/components/Text/TextEmphasis/TextEmphasis.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEmphasis.cjs.js","sources":["../../../../src/components/Text/TextEmphasis/TextEmphasis.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport \"./TextEmphasis.css\";\n\nimport { csx } from \"../../../utils\";\nimport { useTheme } from \"../../ThemeProvider\";\nimport { TooltipTrigger, TooltipTriggerProps } from \"../../Tooltip/Tooltip\";\nimport {\n  handleInternalNavigation,\n  isUrlExternal,\n} from \"../../../utils/navigation\";\n\ninterface TextEmphasisProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The URL that the text emphasis should link to. Turns the element into an `a` tag.\n   */\n  to?: string;\n  /**\n   * The content to display within the text emphasis.\n   */\n  children: ReactNode;\n  /**\n   * Props to pass to the tooltip trigger. When provided, the text emphasis will be wrapped in a tooltip trigger.\n   */\n  tooltipProps?: Omit<TooltipTriggerProps, \"children\">;\n  /**\n   * A test ID.\n   */\n  \"data-testid\"?: string;\n}\n\n/**\n * A component that displays text with emphasis. Provide tooltipProps to wrap the text in a tooltip trigger.\n *\n * API:\n *  - {@link TextEmphasisProps}\n *  - extends {@link React.HTMLAttributes}\n */\nexport const TextEmphasis = ({\n  to,\n  children,\n  tooltipProps,\n  \"data-testid\": testId,\n}: TextEmphasisProps) => {\n  const { className: themeClassName } = useTheme();\n\n  const content = tooltipProps ? (\n    <TooltipTrigger delay={50} closeDelay={75} {...tooltipProps}>\n      {children}\n    </TooltipTrigger>\n  ) : (\n    children\n  );\n\n  if (to) {\n    const isExternal = isUrlExternal(to);\n    return (\n      <span\n        className={csx(\n          \"proton-TextEmphasis\",\n          tooltipProps && \"proton-TextEmphasis--tooltip\",\n          themeClassName\n        )}\n      >\n        <a\n          data-testid={testId}\n          href={to}\n          target={isExternal ? \"_blank\" : undefined}\n          rel={isExternal ? \"noopener noreferrer\" : undefined}\n          onClick={\n            !isExternal ? (e) => handleInternalNavigation(e, to) : undefined\n          }\n        >\n          {content}\n        </a>\n      </span>\n    );\n  }\n\n  return (\n    <span\n      className={csx(\n        \"proton-TextEmphasis\",\n        tooltipProps && \"proton-TextEmphasis--tooltip\",\n        themeClassName\n      )}\n      data-testid={testId}\n    >\n      {content}\n    </span>\n  );\n};\n"],"names":["TextEmphasis","to","children","tooltipProps","testId","themeClassName","useTheme","content","jsx","TooltipTrigger","isExternal","isUrlExternal","csx","e","handleInternalNavigation"],"mappings":"uWAuCaA,EAAe,CAAC,CAC3B,GAAAC,EACA,SAAAC,EACA,aAAAC,EACA,cAAeC,CACjB,IAAyB,CACvB,KAAM,CAAE,UAAWC,CAAe,EAAIC,EAAS,SAAA,EAEzCC,EAAUJ,EACdK,EAAA,kBAAA,IAACC,EAAe,eAAA,CAAA,MAAO,GAAI,WAAY,GAAK,GAAGN,EAC5C,SAAAD,CACH,CAAA,EAEAA,EAGF,GAAID,EAAI,CACA,MAAAS,EAAaC,gBAAcV,CAAE,EAEjC,OAAAO,EAAA,kBAAA,IAAC,OAAA,CACC,UAAWI,EAAA,IACT,sBACAT,GAAgB,+BAChBE,CACF,EAEA,SAAAG,EAAA,kBAAA,IAAC,IAAA,CACC,cAAaJ,EACb,KAAMH,EACN,OAAQS,EAAa,SAAW,OAChC,IAAKA,EAAa,sBAAwB,OAC1C,QACGA,EAAsD,OAAxCG,GAAMC,EAAyB,yBAAAD,EAAGZ,CAAE,EAGpD,SAAAM,CAAA,CACH,CAAA,CAAA,CAGN,CAGE,OAAAC,EAAA,kBAAA,IAAC,OAAA,CACC,UAAWI,EAAA,IACT,sBACAT,GAAgB,+BAChBE,CACF,EACA,cAAaD,EAEZ,SAAAG,CAAA,CAAA,CAGP"}

package/dist/components/Text/TextEmphasis/TextEmphasis.es.js

@@ -0,0 +1,54 @@
+import { j as s } from "../../../node_modules/react/jsx-runtime.es.js";
+/* empty css                    */
+import { useTheme as p } from "../../ThemeProvider.es.js";
+import { TooltipTrigger as x } from "../../Tooltip/Tooltip.es.js";
+import { isUrlExternal as c, handleInternalNavigation as d } from "../../../utils/navigation.es.js";
+import { csx as m } from "../../../utils/string.es.js";
+const g = ({
+  to: e,
+  children: a,
+  tooltipProps: t,
+  "data-testid": o
+}) => {
+  const { className: n } = p(), i = t ? /* @__PURE__ */ s.jsx(x, { delay: 50, closeDelay: 75, ...t, children: a }) : a;
+  if (e) {
+    const r = c(e);
+    return /* @__PURE__ */ s.jsx(
+      "span",
+      {
+        className: m(
+          "proton-TextEmphasis",
+          t && "proton-TextEmphasis--tooltip",
+          n
+        ),
+        children: /* @__PURE__ */ s.jsx(
+          "a",
+          {
+            "data-testid": o,
+            href: e,
+            target: r ? "_blank" : void 0,
+            rel: r ? "noopener noreferrer" : void 0,
+            onClick: r ? void 0 : (l) => d(l, e),
+            children: i
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ s.jsx(
+    "span",
+    {
+      className: m(
+        "proton-TextEmphasis",
+        t && "proton-TextEmphasis--tooltip",
+        n
+      ),
+      "data-testid": o,
+      children: i
+    }
+  );
+};
+export {
+  g as TextEmphasis
+};
+//# sourceMappingURL=TextEmphasis.es.js.map

package/dist/components/Text/TextEmphasis/TextEmphasis.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextEmphasis.es.js","sources":["../../../../src/components/Text/TextEmphasis/TextEmphasis.tsx"],"sourcesContent":["\"use client\";\n\nimport { ReactNode } from \"react\";\nimport \"./TextEmphasis.css\";\n\nimport { csx } from \"../../../utils\";\nimport { useTheme } from \"../../ThemeProvider\";\nimport { TooltipTrigger, TooltipTriggerProps } from \"../../Tooltip/Tooltip\";\nimport {\n  handleInternalNavigation,\n  isUrlExternal,\n} from \"../../../utils/navigation\";\n\ninterface TextEmphasisProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The URL that the text emphasis should link to. Turns the element into an `a` tag.\n   */\n  to?: string;\n  /**\n   * The content to display within the text emphasis.\n   */\n  children: ReactNode;\n  /**\n   * Props to pass to the tooltip trigger. When provided, the text emphasis will be wrapped in a tooltip trigger.\n   */\n  tooltipProps?: Omit<TooltipTriggerProps, \"children\">;\n  /**\n   * A test ID.\n   */\n  \"data-testid\"?: string;\n}\n\n/**\n * A component that displays text with emphasis. Provide tooltipProps to wrap the text in a tooltip trigger.\n *\n * API:\n *  - {@link TextEmphasisProps}\n *  - extends {@link React.HTMLAttributes}\n */\nexport const TextEmphasis = ({\n  to,\n  children,\n  tooltipProps,\n  \"data-testid\": testId,\n}: TextEmphasisProps) => {\n  const { className: themeClassName } = useTheme();\n\n  const content = tooltipProps ? (\n    <TooltipTrigger delay={50} closeDelay={75} {...tooltipProps}>\n      {children}\n    </TooltipTrigger>\n  ) : (\n    children\n  );\n\n  if (to) {\n    const isExternal = isUrlExternal(to);\n    return (\n      <span\n        className={csx(\n          \"proton-TextEmphasis\",\n          tooltipProps && \"proton-TextEmphasis--tooltip\",\n          themeClassName\n        )}\n      >\n        <a\n          data-testid={testId}\n          href={to}\n          target={isExternal ? \"_blank\" : undefined}\n          rel={isExternal ? \"noopener noreferrer\" : undefined}\n          onClick={\n            !isExternal ? (e) => handleInternalNavigation(e, to) : undefined\n          }\n        >\n          {content}\n        </a>\n      </span>\n    );\n  }\n\n  return (\n    <span\n      className={csx(\n        \"proton-TextEmphasis\",\n        tooltipProps && \"proton-TextEmphasis--tooltip\",\n        themeClassName\n      )}\n      data-testid={testId}\n    >\n      {content}\n    </span>\n  );\n};\n"],"names":["TextEmphasis","to","children","tooltipProps","testId","themeClassName","useTheme","content","jsx","TooltipTrigger","isExternal","isUrlExternal","csx","e","handleInternalNavigation"],"mappings":";;;;;;AAuCO,MAAMA,IAAe,CAAC;AAAA,EAC3B,IAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAeC;AACjB,MAAyB;AACvB,QAAM,EAAE,WAAWC,EAAe,IAAIC,EAAS,GAEzCC,IAAUJ,IACdK,gBAAAA,EAAA,IAACC,GAAe,EAAA,OAAO,IAAI,YAAY,IAAK,GAAGN,GAC5C,UAAAD,EACH,CAAA,IAEAA;AAGF,MAAID,GAAI;AACA,UAAAS,IAAaC,EAAcV,CAAE;AAEjC,WAAAO,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWI;AAAA,UACT;AAAA,UACAT,KAAgB;AAAA,UAChBE;AAAA,QACF;AAAA,QAEA,UAAAG,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAaJ;AAAA,YACb,MAAMH;AAAA,YACN,QAAQS,IAAa,WAAW;AAAA,YAChC,KAAKA,IAAa,wBAAwB;AAAA,YAC1C,SACGA,IAAsD,SAAzC,CAACG,MAAMC,EAAyBD,GAAGZ,CAAE;AAAA,YAGpD,UAAAM;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AAGE,SAAAC,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWI;AAAA,QACT;AAAA,QACAT,KAAgB;AAAA,QAChBE;AAAA,MACF;AAAA,MACA,eAAaD;AAAA,MAEZ,UAAAG;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/ThemeProvider.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../node_modules/react/jsx-runtime.cjs.js"),t=require("react"),h=require("../design/lightTheme/colors.cjs.js"),l=require("../design/generateStylesheet.cjs.js"),d=require("../design/theme.cjs.js"),u=t.createContext(void 0),T=()=>{const e=t.useContext(u);if(e===void 0)throw new Error("useTheme must be used within a ThemeProvider");return e},x=({theme:e,children:i,palette:r=h.LIGHT_PALETTE})=>{const s=t.useRef(null),o=d.THEME_CLASSES[e],n=t.useMemo(()=>l.generateStylesheet(r,e),[r,e]);return t.useEffect(()=>{s.current&&(s.current.className=o,Object.entries(n).forEach(([a,m])=>{s.current.style.setProperty(a,m)}))},[e,o,r,n]),c.jsxRuntimeExports.jsx(u.Provider,{value:{theme:e,style:n,palette:r,className:o,hasPalette:!!r},children:c.jsxRuntimeExports.jsx("div",{ref:s,children:i})})};exports.ThemeProvider=x;exports.useTheme=T;
+//# sourceMappingURL=ThemeProvider.cjs.js.map

package/dist/components/ThemeProvider.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.cjs.js","sources":["../../src/components/ThemeProvider.tsx"],"sourcesContent":["\"use client\";\n\nimport React, {\n  createContext,\n  ReactNode,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { THEME_CLASSES } from \"../design\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { ProtonPalette, ProtonStyleSheet, ProtonTheme } from \"../design/types\";\nimport { generateStylesheet } from \"../design/generateStylesheet\";\n\ninterface ThemeContextType {\n  theme: ProtonTheme;\n  className: string;\n  style: ProtonStyleSheet;\n  palette: ProtonPalette;\n  hasPalette?: boolean;\n}\n\nconst ThemeContext = createContext<ThemeContextType | undefined>(undefined);\n\nexport const useTheme = () => {\n  const context = useContext(ThemeContext);\n  if (context === undefined) {\n    throw new Error(\"useTheme must be used within a ThemeProvider\");\n  }\n  return context;\n};\n\ninterface ThemeProviderProps {\n  theme: ProtonTheme;\n  children: ReactNode;\n  palette?: ProtonPalette;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  theme,\n  children,\n  palette = LIGHT_PALETTE,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const themeClass = THEME_CLASSES[theme];\n  const themeVariables = useMemo(\n    () => generateStylesheet(palette, theme),\n    [palette, theme]\n  );\n\n  useEffect(() => {\n    // Apply the theme class and css variables to the container div so that it is only scoped\n    // to the ThemeProvider children.\n    if (containerRef.current) {\n      containerRef.current.className = themeClass;\n\n      Object.entries(themeVariables).forEach(([key, value]) => {\n        containerRef.current!.style.setProperty(key, value as string);\n      });\n    }\n  }, [theme, themeClass, palette, themeVariables]);\n\n  return (\n    <ThemeContext.Provider\n      value={{\n        theme,\n        style: themeVariables,\n        palette,\n        className: themeClass,\n        hasPalette: Boolean(palette),\n      }}\n    >\n      <div ref={containerRef}>{children}</div>\n    </ThemeContext.Provider>\n  );\n};\n"],"names":["ThemeContext","createContext","useTheme","context","useContext","ThemeProvider","theme","children","palette","LIGHT_PALETTE","containerRef","useRef","themeClass","THEME_CLASSES","themeVariables","useMemo","generateStylesheet","useEffect","key","value","jsx"],"mappings":"oSAwBMA,EAAeC,EAAAA,cAA4C,MAAS,EAE7DC,EAAW,IAAM,CACtB,MAAAC,EAAUC,aAAWJ,CAAY,EACvC,GAAIG,IAAY,OACR,MAAA,IAAI,MAAM,8CAA8C,EAEzD,OAAAA,CACT,EAQaE,EAA8C,CAAC,CAAA,MAC1DC,EACA,SAAAC,EACA,QAAAC,EAAUC,EAAA,aACZ,IAAM,CACE,MAAAC,EAAeC,SAAuB,IAAI,EAC1CC,EAAaC,gBAAcP,CAAK,EAChCQ,EAAiBC,EAAA,QACrB,IAAMC,EAAmB,mBAAAR,EAASF,CAAK,EACvC,CAACE,EAASF,CAAK,CAAA,EAGjBW,OAAAA,EAAAA,UAAU,IAAM,CAGVP,EAAa,UACfA,EAAa,QAAQ,UAAYE,EAE1B,OAAA,QAAQE,CAAc,EAAE,QAAQ,CAAC,CAACI,EAAKC,CAAK,IAAM,CACvDT,EAAa,QAAS,MAAM,YAAYQ,EAAKC,CAAe,CAAA,CAC7D,IAEF,CAACb,EAAOM,EAAYJ,EAASM,CAAc,CAAC,EAG7CM,EAAA,kBAAA,IAACpB,EAAa,SAAb,CACC,MAAO,CAAA,MACLM,EACA,MAAOQ,EACP,QAAAN,EACA,UAAWI,EACX,WAAY,EAAQJ,CACtB,EAEA,SAACY,EAAA,kBAAA,IAAA,MAAA,CAAI,IAAKV,EAAe,SAAAH,EAAS,CAAA,CAAA,CAGxC"}

package/dist/components/ThemeProvider.es.js

@@ -0,0 +1,42 @@
+import { j as n } from "../node_modules/react/jsx-runtime.es.js";
+import { createContext as a, useContext as f, useRef as h, useMemo as l, useEffect as x } from "react";
+import { LIGHT_PALETTE as E } from "../design/lightTheme/colors.es.js";
+import { generateStylesheet as T } from "../design/generateStylesheet.es.js";
+import { THEME_CLASSES as d } from "../design/theme.es.js";
+const i = a(void 0), y = () => {
+  const e = f(i);
+  if (e === void 0)
+    throw new Error("useTheme must be used within a ThemeProvider");
+  return e;
+}, S = ({
+  theme: e,
+  children: c,
+  palette: r = E
+}) => {
+  const o = h(null), t = d[e], s = l(
+    () => T(r, e),
+    [r, e]
+  );
+  return x(() => {
+    o.current && (o.current.className = t, Object.entries(s).forEach(([m, u]) => {
+      o.current.style.setProperty(m, u);
+    }));
+  }, [e, t, r, s]), /* @__PURE__ */ n.jsx(
+    i.Provider,
+    {
+      value: {
+        theme: e,
+        style: s,
+        palette: r,
+        className: t,
+        hasPalette: !!r
+      },
+      children: /* @__PURE__ */ n.jsx("div", { ref: o, children: c })
+    }
+  );
+};
+export {
+  S as ThemeProvider,
+  y as useTheme
+};
+//# sourceMappingURL=ThemeProvider.es.js.map

package/dist/components/ThemeProvider.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.es.js","sources":["../../src/components/ThemeProvider.tsx"],"sourcesContent":["\"use client\";\n\nimport React, {\n  createContext,\n  ReactNode,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\n\nimport { THEME_CLASSES } from \"../design\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { ProtonPalette, ProtonStyleSheet, ProtonTheme } from \"../design/types\";\nimport { generateStylesheet } from \"../design/generateStylesheet\";\n\ninterface ThemeContextType {\n  theme: ProtonTheme;\n  className: string;\n  style: ProtonStyleSheet;\n  palette: ProtonPalette;\n  hasPalette?: boolean;\n}\n\nconst ThemeContext = createContext<ThemeContextType | undefined>(undefined);\n\nexport const useTheme = () => {\n  const context = useContext(ThemeContext);\n  if (context === undefined) {\n    throw new Error(\"useTheme must be used within a ThemeProvider\");\n  }\n  return context;\n};\n\ninterface ThemeProviderProps {\n  theme: ProtonTheme;\n  children: ReactNode;\n  palette?: ProtonPalette;\n}\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  theme,\n  children,\n  palette = LIGHT_PALETTE,\n}) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const themeClass = THEME_CLASSES[theme];\n  const themeVariables = useMemo(\n    () => generateStylesheet(palette, theme),\n    [palette, theme]\n  );\n\n  useEffect(() => {\n    // Apply the theme class and css variables to the container div so that it is only scoped\n    // to the ThemeProvider children.\n    if (containerRef.current) {\n      containerRef.current.className = themeClass;\n\n      Object.entries(themeVariables).forEach(([key, value]) => {\n        containerRef.current!.style.setProperty(key, value as string);\n      });\n    }\n  }, [theme, themeClass, palette, themeVariables]);\n\n  return (\n    <ThemeContext.Provider\n      value={{\n        theme,\n        style: themeVariables,\n        palette,\n        className: themeClass,\n        hasPalette: Boolean(palette),\n      }}\n    >\n      <div ref={containerRef}>{children}</div>\n    </ThemeContext.Provider>\n  );\n};\n"],"names":["ThemeContext","createContext","useTheme","context","useContext","ThemeProvider","theme","children","palette","LIGHT_PALETTE","containerRef","useRef","themeClass","THEME_CLASSES","themeVariables","useMemo","generateStylesheet","useEffect","key","value","jsx"],"mappings":";;;;;AAwBA,MAAMA,IAAeC,EAA4C,MAAS,GAE7DC,IAAW,MAAM;AACtB,QAAAC,IAAUC,EAAWJ,CAAY;AACvC,MAAIG,MAAY;AACR,UAAA,IAAI,MAAM,8CAA8C;AAEzD,SAAAA;AACT,GAQaE,IAA8C,CAAC;AAAA,EAC1D,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC,IAAUC;AACZ,MAAM;AACE,QAAAC,IAAeC,EAAuB,IAAI,GAC1CC,IAAaC,EAAcP,CAAK,GAChCQ,IAAiBC;AAAA,IACrB,MAAMC,EAAmBR,GAASF,CAAK;AAAA,IACvC,CAACE,GAASF,CAAK;AAAA,EAAA;AAGjB,SAAAW,EAAU,MAAM;AAGd,IAAIP,EAAa,YACfA,EAAa,QAAQ,YAAYE,GAE1B,OAAA,QAAQE,CAAc,EAAE,QAAQ,CAAC,CAACI,GAAKC,CAAK,MAAM;AACvD,MAAAT,EAAa,QAAS,MAAM,YAAYQ,GAAKC,CAAe;AAAA,IAAA,CAC7D;AAAA,KAEF,CAACb,GAAOM,GAAYJ,GAASM,CAAc,CAAC,GAG7CM,gBAAAA,EAAA;AAAA,IAACpB,EAAa;AAAA,IAAb;AAAA,MACC,OAAO;AAAA,QACL,OAAAM;AAAA,QACA,OAAOQ;AAAA,QACP,SAAAN;AAAA,QACA,WAAWI;AAAA,QACX,YAAY,EAAQJ;AAAA,MACtB;AAAA,MAEA,UAACY,gBAAAA,EAAA,IAAA,OAAA,EAAI,KAAKV,GAAe,UAAAH,GAAS;AAAA,IAAA;AAAA,EAAA;AAGxC;"}

package/dist/components/Tombstone/Tombstone.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../../node_modules/react/jsx-runtime.cjs.js");;/* empty css                   */const u=require("../ThemeProvider.cjs.js"),t=require("../../utils/color2k.cjs.js"),i=require("../../utils/string.cjs.js"),a=({width:o="100%",height:s="1.5rem",borderRadius:r="4px"})=>{const{hasPalette:n,palette:e}=u.useTheme(),m={"--tombstone-custom-background":e.PRIMARY.MEDIUM,"--tombstone-custom-primary":t.transparentize(e.PRIMARY.DARK,.9),"--tombstone-custom-secondary":t.transparentize(e.SECONDARY.DARK,.7)};return c.jsxRuntimeExports.jsx("div",{className:i.csx("proton-Tombstone",n&&"proton-Tombstone--custom"),style:{...m,width:o,height:s,borderRadius:r}})};exports.Tombstone=a;
+//# sourceMappingURL=Tombstone.cjs.js.map

package/dist/components/Tombstone/Tombstone.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tombstone.cjs.js","sources":["../../../src/components/Tombstone/Tombstone.tsx"],"sourcesContent":["\"use client\";\n\nimport \"./Tombstone.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { csx, transparentize } from \"../../utils\";\n\nexport interface TombstoneProps {\n  /**\n   * The border radius of the tombstone.\n   * @default \"4px\"\n   */\n  borderRadius?: string;\n  /**\n   * The height of the tombstone.\n   * @default \"1.5rem\"\n   */\n  height?: string;\n  /**\n   * The width of the tombstone.\n   * @default \"100%\"\n   */\n  width?: string;\n}\n\n/**\n * A component that displays a loading tombstone. For use as a placeholder while loading content.\n *\n * API:\n *  - {@link TombstoneProps}\n */\nexport const Tombstone = ({\n  width = \"100%\",\n  height = \"1.5rem\",\n  borderRadius = \"4px\",\n}: TombstoneProps) => {\n  const { hasPalette, palette } = useTheme();\n\n  const style = {\n    \"--tombstone-custom-background\": palette.PRIMARY.MEDIUM,\n    \"--tombstone-custom-primary\": transparentize(palette.PRIMARY.DARK, 0.9),\n    \"--tombstone-custom-secondary\": transparentize(palette.SECONDARY.DARK, 0.7),\n  } as React.CSSProperties;\n\n  return (\n    <div\n      className={csx(\n        \"proton-Tombstone\",\n        hasPalette && \"proton-Tombstone--custom\"\n      )}\n      style={{\n        ...style,\n        width,\n        height,\n        borderRadius,\n      }}\n    />\n  );\n};\n"],"names":["Tombstone","width","height","borderRadius","hasPalette","palette","useTheme","style","transparentize","jsx","csx"],"mappings":"2SA8BaA,EAAY,CAAC,CACxB,MAAAC,EAAQ,OACR,OAAAC,EAAS,SACT,aAAAC,EAAe,KACjB,IAAsB,CACpB,KAAM,CAAE,WAAAC,EAAY,QAAAC,CAAQ,EAAIC,EAAS,SAAA,EAEnCC,EAAQ,CACZ,gCAAiCF,EAAQ,QAAQ,OACjD,6BAA8BG,EAAAA,eAAeH,EAAQ,QAAQ,KAAM,EAAG,EACtE,+BAAgCG,EAAAA,eAAeH,EAAQ,UAAU,KAAM,EAAG,CAAA,EAI1E,OAAAI,EAAA,kBAAA,IAAC,MAAA,CACC,UAAWC,EAAA,IACT,mBACAN,GAAc,0BAChB,EACA,MAAO,CACL,GAAGG,EACH,MAAAN,EACA,OAAAC,EACA,aAAAC,CACF,CAAA,CAAA,CAGN"}

package/dist/components/Tombstone/Tombstone.es.js

@@ -0,0 +1,35 @@
+import { j as p } from "../../node_modules/react/jsx-runtime.es.js";
+/* empty css                 */
+import { useTheme as a } from "../ThemeProvider.es.js";
+import { transparentize as t } from "../../utils/color2k.es.js";
+import { csx as c } from "../../utils/string.es.js";
+const l = ({
+  width: s = "100%",
+  height: m = "1.5rem",
+  borderRadius: e = "4px"
+}) => {
+  const { hasPalette: r, palette: o } = a(), n = {
+    "--tombstone-custom-background": o.PRIMARY.MEDIUM,
+    "--tombstone-custom-primary": t(o.PRIMARY.DARK, 0.9),
+    "--tombstone-custom-secondary": t(o.SECONDARY.DARK, 0.7)
+  };
+  return /* @__PURE__ */ p.jsx(
+    "div",
+    {
+      className: c(
+        "proton-Tombstone",
+        r && "proton-Tombstone--custom"
+      ),
+      style: {
+        ...n,
+        width: s,
+        height: m,
+        borderRadius: e
+      }
+    }
+  );
+};
+export {
+  l as Tombstone
+};
+//# sourceMappingURL=Tombstone.es.js.map

package/dist/components/Tombstone/Tombstone.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tombstone.es.js","sources":["../../../src/components/Tombstone/Tombstone.tsx"],"sourcesContent":["\"use client\";\n\nimport \"./Tombstone.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { csx, transparentize } from \"../../utils\";\n\nexport interface TombstoneProps {\n  /**\n   * The border radius of the tombstone.\n   * @default \"4px\"\n   */\n  borderRadius?: string;\n  /**\n   * The height of the tombstone.\n   * @default \"1.5rem\"\n   */\n  height?: string;\n  /**\n   * The width of the tombstone.\n   * @default \"100%\"\n   */\n  width?: string;\n}\n\n/**\n * A component that displays a loading tombstone. For use as a placeholder while loading content.\n *\n * API:\n *  - {@link TombstoneProps}\n */\nexport const Tombstone = ({\n  width = \"100%\",\n  height = \"1.5rem\",\n  borderRadius = \"4px\",\n}: TombstoneProps) => {\n  const { hasPalette, palette } = useTheme();\n\n  const style = {\n    \"--tombstone-custom-background\": palette.PRIMARY.MEDIUM,\n    \"--tombstone-custom-primary\": transparentize(palette.PRIMARY.DARK, 0.9),\n    \"--tombstone-custom-secondary\": transparentize(palette.SECONDARY.DARK, 0.7),\n  } as React.CSSProperties;\n\n  return (\n    <div\n      className={csx(\n        \"proton-Tombstone\",\n        hasPalette && \"proton-Tombstone--custom\"\n      )}\n      style={{\n        ...style,\n        width,\n        height,\n        borderRadius,\n      }}\n    />\n  );\n};\n"],"names":["Tombstone","width","height","borderRadius","hasPalette","palette","useTheme","style","transparentize","jsx","csx"],"mappings":";;;;;AA8BO,MAAMA,IAAY,CAAC;AAAA,EACxB,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,cAAAC,IAAe;AACjB,MAAsB;AACpB,QAAM,EAAE,YAAAC,GAAY,SAAAC,EAAQ,IAAIC,EAAS,GAEnCC,IAAQ;AAAA,IACZ,iCAAiCF,EAAQ,QAAQ;AAAA,IACjD,8BAA8BG,EAAeH,EAAQ,QAAQ,MAAM,GAAG;AAAA,IACtE,gCAAgCG,EAAeH,EAAQ,UAAU,MAAM,GAAG;AAAA,EAAA;AAI1E,SAAAI,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAN,KAAc;AAAA,MAChB;AAAA,MACA,OAAO;AAAA,QACL,GAAGG;AAAA,QACH,OAAAN;AAAA,QACA,QAAAC;AAAA,QACA,cAAAC;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Tooltip/Tooltip.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),h=require("../../node_modules/react-aria-components/dist/OverlayArrow.cjs.js"),T=require("../../node_modules/react-aria-components/dist/Tooltip.cjs.js"),R=require("react-aria"),a=require("react"),d=require("../ThemeProvider.cjs.js");;/* empty css                        */;/* empty css                 */const m=require("../../utils/string.cjs.js");function v({children:t,arrow:n,...u}){const{style:r,className:o}=d.useTheme();return e.jsxRuntimeExports.jsxs(T.Tooltip,{...u,className:m.csx("proton__Tooltip","proton-Dialog",o),style:r,children:[n&&e.jsxRuntimeExports.jsx(h.OverlayArrow,{className:m.csx("proton__TooltipArrow",o),children:e.jsxRuntimeExports.jsx("svg",{width:8,height:8,viewBox:"0 0 8 8",children:e.jsxRuntimeExports.jsx("path",{d:"M0 0 L4 4 L8 0"})})}),t]})}function E({children:t,delay:n=500,closeDelay:u=500,isDisabled:r,defaultOpen:o,onOpenChange:x,disableTriggerClick:p,content:j,...g}){const[l,s]=a.useState(!1),i=a.useRef(!1),f=a.useRef(!1);return j===""?null:e.jsxRuntimeExports.jsxs(T.TooltipTrigger,{delay:n,closeDelay:u,isDisabled:r,isOpen:l,defaultOpen:o,onOpenChange:c=>{c&&!i.current&&(f.current=!0),x&&x(c),i.current||s(c),i.current=!1},children:[p?e.jsxRuntimeExports.jsx("span",{className:"proton__TooltipTrigger","aria-label":"Show tooltip",children:t}):e.jsxRuntimeExports.jsx(R.Focusable,{children:e.jsxRuntimeExports.jsx("div",{role:"button","aria-label":"Show tooltip",className:"proton__TooltipTrigger","data-hovered":l,onMouseEnter:()=>{r||s(!0)},onMouseLeave:()=>{r||s(!1)},onClick:()=>{p||r||f.current||(i.current=!0,s(!l))},children:t})}),e.jsxRuntimeExports.jsx(v,{...g,children:j})]})}exports.TooltipTrigger=E;
+//# sourceMappingURL=Tooltip.cjs.js.map

package/dist/components/Tooltip/Tooltip.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.cjs.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Tooltip as AriaTooltip,\n  TooltipProps as AriaTooltipProps,\n  TooltipTrigger as AriaTooltipTrigger,\n  Focusable,\n  OverlayArrow,\n  TooltipTriggerComponentProps,\n} from \"react-aria-components\";\n\nimport { useRef, useState } from \"react\";\nimport { useTheme } from \"../ThemeProvider\";\n\nimport { csx } from \"../../utils\";\nimport \"../Dialog/Dialog.css\";\nimport \"./Tooltip.css\";\n\nexport interface TooltipProps extends Omit<AriaTooltipProps, \"children\"> {\n  children: React.ReactNode;\n  arrow?: boolean;\n}\n\nfunction Tooltip({ children, arrow, ...props }: TooltipProps) {\n  const { style, className } = useTheme();\n\n  return (\n    <AriaTooltip\n      {...props}\n      className={csx(\"proton__Tooltip\", \"proton-Dialog\", className)}\n      style={style as React.CSSProperties}\n    >\n      {arrow && (\n        <OverlayArrow className={csx(\"proton__TooltipArrow\", className)}>\n          <svg width={8} height={8} viewBox=\"0 0 8 8\">\n            <path d=\"M0 0 L4 4 L8 0\" />\n          </svg>\n        </OverlayArrow>\n      )}\n\n      {children}\n    </AriaTooltip>\n  );\n}\n\nexport interface TooltipTriggerProps\n  extends TooltipProps,\n    TooltipTriggerComponentProps {\n  children: React.ReactNode;\n  /**\n   * The content to display in the tooltip. Zero-length titles string are never displayed.\n   */\n  content: string | React.ReactNode;\n  /**\n   * Whether to disable the trigger click feature.\n   */\n  disableTriggerClick?: boolean;\n}\n\n/**\n * Proton's TooltipTrigger component deviates from the Aria TooltipTrigger in that on mobile,\n * the trigger also opens the tooltip on click as well as hover & focus. This is to improve\n * accessibility and usability on mobile.\n *\n * If you wish to disable the trigger click feature, you can set the `disableTriggerClick` prop.\n * This is useful when using an info only Tooltip that might wrap a clickable element.\n *\n * API:\n *  - {@link TooltipTriggerProps}\n *  - extends {@link TooltipProps}\n *  - extends {@link TooltipTriggerComponentProps}\n *\n * @example\n * ```tsx\n    <TooltipTrigger content={...} placement=\"top\" arrow isDisabled={disabled}>\n      {children}\n    </TooltipTrigger>\n * ```\n */\nexport function TooltipTrigger({\n  children,\n  // trigger props\n  delay = 500,\n  closeDelay = 500,\n  isDisabled,\n  defaultOpen,\n  onOpenChange,\n  disableTriggerClick,\n  // tooltip props\n  content,\n  ...tooltipProps\n}: TooltipTriggerProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const triggerClickRef = useRef<boolean>(false);\n  const hasHovered = useRef<boolean>(false);\n\n  if (content === \"\") return null;\n\n  return (\n    <AriaTooltipTrigger\n      delay={delay}\n      closeDelay={closeDelay}\n      isDisabled={isDisabled}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={(openState) => {\n        // When opened via hover, we want to disable the trigger click feature as it causes\n        // the tooltip state to get out of sync with the trigger state.\n        if (openState && !triggerClickRef.current) hasHovered.current = true;\n\n        if (onOpenChange) onOpenChange(openState);\n\n        // If the tooltip is clicked, it manually calls setIsOpen, so we don't want to call\n        // it again here.\n        if (!triggerClickRef.current) setIsOpen(openState);\n        triggerClickRef.current = false;\n      }}\n    >\n      {disableTriggerClick ? (\n        <span className=\"proton__TooltipTrigger\" aria-label=\"Show tooltip\">\n          {children}\n        </span>\n      ) : (\n        <Focusable>\n          <div\n            role=\"button\"\n            aria-label=\"Show tooltip\"\n            className=\"proton__TooltipTrigger\"\n            data-hovered={isOpen}\n            onMouseEnter={() => {\n              if (!isDisabled) {\n                setIsOpen(true);\n              }\n            }}\n            onMouseLeave={() => {\n              if (!isDisabled) {\n                setIsOpen(false);\n              }\n            }}\n            onClick={() => {\n              if (disableTriggerClick || isDisabled) return;\n\n              // Once hovered it's safe to assume the user isn't trying to use via a touch device,\n              // so we can safely disable the trigger click feature.\n              if (hasHovered.current) return;\n\n              triggerClickRef.current = true;\n              setIsOpen(!isOpen);\n            }}\n          >\n            {children}\n          </div>\n        </Focusable>\n      )}\n      <Tooltip {...tooltipProps}>{content}</Tooltip>\n    </AriaTooltipTrigger>\n  );\n}\n"],"names":["Tooltip","children","arrow","props","style","className","useTheme","jsxs","AriaTooltip","csx","jsx","OverlayArrow","TooltipTrigger","delay","closeDelay","isDisabled","defaultOpen","onOpenChange","disableTriggerClick","content","tooltipProps","isOpen","setIsOpen","useState","triggerClickRef","useRef","hasHovered","AriaTooltipTrigger","openState","Focusable"],"mappings":"4eAuBA,SAASA,EAAQ,CAAE,SAAAC,EAAU,MAAAC,EAAO,GAAGC,GAAuB,CAC5D,KAAM,CAAE,MAAAC,EAAO,UAAAC,CAAU,EAAIC,EAAS,SAAA,EAGpC,OAAAC,EAAA,kBAAA,KAACC,EAAA,QAAA,CACE,GAAGL,EACJ,UAAWM,EAAA,IAAI,kBAAmB,gBAAiBJ,CAAS,EAC5D,MAAAD,EAEC,SAAA,CACCF,GAAAQ,EAAA,kBAAA,IAACC,gBAAa,UAAWF,EAAA,IAAI,uBAAwBJ,CAAS,EAC5D,iCAAC,MAAI,CAAA,MAAO,EAAG,OAAQ,EAAG,QAAQ,UAChC,SAAAK,EAAAA,kBAAAA,IAAC,QAAK,EAAE,iBAAiB,EAC3B,CACF,CAAA,EAGDT,CAAA,CAAA,CAAA,CAGP,CAoCO,SAASW,EAAe,CAC7B,SAAAX,EAEA,MAAAY,EAAQ,IACR,WAAAC,EAAa,IACb,WAAAC,EACA,YAAAC,EACA,aAAAC,EACA,oBAAAC,EAEA,QAAAC,EACA,GAAGC,CACL,EAAwB,CACtB,KAAM,CAACC,EAAQC,CAAS,EAAIC,WAAS,EAAK,EACpCC,EAAkBC,SAAgB,EAAK,EACvCC,EAAaD,SAAgB,EAAK,EAEpC,OAAAN,IAAY,GAAW,KAGzBZ,EAAA,kBAAA,KAACoB,EAAA,eAAA,CACC,MAAAd,EACA,WAAAC,EACA,WAAAC,EACA,OAAAM,EACA,YAAAL,EACA,aAAeY,GAAc,CAGvBA,GAAa,CAACJ,EAAgB,YAAoB,QAAU,IAE5DP,KAA2BW,CAAS,EAInCJ,EAAgB,SAASF,EAAUM,CAAS,EACjDJ,EAAgB,QAAU,EAC5B,EAEC,SAAA,CACCN,EAAAR,EAAAA,kBAAAA,IAAC,QAAK,UAAU,yBAAyB,aAAW,eACjD,SAAAT,CACH,CAAA,EAEAS,EAAAA,kBAAAA,IAACmB,EAAAA,UACC,CAAA,SAAAnB,EAAA,kBAAA,IAAC,MAAA,CACC,KAAK,SACL,aAAW,eACX,UAAU,yBACV,eAAcW,EACd,aAAc,IAAM,CACbN,GACHO,EAAU,EAAI,CAElB,EACA,aAAc,IAAM,CACbP,GACHO,EAAU,EAAK,CAEnB,EACA,QAAS,IAAM,CACTJ,GAAuBH,GAIvBW,EAAW,UAEfF,EAAgB,QAAU,GAC1BF,EAAU,CAACD,CAAM,EACnB,EAEC,SAAApB,CAAA,CAAA,EAEL,EAEDS,EAAA,kBAAA,IAAAV,EAAA,CAAS,GAAGoB,EAAe,SAAQD,CAAA,CAAA,CAAA,CAAA,CAAA,CAG1C"}

package/dist/components/Tooltip/Tooltip.es.js

@@ -0,0 +1,78 @@
+import { j as r } from "../../node_modules/react/jsx-runtime.es.js";
+import { OverlayArrow as T } from "../../node_modules/react-aria-components/dist/OverlayArrow.es.js";
+import { TooltipTrigger as g, Tooltip as j } from "../../node_modules/react-aria-components/dist/Tooltip.es.js";
+import { Focusable as $ } from "react-aria";
+import { useState as _, useRef as x } from "react";
+import { useTheme as v } from "../ThemeProvider.es.js";
+/* empty css                      */
+/* empty css               */
+import { csx as d } from "../../utils/string.es.js";
+function w({ children: e, arrow: n, ...l }) {
+  const { style: o, className: t } = v();
+  return /* @__PURE__ */ r.jsxs(
+    j,
+    {
+      ...l,
+      className: d("proton__Tooltip", "proton-Dialog", t),
+      style: o,
+      children: [
+        n && /* @__PURE__ */ r.jsx(T, { className: d("proton__TooltipArrow", t), children: /* @__PURE__ */ r.jsx("svg", { width: 8, height: 8, viewBox: "0 0 8 8", children: /* @__PURE__ */ r.jsx("path", { d: "M0 0 L4 4 L8 0" }) }) }),
+        e
+      ]
+    }
+  );
+}
+function k({
+  children: e,
+  // trigger props
+  delay: n = 500,
+  closeDelay: l = 500,
+  isDisabled: o,
+  defaultOpen: t,
+  onOpenChange: c,
+  disableTriggerClick: f,
+  // tooltip props
+  content: u,
+  ...h
+}) {
+  const [a, s] = _(!1), i = x(!1), m = x(!1);
+  return u === "" ? null : /* @__PURE__ */ r.jsxs(
+    g,
+    {
+      delay: n,
+      closeDelay: l,
+      isDisabled: o,
+      isOpen: a,
+      defaultOpen: t,
+      onOpenChange: (p) => {
+        p && !i.current && (m.current = !0), c && c(p), i.current || s(p), i.current = !1;
+      },
+      children: [
+        f ? /* @__PURE__ */ r.jsx("span", { className: "proton__TooltipTrigger", "aria-label": "Show tooltip", children: e }) : /* @__PURE__ */ r.jsx($, { children: /* @__PURE__ */ r.jsx(
+          "div",
+          {
+            role: "button",
+            "aria-label": "Show tooltip",
+            className: "proton__TooltipTrigger",
+            "data-hovered": a,
+            onMouseEnter: () => {
+              o || s(!0);
+            },
+            onMouseLeave: () => {
+              o || s(!1);
+            },
+            onClick: () => {
+              f || o || m.current || (i.current = !0, s(!a));
+            },
+            children: e
+          }
+        ) }),
+        /* @__PURE__ */ r.jsx(w, { ...h, children: u })
+      ]
+    }
+  );
+}
+export {
+  k as TooltipTrigger
+};
+//# sourceMappingURL=Tooltip.es.js.map

package/dist/components/Tooltip/Tooltip.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.es.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  Tooltip as AriaTooltip,\n  TooltipProps as AriaTooltipProps,\n  TooltipTrigger as AriaTooltipTrigger,\n  Focusable,\n  OverlayArrow,\n  TooltipTriggerComponentProps,\n} from \"react-aria-components\";\n\nimport { useRef, useState } from \"react\";\nimport { useTheme } from \"../ThemeProvider\";\n\nimport { csx } from \"../../utils\";\nimport \"../Dialog/Dialog.css\";\nimport \"./Tooltip.css\";\n\nexport interface TooltipProps extends Omit<AriaTooltipProps, \"children\"> {\n  children: React.ReactNode;\n  arrow?: boolean;\n}\n\nfunction Tooltip({ children, arrow, ...props }: TooltipProps) {\n  const { style, className } = useTheme();\n\n  return (\n    <AriaTooltip\n      {...props}\n      className={csx(\"proton__Tooltip\", \"proton-Dialog\", className)}\n      style={style as React.CSSProperties}\n    >\n      {arrow && (\n        <OverlayArrow className={csx(\"proton__TooltipArrow\", className)}>\n          <svg width={8} height={8} viewBox=\"0 0 8 8\">\n            <path d=\"M0 0 L4 4 L8 0\" />\n          </svg>\n        </OverlayArrow>\n      )}\n\n      {children}\n    </AriaTooltip>\n  );\n}\n\nexport interface TooltipTriggerProps\n  extends TooltipProps,\n    TooltipTriggerComponentProps {\n  children: React.ReactNode;\n  /**\n   * The content to display in the tooltip. Zero-length titles string are never displayed.\n   */\n  content: string | React.ReactNode;\n  /**\n   * Whether to disable the trigger click feature.\n   */\n  disableTriggerClick?: boolean;\n}\n\n/**\n * Proton's TooltipTrigger component deviates from the Aria TooltipTrigger in that on mobile,\n * the trigger also opens the tooltip on click as well as hover & focus. This is to improve\n * accessibility and usability on mobile.\n *\n * If you wish to disable the trigger click feature, you can set the `disableTriggerClick` prop.\n * This is useful when using an info only Tooltip that might wrap a clickable element.\n *\n * API:\n *  - {@link TooltipTriggerProps}\n *  - extends {@link TooltipProps}\n *  - extends {@link TooltipTriggerComponentProps}\n *\n * @example\n * ```tsx\n    <TooltipTrigger content={...} placement=\"top\" arrow isDisabled={disabled}>\n      {children}\n    </TooltipTrigger>\n * ```\n */\nexport function TooltipTrigger({\n  children,\n  // trigger props\n  delay = 500,\n  closeDelay = 500,\n  isDisabled,\n  defaultOpen,\n  onOpenChange,\n  disableTriggerClick,\n  // tooltip props\n  content,\n  ...tooltipProps\n}: TooltipTriggerProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const triggerClickRef = useRef<boolean>(false);\n  const hasHovered = useRef<boolean>(false);\n\n  if (content === \"\") return null;\n\n  return (\n    <AriaTooltipTrigger\n      delay={delay}\n      closeDelay={closeDelay}\n      isDisabled={isDisabled}\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={(openState) => {\n        // When opened via hover, we want to disable the trigger click feature as it causes\n        // the tooltip state to get out of sync with the trigger state.\n        if (openState && !triggerClickRef.current) hasHovered.current = true;\n\n        if (onOpenChange) onOpenChange(openState);\n\n        // If the tooltip is clicked, it manually calls setIsOpen, so we don't want to call\n        // it again here.\n        if (!triggerClickRef.current) setIsOpen(openState);\n        triggerClickRef.current = false;\n      }}\n    >\n      {disableTriggerClick ? (\n        <span className=\"proton__TooltipTrigger\" aria-label=\"Show tooltip\">\n          {children}\n        </span>\n      ) : (\n        <Focusable>\n          <div\n            role=\"button\"\n            aria-label=\"Show tooltip\"\n            className=\"proton__TooltipTrigger\"\n            data-hovered={isOpen}\n            onMouseEnter={() => {\n              if (!isDisabled) {\n                setIsOpen(true);\n              }\n            }}\n            onMouseLeave={() => {\n              if (!isDisabled) {\n                setIsOpen(false);\n              }\n            }}\n            onClick={() => {\n              if (disableTriggerClick || isDisabled) return;\n\n              // Once hovered it's safe to assume the user isn't trying to use via a touch device,\n              // so we can safely disable the trigger click feature.\n              if (hasHovered.current) return;\n\n              triggerClickRef.current = true;\n              setIsOpen(!isOpen);\n            }}\n          >\n            {children}\n          </div>\n        </Focusable>\n      )}\n      <Tooltip {...tooltipProps}>{content}</Tooltip>\n    </AriaTooltipTrigger>\n  );\n}\n"],"names":["Tooltip","children","arrow","props","style","className","useTheme","jsxs","AriaTooltip","csx","jsx","OverlayArrow","TooltipTrigger","delay","closeDelay","isDisabled","defaultOpen","onOpenChange","disableTriggerClick","content","tooltipProps","isOpen","setIsOpen","useState","triggerClickRef","useRef","hasHovered","AriaTooltipTrigger","openState","Focusable"],"mappings":";;;;;;;;;AAuBA,SAASA,EAAQ,EAAE,UAAAC,GAAU,OAAAC,GAAO,GAAGC,KAAuB;AAC5D,QAAM,EAAE,OAAAC,GAAO,WAAAC,EAAU,IAAIC,EAAS;AAGpC,SAAAC,gBAAAA,EAAA;AAAA,IAACC;AAAAA,IAAA;AAAA,MACE,GAAGL;AAAA,MACJ,WAAWM,EAAI,mBAAmB,iBAAiBJ,CAAS;AAAA,MAC5D,OAAAD;AAAA,MAEC,UAAA;AAAA,QACCF,KAAAQ,gBAAAA,EAAA,IAACC,KAAa,WAAWF,EAAI,wBAAwBJ,CAAS,GAC5D,gCAAC,OAAI,EAAA,OAAO,GAAG,QAAQ,GAAG,SAAQ,WAChC,UAAAK,gBAAAA,EAAAA,IAAC,UAAK,GAAE,kBAAiB,GAC3B,EACF,CAAA;AAAA,QAGDT;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;AAoCO,SAASW,EAAe;AAAA,EAC7B,UAAAX;AAAA;AAAA,EAEA,OAAAY,IAAQ;AAAA,EACR,YAAAC,IAAa;AAAA,EACb,YAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,qBAAAC;AAAA;AAAA,EAEA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAwB;AACtB,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GACpCC,IAAkBC,EAAgB,EAAK,GACvCC,IAAaD,EAAgB,EAAK;AAEpC,SAAAN,MAAY,KAAW,OAGzBZ,gBAAAA,EAAA;AAAA,IAACoB;AAAAA,IAAA;AAAA,MACC,OAAAd;AAAA,MACA,YAAAC;AAAA,MACA,YAAAC;AAAA,MACA,QAAAM;AAAA,MACA,aAAAL;AAAA,MACA,cAAc,CAACY,MAAc;AAG3B,QAAIA,KAAa,CAACJ,EAAgB,cAAoB,UAAU,KAE5DP,OAA2BW,CAAS,GAInCJ,EAAgB,WAASF,EAAUM,CAAS,GACjDJ,EAAgB,UAAU;AAAA,MAC5B;AAAA,MAEC,UAAA;AAAA,QACCN,IAAAR,gBAAAA,EAAAA,IAAC,UAAK,WAAU,0BAAyB,cAAW,gBACjD,UAAAT,EACH,CAAA,IAEAS,gBAAAA,EAAAA,IAACmB,GACC,EAAA,UAAAnB,gBAAAA,EAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAW;AAAA,YACX,WAAU;AAAA,YACV,gBAAcW;AAAA,YACd,cAAc,MAAM;AAClB,cAAKN,KACHO,EAAU,EAAI;AAAA,YAElB;AAAA,YACA,cAAc,MAAM;AAClB,cAAKP,KACHO,EAAU,EAAK;AAAA,YAEnB;AAAA,YACA,SAAS,MAAM;AACb,cAAIJ,KAAuBH,KAIvBW,EAAW,YAEfF,EAAgB,UAAU,IAC1BF,EAAU,CAACD,CAAM;AAAA,YACnB;AAAA,YAEC,UAAApB;AAAA,UAAA;AAAA,QAAA,GAEL;AAAA,QAEDS,gBAAAA,EAAA,IAAAV,GAAA,EAAS,GAAGoB,GAAe,UAAQD,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1C;"}

package/dist/components/Waveform/Waveform.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../node_modules/react/jsx-runtime.cjs.js"),v=require("react"),H=require("../ThemeProvider.cjs.js");;/* empty css                  */const L=require("./WaveformBar.cjs.js"),$=require("../../utils/string.cjs.js"),X=K(100);function F({data:e,resolution:t=2,startDuration:s,endDuration:a,currentTime:m=0,showTimestamps:g=!1,totalDuration:l,disabled:f,disabledMessage:d,onClick:h,"data-testid":p}){var P;const{className:_}=H.useTheme(),o=v.useRef(null),[W,B]=v.useState([]),[j,b]=v.useState(null),[w,I]=v.useState(!1),[N,q]=v.useState(!1),y=e||X,M=t;v.useEffect(()=>{if(!o.current)return;const r=i=>{const x=Math.floor(i/(t+M)),R=G(y,x);B(R)},n=o.current.clientWidth;r(n);const c=new ResizeObserver(i=>{i&&i[0]&&r(i[0].contentRect.width)});return c.observe(o.current),()=>c.disconnect()},[y,t,M]),v.useEffect(()=>{const r=setTimeout(()=>I(!0),50),n=setTimeout(()=>q(!0),500);return()=>{clearTimeout(r),clearTimeout(n)}},[]);const A=r=>{if(!o.current)return;const n=o.current.getBoundingClientRect(),i=(r.clientX-n.left)/n.width*l;b(i)},z=()=>{b(null)},O=t+M,E=(r,n)=>{var x;const c=r/l*100;return(n==="start"?Math.floor(c/100*W.length):Math.ceil(c/100*W.length))*O/((x=o.current)==null?void 0:x.clientWidth)*100},V=(P=o.current)==null?void 0:P.clientWidth,S=v.useMemo(()=>f&&d?d:e?null:"Waveform Unavailable",[f,d,e]);return u.jsxRuntimeExports.jsxs("div",{className:$.csx("proton-Waveform",_),"data-testid":p,children:[g&&u.jsxRuntimeExports.jsx(T,{direction:"left",seconds:m}),u.jsxRuntimeExports.jsxs("div",{ref:o,className:"proton-Waveform__container",onMouseMove:A,onMouseLeave:z,onClick:r=>{if(!o.current||f)return;const n=o.current.getBoundingClientRect(),i=(r.clientX-n.left)/n.width*l;h==null||h(i,r)},"data-disabled":f,"data-testid":"waveform-container",children:[s!==void 0&&a!==void 0&&u.jsxRuntimeExports.jsx("div",{className:"proton-Waveform__active-region",style:{left:o.current?`calc(${E(s,"start")}%`:"0%",right:o.current?`calc(${100-E(a,"end")}% - 2px)`:"0%"}}),j!==null&&u.jsxRuntimeExports.jsx("div",{className:"proton-Waveform__hover-line",style:{left:`${j/l*100}%`}}),W.map((r,n)=>{const c=n/W.length*l,i=s!==void 0&&a!==void 0&&(c<s||c>a),x=m===0?!1:c<=m,R=j!==null&&c<=j;return u.jsxRuntimeExports.jsx(L.WaveformBar,{amplitude:r,isDisabled:f||i,isPlayed:x,isHovered:R,isVisible:w,hasAnimated:N,resolution:t,spacing:M,index:n},n)})]}),S&&u.jsxRuntimeExports.jsx("div",{className:"proton-Waveform__bar-unavailable",style:{fontSize:V<325?"0.85rem":"1rem"},children:S}),g&&u.jsxRuntimeExports.jsx(T,{direction:"right",seconds:l})]})}function T({direction:e,seconds:t}){return u.jsxRuntimeExports.jsx("div",{className:$.csx("proton-Waveform__timestamp",`proton-Waveform__timestamp--${e}`),children:U(t)})}function U(e){const t=Math.floor(e/60),s=Math.floor(e%60);return`${t}:${s<10?"0":""}${s.toFixed(0)}`}function G(e,t){const s=e.length,a=s/t,m=new Array(t).fill(0).map((g,l)=>{const f=l*a,d=Math.floor(f),h=Math.min(d+1,s-1),p=f-d;return e[d]*(1-p)+e[h]*p});return J(m)}function J(e){const t=Math.min(...e),s=Math.max(...e);return e.map(a=>{const m=(a-t)/(s-t);return Math.max(m*.8+.1,.1)})}function K(e){return Array.from({length:e},(t,s)=>{const m=s/(e-1)*6*2*Math.PI-Math.PI/2;return Math.sin(m)*.5+.5})}exports.Waveform=F;
+//# sourceMappingURL=Waveform.cjs.js.map

package/dist/components/Waveform/Waveform.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Waveform.cjs.js","sources":["../../../src/components/Waveform/Waveform.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useRef, useState } from \"react\";\nimport { csx } from \"../../utils\";\nimport { useTheme } from \"../ThemeProvider\";\nimport \"./Waveform.css\";\nimport { WaveformBar } from \"./WaveformBar\";\n\nexport interface WaveformProps {\n  /**\n   * Array of normalized amplitude values (0-1) representing the waveform.\n   * If not provided, uses a sample sine wave.\n   */\n  data?: number[];\n\n  /**\n   * Current playback position in seconds.\n   */\n  currentTime?: number;\n\n  /**\n   * Test ID for testing purposes.\n   */\n  \"data-testid\"?: string;\n\n  /**\n   * Whether the entire waveform is disabled.\n   */\n  disabled?: boolean;\n\n  /**\n   * Reason for the waveform being disabled.\n   */\n  disabledMessage?: string;\n\n  /**\n   * End time to display until in seconds.\n   */\n  endDuration?: number;\n\n  /**\n   * Click handler that receives the clicked position (0-1) and event.\n   */\n  onClick?: (position: number, e: React.MouseEvent<HTMLDivElement>) => void;\n\n  /**\n   * Width in pixels of each waveform bar.\n   */\n  resolution?: number;\n\n  /**\n   * Whether to show timestamp markers.\n   */\n  showTimestamps?: boolean;\n\n  /**\n   * Start time to display from in seconds.\n   */\n  startDuration?: number;\n\n  /**\n   * Total duration of the audio in seconds.\n   */\n  totalDuration: number;\n}\n\nconst sampleWaveform = generateSampleWaveformData(100);\n\n/**\n * A waveform visualization component that displays audio data with interactive features.\n *\n * API:\n *  - {@link WaveformProps}\n */\nexport function Waveform({\n  data: waveformData,\n  resolution = 2,\n  startDuration,\n  endDuration,\n  currentTime = 0,\n  showTimestamps = false,\n  totalDuration,\n  disabled,\n  disabledMessage,\n  onClick,\n  \"data-testid\": testId,\n}: WaveformProps) {\n  const { className } = useTheme();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [processedWaveform, setProcessedWaveform] = useState<number[]>([]);\n  const [hoverPosition, setHoverPosition] = useState<number | null>(null);\n  const [isVisible, setIsVisible] = useState(false);\n  const [hasAnimated, setHasAnimated] = useState(false);\n\n  const waveform = waveformData || sampleWaveform;\n\n  const spacing = resolution;\n\n  useEffect(() => {\n    if (!containerRef.current) return;\n\n    const processWaveform = (width: number) => {\n      const numBars = Math.floor(width / (resolution + spacing));\n      const processed = resampleData(waveform, numBars);\n      setProcessedWaveform(processed);\n    };\n\n    const initialWidth = containerRef.current.clientWidth;\n    processWaveform(initialWidth);\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      if (entries && entries[0]) {\n        processWaveform(entries[0].contentRect.width);\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    return () => resizeObserver.disconnect();\n  }, [waveform, resolution, spacing]);\n\n  useEffect(() => {\n    const visibilityTimer = setTimeout(() => setIsVisible(true), 50);\n    const animationTimer = setTimeout(() => setHasAnimated(true), 500);\n\n    return () => {\n      clearTimeout(visibilityTimer);\n      clearTimeout(animationTimer);\n    };\n  }, []);\n\n  const handleMouseMove = (e: React.MouseEvent<HTMLDivElement>) => {\n    if (!containerRef.current) return;\n    const rect = containerRef.current.getBoundingClientRect();\n    const x = e.clientX - rect.left;\n    const position = (x / rect.width) * totalDuration;\n    setHoverPosition(position);\n  };\n\n  const handleMouseLeave = () => {\n    setHoverPosition(null);\n  };\n\n  // Calculate the width of a single bar including spacing\n  const barTotalWidth = resolution + spacing;\n\n  // Find the nearest bar boundaries for start and end durations\n  const getBarPosition = (time: number, direction: \"start\" | \"end\") => {\n    const position = (time / totalDuration) * 100;\n    const barIndex =\n      direction === \"start\"\n        ? Math.floor((position / 100) * processedWaveform.length)\n        : Math.ceil((position / 100) * processedWaveform.length);\n\n    return (\n      ((barIndex * barTotalWidth) / containerRef.current?.clientWidth!) * 100\n    );\n  };\n\n  const containerWidth = containerRef.current?.clientWidth;\n  const waveformMessage = useMemo(() => {\n    if (disabled && disabledMessage) return disabledMessage;\n    if (!waveformData) return \"Waveform Unavailable\";\n\n    return null;\n  }, [disabled, disabledMessage, waveformData]);\n\n  return (\n    <div className={csx(\"proton-Waveform\", className)} data-testid={testId}>\n      {showTimestamps && (\n        <TimestampBlock direction=\"left\" seconds={currentTime} />\n      )}\n      <div\n        ref={containerRef}\n        className=\"proton-Waveform__container\"\n        onMouseMove={handleMouseMove}\n        onMouseLeave={handleMouseLeave}\n        onClick={(e) => {\n          if (!containerRef.current || disabled) return;\n          const rect = containerRef.current.getBoundingClientRect();\n          const x = e.clientX - rect.left;\n          const position = (x / rect.width) * totalDuration;\n          onClick?.(position, e);\n        }}\n        data-disabled={disabled}\n        data-testid=\"waveform-container\"\n      >\n        {startDuration !== undefined && endDuration !== undefined && (\n          <div\n            className=\"proton-Waveform__active-region\"\n            style={{\n              left: containerRef.current\n                ? `calc(${getBarPosition(startDuration, \"start\")}%`\n                : \"0%\",\n              right: containerRef.current\n                ? `calc(${100 - getBarPosition(endDuration, \"end\")}% - 2px)`\n                : \"0%\",\n            }}\n          />\n        )}\n        {hoverPosition !== null && (\n          <div\n            className=\"proton-Waveform__hover-line\"\n            style={{\n              left: `${(hoverPosition / totalDuration) * 100}%`,\n            }}\n          />\n        )}\n        {processedWaveform.map((amplitude, index) => {\n          const position = (index / processedWaveform.length) * totalDuration;\n          const isBarOutsideActiveRegion =\n            startDuration !== undefined &&\n            endDuration !== undefined &&\n            (position < startDuration || position > endDuration);\n          const isPlayed = currentTime === 0 ? false : position <= currentTime;\n          const isHovered = hoverPosition !== null && position <= hoverPosition;\n\n          return (\n            <WaveformBar\n              key={index}\n              amplitude={amplitude}\n              isDisabled={disabled || isBarOutsideActiveRegion}\n              isPlayed={isPlayed}\n              isHovered={isHovered}\n              isVisible={isVisible}\n              hasAnimated={hasAnimated}\n              resolution={resolution}\n              spacing={spacing}\n              index={index}\n            />\n          );\n        })}\n      </div>\n\n      {waveformMessage && (\n        <div\n          className=\"proton-Waveform__bar-unavailable\"\n          style={{\n            fontSize: containerWidth < 325 ? \"0.85rem\" : \"1rem\",\n          }}\n        >\n          {waveformMessage}\n        </div>\n      )}\n\n      {showTimestamps && (\n        <TimestampBlock direction=\"right\" seconds={totalDuration} />\n      )}\n    </div>\n  );\n}\n\nfunction TimestampBlock({\n  direction,\n  seconds,\n}: {\n  direction: \"left\" | \"right\";\n  seconds: number;\n}) {\n  return (\n    <div\n      className={csx(\n        \"proton-Waveform__timestamp\",\n        `proton-Waveform__timestamp--${direction}`\n      )}\n    >\n      {formatTimestamp(seconds)}\n    </div>\n  );\n}\n\n/** Formats seconds into MM:SS timestamp string\n * @param {number} seconds - Number of seconds to format\n * @returns {string} Formatted timestamp string in MM:SS format\n */\n\nfunction formatTimestamp(seconds: number) {\n  const minutes = Math.floor(seconds / 60);\n  const remainingSeconds = Math.floor(seconds % 60);\n  return `${minutes}:${\n    remainingSeconds < 10 ? \"0\" : \"\"\n  }${remainingSeconds.toFixed(0)}`;\n}\n\n/** Takes an array of waveform data and rescales it to any length\n * @param {array} initialData - original waveform data\n * @param {number} finalArrayLength - How long do you want the returned array?\n * @param {number} height - Height of the waveform container\n */\n\nfunction resampleData(initialData: number[], finalArrayLength: number) {\n  const initialArrayLength = initialData.length;\n  // How many samples from the original data do we skip per new sample?\n  const step = initialArrayLength / finalArrayLength;\n\n  // Create new array with desired length\n  const resampledData = new Array(finalArrayLength)\n    .fill(0)\n    .map((_, newIndex) => {\n      // Calculate position in original array\n      const position = newIndex * step;\n      const leftIndex = Math.floor(position);\n      const rightIndex = Math.min(leftIndex + 1, initialArrayLength - 1);\n\n      // Calculate weights for interpolation\n      const fraction = position - leftIndex;\n\n      // Linear interpolation between adjacent samples\n      const newVal =\n        initialData[leftIndex] * (1 - fraction) +\n        initialData[rightIndex] * fraction;\n\n      return newVal;\n    });\n\n  return scaleData(resampledData);\n}\n\n/** Takes an array of waveform data and scales it based on the desired pixel height\n * @param {array} data – Array of waveform data\n * @param {number} height - Height of the waveform container\n */\nfunction scaleData(data: number[]) {\n  const min = Math.min(...data);\n  const max = Math.max(...data);\n\n  return data.map((item) => {\n    // Normalize to 0-1 range first\n    const normalized = (item - min) / (max - min);\n    // Then scale to desired height (using 0.1 as minimum to ensure visibility)\n    return Math.max(normalized * 0.8 + 0.1, 0.1);\n  });\n}\n\n/** Generates a sample sine wave waveform data array\n * @param {number} length - Length of the waveform data array\n * @returns {number[]} Array of normalized amplitude values (0-1) representing the waveform\n */\n\nfunction generateSampleWaveformData(length: number) {\n  return Array.from({ length }, (_, i) => {\n    const cycles = 6;\n    // Create 3 complete cycles (6π total) starting at -π/2 (trough)\n    const phase = (i / (length - 1)) * cycles * 2 * Math.PI - Math.PI / 2;\n    return Math.sin(phase) * 0.5 + 0.5;\n  });\n}\n"],"names":["sampleWaveform","generateSampleWaveformData","Waveform","waveformData","resolution","startDuration","endDuration","currentTime","showTimestamps","totalDuration","disabled","disabledMessage","onClick","testId","className","useTheme","containerRef","useRef","processedWaveform","setProcessedWaveform","useState","hoverPosition","setHoverPosition","isVisible","setIsVisible","hasAnimated","setHasAnimated","waveform","spacing","useEffect","processWaveform","width","numBars","processed","resampleData","initialWidth","resizeObserver","entries","visibilityTimer","animationTimer","handleMouseMove","e","rect","position","handleMouseLeave","barTotalWidth","getBarPosition","time","direction","_a","containerWidth","waveformMessage","useMemo","jsxs","csx","jsx","TimestampBlock","amplitude","index","isBarOutsideActiveRegion","isPlayed","isHovered","WaveformBar","seconds","formatTimestamp","minutes","remainingSeconds","initialData","finalArrayLength","initialArrayLength","step","resampledData","_","newIndex","leftIndex","rightIndex","fraction","scaleData","data","min","max","item","normalized","length","i","phase"],"mappings":"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"}