@frontify/fondue-components 19.1.0 → 19.3.0

package/dist/fondue-components70.js

@@ -1,16 +1,14 @@
-import { useEffect as c } from "react";
-const s = (t) => {
-  c(() => {
-    if (!t.current)
-      return;
-    const e = t.current, n = new ResizeObserver(() => {
-      const r = e.scrollWidth > e.clientWidth;
-      e.title = r && e.textContent || "";
-    });
-    return n.observe(e), () => n.disconnect();
-  }, [t]);
+const t = "_root_fs3zj_5", o = "_thumb_fs3zj_17", s = "_track_fs3zj_21", _ = "_range_fs3zj_28", r = {
+  root: t,
+  thumb: o,
+  track: s,
+  range: _
 };
 export {
-  s as useTextTruncation
+  r as default,
+  _ as range,
+  t as root,
+  o as thumb,
+  s as track
 };
 //# sourceMappingURL=fondue-components70.js.map

package/dist/fondue-components70.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components70.js","sources":["../src/hooks/useTextTruncation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useEffect, type RefObject } from 'react';\n\n/**\n * A custom React hook that automatically manages text truncation and tooltips.\n * It observes the element's size and adds a title attribute with the full text\n * when the content is truncated.\n *\n * @param {RefObject<HTMLElement>} ref - Reference to the HTML element to observe for truncation.\n *\n * @example\n * ```tsx\n * const MyComponent = () => {\n *   const textRef = useRef<HTMLDivElement>(null);\n *   useTextTruncation(textRef);\n *\n *   return <div ref={textRef} className=\"truncate\">Long text content...</div>;\n * });\n * ```\n */\nexport const useTextTruncation = (ref: RefObject<HTMLElement>) => {\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        const element = ref.current;\n        const observer = new ResizeObserver(() => {\n            const isTruncated = element.scrollWidth > element.clientWidth;\n            element.title = isTruncated ? element.textContent || '' : '';\n        });\n\n        observer.observe(element);\n        return () => observer.disconnect();\n    }, [ref]);\n};\n"],"names":["useTextTruncation","ref","useEffect","element","observer","isTruncated"],"mappings":";AAqBa,MAAAA,IAAoB,CAACC,MAAgC;AAC9D,EAAAC,EAAU,MAAM;AACR,QAAA,CAACD,EAAI;AACL;AAGJ,UAAME,IAAUF,EAAI,SACdG,IAAW,IAAI,eAAe,MAAM;AAChC,YAAAC,IAAcF,EAAQ,cAAcA,EAAQ;AAClD,MAAAA,EAAQ,QAAQE,KAAcF,EAAQ,eAAe;AAAA,IAAK,CAC7D;AAED,WAAAC,EAAS,QAAQD,CAAO,GACjB,MAAMC,EAAS,WAAW;AAAA,EAAA,GAClC,CAACH,CAAG,CAAC;AACZ;"}
+{"version":3,"file":"fondue-components70.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/fondue-components71.js

@@ -1,24 +1,16 @@
-const t = "_table_1outv_4", o = "_headerCell_1outv_18", e = "_rowCell_1outv_19", _ = "_caption_1outv_46", n = "_cellContent_1outv_71", l = "_sortIndicator_1outv_96", c = "_body_1outv_100", r = "_row_1outv_19", s = "_buttonText_1outv_164", a = {
-  table: t,
-  headerCell: o,
-  rowCell: e,
-  caption: _,
-  cellContent: n,
-  sortIndicator: l,
-  body: c,
-  row: r,
-  buttonText: s
+const t = "_root_1g6pz_5", _ = "_small_1g6pz_16", o = "_medium_1g6pz_20", m = "_large_1g6pz_24", s = "_thumb_1g6pz_61", l = {
+  root: t,
+  small: _,
+  medium: o,
+  large: m,
+  thumb: s
 };
 export {
-  c as body,
-  s as buttonText,
-  _ as caption,
-  n as cellContent,
-  a as default,
-  o as headerCell,
-  r as row,
-  e as rowCell,
-  l as sortIndicator,
-  t as table
+  l as default,
+  m as large,
+  o as medium,
+  t as root,
+  _ as small,
+  s as thumb
 };
 //# sourceMappingURL=fondue-components71.js.map

package/dist/fondue-components71.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components71.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
+{"version":3,"file":"fondue-components71.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/fondue-components72.js

@@ -1,32 +1,16 @@
-function c(t, e) {
-  const n = 'tr[tabindex="0"]', r = t.closest("table");
-  if (!r)
-    return null;
-  const o = Array.from(r.querySelectorAll(n)), l = o.indexOf(t) + (e === "ArrowUp" ? -1 : 1);
-  return l >= 0 && l < o.length ? o[l] : null;
-}
-function a(t) {
-  const e = t.target, n = e.closest("tr");
-  if (!n || e !== n || !["ArrowUp", "ArrowDown"].includes(t.key))
-    return;
-  const r = c(n, t.key);
-  r && (t.preventDefault(), r.focus());
-}
-const s = [HTMLButtonElement, HTMLAnchorElement], u = ["button", "link"];
-function f(t) {
-  let e = (t == null ? void 0 : t.target) instanceof Element ? t.target : null;
-  for (; e && !(e instanceof HTMLTableRowElement); ) {
-    if (s.some((r) => e instanceof r))
-      return !0;
-    const n = e.getAttribute("role");
-    if (n && u.includes(n))
-      return !0;
-    e = e.parentElement;
-  }
-  return !1;
-}
+import { useEffect as c } from "react";
+const s = (t) => {
+  c(() => {
+    if (!t.current)
+      return;
+    const e = t.current, n = new ResizeObserver(() => {
+      const r = e.scrollWidth > e.clientWidth;
+      e.title = r && e.textContent || "";
+    });
+    return n.observe(e), () => n.disconnect();
+  }, [t]);
+};
 export {
-  a as handleKeyDown,
-  f as isEventFromInteractiveElement
+  s as useTextTruncation
 };
 //# sourceMappingURL=fondue-components72.js.map

package/dist/fondue-components72.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components72.js","sources":["../src/components/Table/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type KeyboardEvent, type MouseEvent } from 'react';\n\nfunction getAdjacentRow(currentRow: HTMLElement, key: 'ArrowUp' | 'ArrowDown'): HTMLElement | null {\n    const selector = 'tr[tabindex=\"0\"]';\n    const table = currentRow.closest('table');\n    if (!table) {\n        return null;\n    }\n\n    const rows = Array.from(table.querySelectorAll(selector));\n    const currentIndex = rows.indexOf(currentRow);\n    const nextIndex = currentIndex + (key === 'ArrowUp' ? -1 : 1);\n\n    return nextIndex >= 0 && nextIndex < rows.length ? (rows[nextIndex] as HTMLElement) : null;\n}\n\nexport function handleKeyDown(event: KeyboardEvent<HTMLTableElement>) {\n    const target = event.target as HTMLElement;\n    const currentRow = target.closest('tr');\n\n    if (!currentRow || target !== currentRow || !['ArrowUp', 'ArrowDown'].includes(event.key)) {\n        return;\n    }\n\n    const nextRow = getAdjacentRow(currentRow, event.key as 'ArrowUp' | 'ArrowDown');\n    if (nextRow) {\n        event.preventDefault();\n        nextRow.focus();\n    }\n}\n\nconst INTERACTIVE_ELEMENTS_LIST = [HTMLButtonElement, HTMLAnchorElement];\nconst INTERACTIVE_ROLES_LIST = ['button', 'link'];\n\nexport function isEventFromInteractiveElement(event?: MouseEvent): boolean {\n    let node = event?.target instanceof Element ? event.target : null;\n\n    while (node && !(node instanceof HTMLTableRowElement)) {\n        if (INTERACTIVE_ELEMENTS_LIST.some((interactiveElement) => node instanceof interactiveElement)) {\n            return true;\n        }\n\n        const role = node.getAttribute('role');\n        if (role && INTERACTIVE_ROLES_LIST.includes(role)) {\n            return true;\n        }\n\n        node = node.parentElement;\n    }\n\n    return false;\n}\n"],"names":["getAdjacentRow","currentRow","key","selector","table","rows","nextIndex","handleKeyDown","event","target","nextRow","INTERACTIVE_ELEMENTS_LIST","INTERACTIVE_ROLES_LIST","isEventFromInteractiveElement","node","interactiveElement","role"],"mappings":"AAIA,SAASA,EAAeC,GAAyBC,GAAkD;AAC/F,QAAMC,IAAW,oBACXC,IAAQH,EAAW,QAAQ,OAAO;AACxC,MAAI,CAACG;AACM,WAAA;AAGX,QAAMC,IAAO,MAAM,KAAKD,EAAM,iBAAiBD,CAAQ,CAAC,GAElDG,IADeD,EAAK,QAAQJ,CAAU,KACVC,MAAQ,YAAY,KAAK;AAE3D,SAAOI,KAAa,KAAKA,IAAYD,EAAK,SAAUA,EAAKC,CAAS,IAAoB;AAC1F;AAEO,SAASC,EAAcC,GAAwC;AAClE,QAAMC,IAASD,EAAM,QACfP,IAAaQ,EAAO,QAAQ,IAAI;AAEtC,MAAI,CAACR,KAAcQ,MAAWR,KAAc,CAAC,CAAC,WAAW,WAAW,EAAE,SAASO,EAAM,GAAG;AACpF;AAGJ,QAAME,IAAUV,EAAeC,GAAYO,EAAM,GAA8B;AAC/E,EAAIE,MACAF,EAAM,eAAe,GACrBE,EAAQ,MAAM;AAEtB;AAEA,MAAMC,IAA4B,CAAC,mBAAmB,iBAAiB,GACjEC,IAAyB,CAAC,UAAU,MAAM;AAEzC,SAASC,EAA8BL,GAA6B;AACvE,MAAIM,KAAON,KAAA,gBAAAA,EAAO,mBAAkB,UAAUA,EAAM,SAAS;AAEtD,SAAAM,KAAQ,EAAEA,aAAgB,wBAAsB;AACnD,QAAIH,EAA0B,KAAK,CAACI,MAAuBD,aAAgBC,CAAkB;AAClF,aAAA;AAGL,UAAAC,IAAOF,EAAK,aAAa,MAAM;AACrC,QAAIE,KAAQJ,EAAuB,SAASI,CAAI;AACrC,aAAA;AAGX,IAAAF,IAAOA,EAAK;AAAA,EAAA;AAGT,SAAA;AACX;"}
+{"version":3,"file":"fondue-components72.js","sources":["../src/hooks/useTextTruncation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useEffect, type RefObject } from 'react';\n\n/**\n * A custom React hook that automatically manages text truncation and tooltips.\n * It observes the element's size and adds a title attribute with the full text\n * when the content is truncated.\n *\n * @param {RefObject<HTMLElement>} ref - Reference to the HTML element to observe for truncation.\n *\n * @example\n * ```tsx\n * const MyComponent = () => {\n *   const textRef = useRef<HTMLDivElement>(null);\n *   useTextTruncation(textRef);\n *\n *   return <div ref={textRef} className=\"truncate\">Long text content...</div>;\n * });\n * ```\n */\nexport const useTextTruncation = (ref: RefObject<HTMLElement>) => {\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        const element = ref.current;\n        const observer = new ResizeObserver(() => {\n            const isTruncated = element.scrollWidth > element.clientWidth;\n            element.title = isTruncated ? element.textContent || '' : '';\n        });\n\n        observer.observe(element);\n        return () => observer.disconnect();\n    }, [ref]);\n};\n"],"names":["useTextTruncation","ref","useEffect","element","observer","isTruncated"],"mappings":";AAqBO,MAAMA,IAAoB,CAACC,MAAgC;AAC9D,EAAAC,EAAU,MAAM;AACZ,QAAI,CAACD,EAAI;AACL;AAGJ,UAAME,IAAUF,EAAI,SACdG,IAAW,IAAI,eAAe,MAAM;AACtC,YAAMC,IAAcF,EAAQ,cAAcA,EAAQ;AAClD,MAAAA,EAAQ,QAAQE,KAAcF,EAAQ,eAAe;AAAA,IACzD,CAAC;AAED,WAAAC,EAAS,QAAQD,CAAO,GACjB,MAAMC,EAAS,WAAA;AAAA,EAC1B,GAAG,CAACH,CAAG,CAAC;AACZ;"}

package/dist/fondue-components73.js

@@ -1,59 +1,24 @@
-import { useRef as v, useState as w, useEffect as W, useLayoutEffect as p } from "react";
-const T = (e, s) => e.filter((f) => {
-  var c;
-  const o = (c = f.ref) == null ? void 0 : c.current;
-  return o ? o.offsetLeft + o.offsetWidth > (s == null ? void 0 : s.scrollLeft) + s.offsetWidth || o.offsetLeft - s.scrollLeft < 0 : !1;
-}), u = (e, s) => {
-  const f = s.current, o = e == null ? void 0 : e.querySelector('[data-state="active"]');
-  if (!e || !(o instanceof HTMLButtonElement) || !(f instanceof HTMLSpanElement))
-    return;
-  const c = (e == null ? void 0 : e.scrollLeft) > (o == null ? void 0 : o.offsetLeft), l = (o == null ? void 0 : o.offsetLeft) + (o == null ? void 0 : o.offsetWidth) > (e == null ? void 0 : e.offsetWidth);
-  c ? (e.offsetWidth > o.offsetWidth + o.offsetLeft ? f.style.left = `${o.offsetLeft}px` : f.style.left = `${e.offsetWidth - o.offsetWidth}px`, f.style.width = `${o == null ? void 0 : o.offsetWidth}px`) : l ? (f.style.left = `${e.clientWidth - o.offsetWidth}px`, f.style.width = `${o.offsetWidth}px`) : (f.style.left = `${o.offsetLeft}px`, f.style.width = `${o.offsetWidth}px`);
-}, O = ({
-  activeTab: e
-}) => {
-  const s = v(null), f = v(null), [o, c] = w([]), [l, i] = w([]);
-  return W(() => {
-    const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
-    n instanceof HTMLButtonElement && t instanceof HTMLDivElement && (u(t, f), n.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "end" }));
-  }, [e, f]), p(() => {
-    var d;
-    const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
-    if (t instanceof HTMLDivElement && n instanceof HTMLButtonElement) {
-      u(t, f);
-      const a = new MutationObserver(() => {
-        n.scrollIntoView({ behavior: "instant", block: "nearest", inline: "end" }), u(t, f);
-      });
-      t.parentNode && a.observe(t.parentNode, { childList: !0 });
-      const r = new IntersectionObserver(
-        () => {
-          i(T(o, t)), u(t, f);
-        },
-        {
-          root: t,
-          threshold: 1
-        }
-      );
-      for (const h of o)
-        (d = h.ref) != null && d.current && r.observe(h.ref.current);
-      return () => {
-        r.disconnect(), a.disconnect();
-      };
-    }
-  }, [o, s, f]), {
-    triggerListRef: s,
-    activeIndicatorRef: f,
-    triggersOutOfView: l,
-    triggers: o,
-    addTrigger: (t) => {
-      t.previousElement || c((n) => [...n, t]), c((n) => {
-        const d = n.findIndex((a) => a.element === t.previousElement);
-        return n[d] = t, [...n];
-      });
-    }
-  };
+const t = "_table_1outv_4", o = "_headerCell_1outv_18", e = "_rowCell_1outv_19", _ = "_caption_1outv_46", n = "_cellContent_1outv_71", l = "_sortIndicator_1outv_96", c = "_body_1outv_100", r = "_row_1outv_19", s = "_buttonText_1outv_164", a = {
+  table: t,
+  headerCell: o,
+  rowCell: e,
+  caption: _,
+  cellContent: n,
+  sortIndicator: l,
+  body: c,
+  row: r,
+  buttonText: s
 };
 export {
-  O as useTabTriggers
+  c as body,
+  s as buttonText,
+  _ as caption,
+  n as cellContent,
+  a as default,
+  o as headerCell,
+  r as row,
+  e as rowCell,
+  l as sortIndicator,
+  t as table
 };
 //# sourceMappingURL=fondue-components73.js.map

package/dist/fondue-components73.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components73.js","sources":["../src/components/Tabs/hooks/useTabTriggers.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { type TabTrigger } from '../types';\n\nconst getOverflowingTriggers = (triggers: TabTrigger[], triggerListElement: HTMLDivElement) => {\n    return triggers.filter((trigger) => {\n        const triggerElement = trigger.ref?.current;\n        if (!triggerElement) {\n            return false;\n        }\n        return (\n            triggerElement.offsetLeft + triggerElement.offsetWidth >\n                triggerListElement?.scrollLeft + triggerListElement.offsetWidth ||\n            triggerElement.offsetLeft - triggerListElement.scrollLeft < 0\n        );\n    });\n};\n\nconst moveActiveIndicator = (triggerListElement: HTMLDivElement, activeIndicatorRef: RefObject<HTMLSpanElement>) => {\n    const activeIndicatorElement = activeIndicatorRef.current;\n    const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n    if (\n        !triggerListElement ||\n        !(activeTriggerElement instanceof HTMLButtonElement) ||\n        !(activeIndicatorElement instanceof HTMLSpanElement)\n    ) {\n        return;\n    }\n\n    const isOverflowingLeft = triggerListElement?.scrollLeft > activeTriggerElement?.offsetLeft;\n    const isOverflowingRight =\n        activeTriggerElement?.offsetLeft + activeTriggerElement?.offsetWidth > triggerListElement?.offsetWidth;\n\n    if (isOverflowingLeft) {\n        const willFitAllItemsToTheLeft =\n            triggerListElement.offsetWidth > activeTriggerElement.offsetWidth + activeTriggerElement.offsetLeft;\n        if (willFitAllItemsToTheLeft) {\n            activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n        } else {\n            activeIndicatorElement.style.left = `${triggerListElement.offsetWidth - activeTriggerElement.offsetWidth}px`;\n        }\n        activeIndicatorElement.style.width = `${activeTriggerElement?.offsetWidth}px`;\n    } else if (isOverflowingRight) {\n        activeIndicatorElement.style.left = `${triggerListElement.clientWidth - activeTriggerElement.offsetWidth}px`;\n        activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n    } else {\n        activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n        activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n    }\n};\n\nexport const useTabTriggers = ({\n    activeTab,\n}: {\n    activeTab?: string;\n}): {\n    triggerListRef: RefObject<HTMLDivElement>;\n    activeIndicatorRef: RefObject<HTMLSpanElement>;\n    triggers: TabTrigger[];\n    triggersOutOfView: TabTrigger[];\n    addTrigger: (trigger: TabTrigger) => void;\n} => {\n    const triggerListRef = useRef<HTMLDivElement | null>(null);\n    const activeIndicatorRef = useRef<HTMLSpanElement | null>(null);\n    const [triggers, setTriggers] = useState<TabTrigger[]>([]);\n    const [triggersOutOfView, setTriggersOutOfView] = useState<TabTrigger[]>([]);\n\n    // move the active indicator and scroll to the correct position when the tab changes\n    useEffect(() => {\n        const triggerListElement = triggerListRef.current;\n        const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n        if (activeTriggerElement instanceof HTMLButtonElement && triggerListElement instanceof HTMLDivElement) {\n            moveActiveIndicator(triggerListElement, activeIndicatorRef);\n            activeTriggerElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end' });\n        }\n    }, [activeTab, activeIndicatorRef]);\n\n    useLayoutEffect(() => {\n        const triggerListElement = triggerListRef.current;\n        const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n        if (triggerListElement instanceof HTMLDivElement && activeTriggerElement instanceof HTMLButtonElement) {\n            // move the active indicator to the initial active tab\n            moveActiveIndicator(triggerListElement, activeIndicatorRef);\n\n            // observe addition of the dropdown trigger which reduces the available width\n            const mutationObserver = new MutationObserver(() => {\n                activeTriggerElement.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'end' });\n                moveActiveIndicator(triggerListElement, activeIndicatorRef);\n            });\n            if (triggerListElement.parentNode) {\n                mutationObserver.observe(triggerListElement.parentNode, { childList: true });\n            }\n\n            // calculate the overflowing elements when item starts overflowing the parent\n            const intersectionObserver = new IntersectionObserver(\n                () => {\n                    setTriggersOutOfView(getOverflowingTriggers(triggers, triggerListElement));\n                    moveActiveIndicator(triggerListElement, activeIndicatorRef);\n                },\n                {\n                    root: triggerListElement,\n                    threshold: 1,\n                },\n            );\n            for (const trigger of triggers) {\n                if (trigger.ref?.current) {\n                    intersectionObserver.observe(trigger.ref.current);\n                }\n            }\n\n            return () => {\n                intersectionObserver.disconnect();\n                mutationObserver.disconnect();\n            };\n        }\n    }, [triggers, triggerListRef, activeIndicatorRef]);\n\n    const addTrigger = (trigger: TabTrigger) => {\n        if (!trigger.previousElement) {\n            setTriggers((prev) => [...prev, trigger]);\n        }\n\n        setTriggers((prev) => {\n            const index = prev.findIndex((element) => element.element === trigger.previousElement);\n            prev[index] = trigger;\n            return [...prev];\n        });\n    };\n\n    return {\n        triggerListRef,\n        activeIndicatorRef,\n        triggersOutOfView,\n        triggers,\n        addTrigger,\n    };\n};\n"],"names":["getOverflowingTriggers","triggers","triggerListElement","trigger","triggerElement","_a","moveActiveIndicator","activeIndicatorRef","activeIndicatorElement","activeTriggerElement","isOverflowingLeft","isOverflowingRight","useTabTriggers","activeTab","triggerListRef","useRef","setTriggers","useState","triggersOutOfView","setTriggersOutOfView","useEffect","useLayoutEffect","mutationObserver","intersectionObserver","prev","index","element"],"mappings":"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"}
+{"version":3,"file":"fondue-components73.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/dist/fondue-components74.js

@@ -1,18 +1,37 @@
-const t = "_triggerListWrapper_chl5v_5", r = "_trigger_chl5v_5", c = "_activeIndicator_chl5v_53", e = "_triggerList_chl5v_5", i = "_root_chl5v_143", o = "_content_chl5v_166", g = {
-  triggerListWrapper: t,
-  trigger: r,
-  activeIndicator: c,
-  triggerList: e,
-  root: i,
-  content: o
-};
+function s(e, n) {
+  const r = 'tr[tabindex="0"]', t = e.closest("table");
+  if (!t)
+    return null;
+  const o = Array.from(t.querySelectorAll(r)), l = o.indexOf(e) + (n === "ArrowUp" ? -1 : 1);
+  return l >= 0 && l < o.length ? o[l] : null;
+}
+function a(e) {
+  const n = e.target, r = n.closest("tr");
+  if (!r || n !== r || !["ArrowUp", "ArrowDown"].includes(e.key))
+    return;
+  const t = s(r, e.key);
+  t && (e.preventDefault(), t.focus());
+}
+const u = [HTMLButtonElement, HTMLAnchorElement], i = ["button", "link"];
+function f(e) {
+  if (!e)
+    return !1;
+  const { target: n, currentTarget: r } = e;
+  let t = n instanceof Element ? n : null;
+  if (!r.contains(t))
+    return !0;
+  for (; t && !(t instanceof HTMLTableRowElement); ) {
+    if (u.some((c) => t instanceof c))
+      return !0;
+    const o = t.getAttribute("role");
+    if (o && i.includes(o))
+      return !0;
+    t = t.parentElement;
+  }
+  return !1;
+}
 export {
-  c as activeIndicator,
-  o as content,
-  g as default,
-  i as root,
-  r as trigger,
-  e as triggerList,
-  t as triggerListWrapper
+  a as handleKeyDown,
+  f as shouldIgnoreRowClick
 };
 //# sourceMappingURL=fondue-components74.js.map

package/dist/fondue-components74.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components74.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
+{"version":3,"file":"fondue-components74.js","sources":["../src/components/Table/utils.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type KeyboardEvent, type MouseEvent } from 'react';\n\nfunction getAdjacentRow(currentRow: HTMLElement, key: 'ArrowUp' | 'ArrowDown'): HTMLElement | null {\n    const selector = 'tr[tabindex=\"0\"]';\n    const table = currentRow.closest('table');\n    if (!table) {\n        return null;\n    }\n\n    const rows = Array.from(table.querySelectorAll(selector));\n    const currentIndex = rows.indexOf(currentRow);\n    const nextIndex = currentIndex + (key === 'ArrowUp' ? -1 : 1);\n\n    return nextIndex >= 0 && nextIndex < rows.length ? (rows[nextIndex] as HTMLElement) : null;\n}\n\nexport function handleKeyDown(event: KeyboardEvent<HTMLTableElement>) {\n    const target = event.target as HTMLElement;\n    const currentRow = target.closest('tr');\n\n    if (!currentRow || target !== currentRow || !['ArrowUp', 'ArrowDown'].includes(event.key)) {\n        return;\n    }\n\n    const nextRow = getAdjacentRow(currentRow, event.key as 'ArrowUp' | 'ArrowDown');\n    if (nextRow) {\n        event.preventDefault();\n        nextRow.focus();\n    }\n}\n\nconst INTERACTIVE_ELEMENTS_LIST = [HTMLButtonElement, HTMLAnchorElement];\nconst INTERACTIVE_ROLES_LIST = ['button', 'link'];\n\nexport function shouldIgnoreRowClick(event?: MouseEvent): boolean {\n    if (!event) {\n        return false;\n    }\n\n    const { target, currentTarget } = event;\n\n    let element = target instanceof Element ? target : null;\n\n    if (!currentTarget.contains(element)) {\n        return true;\n    }\n\n    while (element && !(element instanceof HTMLTableRowElement)) {\n        if (INTERACTIVE_ELEMENTS_LIST.some((interactiveElement) => element instanceof interactiveElement)) {\n            return true;\n        }\n\n        const role = element.getAttribute('role');\n        if (role && INTERACTIVE_ROLES_LIST.includes(role)) {\n            return true;\n        }\n\n        element = element.parentElement;\n    }\n\n    return false;\n}\n"],"names":["getAdjacentRow","currentRow","key","selector","table","rows","nextIndex","handleKeyDown","event","target","nextRow","INTERACTIVE_ELEMENTS_LIST","INTERACTIVE_ROLES_LIST","shouldIgnoreRowClick","currentTarget","element","interactiveElement","role"],"mappings":"AAIA,SAASA,EAAeC,GAAyBC,GAAkD;AAC/F,QAAMC,IAAW,oBACXC,IAAQH,EAAW,QAAQ,OAAO;AACxC,MAAI,CAACG;AACD,WAAO;AAGX,QAAMC,IAAO,MAAM,KAAKD,EAAM,iBAAiBD,CAAQ,CAAC,GAElDG,IADeD,EAAK,QAAQJ,CAAU,KACVC,MAAQ,YAAY,KAAK;AAE3D,SAAOI,KAAa,KAAKA,IAAYD,EAAK,SAAUA,EAAKC,CAAS,IAAoB;AAC1F;AAEO,SAASC,EAAcC,GAAwC;AAClE,QAAMC,IAASD,EAAM,QACfP,IAAaQ,EAAO,QAAQ,IAAI;AAEtC,MAAI,CAACR,KAAcQ,MAAWR,KAAc,CAAC,CAAC,WAAW,WAAW,EAAE,SAASO,EAAM,GAAG;AACpF;AAGJ,QAAME,IAAUV,EAAeC,GAAYO,EAAM,GAA8B;AAC/E,EAAIE,MACAF,EAAM,eAAA,GACNE,EAAQ,MAAA;AAEhB;AAEA,MAAMC,IAA4B,CAAC,mBAAmB,iBAAiB,GACjEC,IAAyB,CAAC,UAAU,MAAM;AAEzC,SAASC,EAAqBL,GAA6B;AAC9D,MAAI,CAACA;AACD,WAAO;AAGX,QAAM,EAAE,QAAAC,GAAQ,eAAAK,EAAA,IAAkBN;AAElC,MAAIO,IAAUN,aAAkB,UAAUA,IAAS;AAEnD,MAAI,CAACK,EAAc,SAASC,CAAO;AAC/B,WAAO;AAGX,SAAOA,KAAW,EAAEA,aAAmB,wBAAsB;AACzD,QAAIJ,EAA0B,KAAK,CAACK,MAAuBD,aAAmBC,CAAkB;AAC5F,aAAO;AAGX,UAAMC,IAAOF,EAAQ,aAAa,MAAM;AACxC,QAAIE,KAAQL,EAAuB,SAASK,CAAI;AAC5C,aAAO;AAGX,IAAAF,IAAUA,EAAQ;AAAA,EACtB;AAEA,SAAO;AACX;"}

package/dist/fondue-components75.js

@@ -1,29 +1,59 @@
-const o = "_root_1cjgh_2", _ = {
-  root: o,
-  "weight-default": "_weight-default_1cjgh_7",
-  "weight-strong": "_weight-strong_1cjgh_11",
-  "weight-x-strong": "_weight-x-strong_1cjgh_15",
-  "size-x-small": "_size-x-small_1cjgh_19",
-  "size-small": "_size-small_1cjgh_24",
-  "size-medium": "_size-medium_1cjgh_29",
-  "size-large": "_size-large_1cjgh_34",
-  "color-default": "_color-default_1cjgh_39",
-  "color-weak": "_color-weak_1cjgh_43",
-  "color-x-weak": "_color-x-weak_1cjgh_47",
-  "color-disabled": "_color-disabled_1cjgh_51",
-  "color-negative": "_color-negative_1cjgh_55",
-  "color-positive": "_color-positive_1cjgh_59",
-  "color-warning": "_color-warning_1cjgh_63",
-  "color-interactive": "_color-interactive_1cjgh_67",
-  "color-box-neutral": "_color-box-neutral_1cjgh_71",
-  "color-box-selected": "_color-box-selected_1cjgh_75",
-  "color-box-disabled": "_color-box-disabled_1cjgh_79",
-  "color-box-positive": "_color-box-positive_1cjgh_83",
-  "color-box-negative": "_color-box-negative_1cjgh_87",
-  "color-box-warning": "_color-box-warning_1cjgh_91"
+import { useRef as v, useState as w, useEffect as W, useLayoutEffect as p } from "react";
+const T = (e, s) => e.filter((f) => {
+  var c;
+  const o = (c = f.ref) == null ? void 0 : c.current;
+  return o ? o.offsetLeft + o.offsetWidth > (s == null ? void 0 : s.scrollLeft) + s.offsetWidth || o.offsetLeft - s.scrollLeft < 0 : !1;
+}), u = (e, s) => {
+  const f = s.current, o = e == null ? void 0 : e.querySelector('[data-state="active"]');
+  if (!e || !(o instanceof HTMLButtonElement) || !(f instanceof HTMLSpanElement))
+    return;
+  const c = (e == null ? void 0 : e.scrollLeft) > (o == null ? void 0 : o.offsetLeft), l = (o == null ? void 0 : o.offsetLeft) + (o == null ? void 0 : o.offsetWidth) > (e == null ? void 0 : e.offsetWidth);
+  c ? (e.offsetWidth > o.offsetWidth + o.offsetLeft ? f.style.left = `${o.offsetLeft}px` : f.style.left = `${e.offsetWidth - o.offsetWidth}px`, f.style.width = `${o == null ? void 0 : o.offsetWidth}px`) : l ? (f.style.left = `${e.clientWidth - o.offsetWidth}px`, f.style.width = `${o.offsetWidth}px`) : (f.style.left = `${o.offsetLeft}px`, f.style.width = `${o.offsetWidth}px`);
+}, O = ({
+  activeTab: e
+}) => {
+  const s = v(null), f = v(null), [o, c] = w([]), [l, i] = w([]);
+  return W(() => {
+    const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
+    n instanceof HTMLButtonElement && t instanceof HTMLDivElement && (u(t, f), n.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "end" }));
+  }, [e, f]), p(() => {
+    var d;
+    const t = s.current, n = t == null ? void 0 : t.querySelector('[data-state="active"]');
+    if (t instanceof HTMLDivElement && n instanceof HTMLButtonElement) {
+      u(t, f);
+      const a = new MutationObserver(() => {
+        n.scrollIntoView({ behavior: "instant", block: "nearest", inline: "end" }), u(t, f);
+      });
+      t.parentNode && a.observe(t.parentNode, { childList: !0 });
+      const r = new IntersectionObserver(
+        () => {
+          i(T(o, t)), u(t, f);
+        },
+        {
+          root: t,
+          threshold: 1
+        }
+      );
+      for (const h of o)
+        (d = h.ref) != null && d.current && r.observe(h.ref.current);
+      return () => {
+        r.disconnect(), a.disconnect();
+      };
+    }
+  }, [o, s, f]), {
+    triggerListRef: s,
+    activeIndicatorRef: f,
+    triggersOutOfView: l,
+    triggers: o,
+    addTrigger: (t) => {
+      t.previousElement || c((n) => [...n, t]), c((n) => {
+        const d = n.findIndex((a) => a.element === t.previousElement);
+        return n[d] = t, [...n];
+      });
+    }
+  };
 };
 export {
-  _ as default,
-  o as root
+  O as useTabTriggers
 };
 //# sourceMappingURL=fondue-components75.js.map

package/dist/fondue-components75.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components75.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"fondue-components75.js","sources":["../src/components/Tabs/hooks/useTabTriggers.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type RefObject, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { type TabTrigger } from '../types';\n\nconst getOverflowingTriggers = (triggers: TabTrigger[], triggerListElement: HTMLDivElement) => {\n    return triggers.filter((trigger) => {\n        const triggerElement = trigger.ref?.current;\n        if (!triggerElement) {\n            return false;\n        }\n        return (\n            triggerElement.offsetLeft + triggerElement.offsetWidth >\n                triggerListElement?.scrollLeft + triggerListElement.offsetWidth ||\n            triggerElement.offsetLeft - triggerListElement.scrollLeft < 0\n        );\n    });\n};\n\nconst moveActiveIndicator = (triggerListElement: HTMLDivElement, activeIndicatorRef: RefObject<HTMLSpanElement>) => {\n    const activeIndicatorElement = activeIndicatorRef.current;\n    const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n    if (\n        !triggerListElement ||\n        !(activeTriggerElement instanceof HTMLButtonElement) ||\n        !(activeIndicatorElement instanceof HTMLSpanElement)\n    ) {\n        return;\n    }\n\n    const isOverflowingLeft = triggerListElement?.scrollLeft > activeTriggerElement?.offsetLeft;\n    const isOverflowingRight =\n        activeTriggerElement?.offsetLeft + activeTriggerElement?.offsetWidth > triggerListElement?.offsetWidth;\n\n    if (isOverflowingLeft) {\n        const willFitAllItemsToTheLeft =\n            triggerListElement.offsetWidth > activeTriggerElement.offsetWidth + activeTriggerElement.offsetLeft;\n        if (willFitAllItemsToTheLeft) {\n            activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n        } else {\n            activeIndicatorElement.style.left = `${triggerListElement.offsetWidth - activeTriggerElement.offsetWidth}px`;\n        }\n        activeIndicatorElement.style.width = `${activeTriggerElement?.offsetWidth}px`;\n    } else if (isOverflowingRight) {\n        activeIndicatorElement.style.left = `${triggerListElement.clientWidth - activeTriggerElement.offsetWidth}px`;\n        activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n    } else {\n        activeIndicatorElement.style.left = `${activeTriggerElement.offsetLeft}px`;\n        activeIndicatorElement.style.width = `${activeTriggerElement.offsetWidth}px`;\n    }\n};\n\nexport const useTabTriggers = ({\n    activeTab,\n}: {\n    activeTab?: string;\n}): {\n    triggerListRef: RefObject<HTMLDivElement>;\n    activeIndicatorRef: RefObject<HTMLSpanElement>;\n    triggers: TabTrigger[];\n    triggersOutOfView: TabTrigger[];\n    addTrigger: (trigger: TabTrigger) => void;\n} => {\n    const triggerListRef = useRef<HTMLDivElement | null>(null);\n    const activeIndicatorRef = useRef<HTMLSpanElement | null>(null);\n    const [triggers, setTriggers] = useState<TabTrigger[]>([]);\n    const [triggersOutOfView, setTriggersOutOfView] = useState<TabTrigger[]>([]);\n\n    // move the active indicator and scroll to the correct position when the tab changes\n    useEffect(() => {\n        const triggerListElement = triggerListRef.current;\n        const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n        if (activeTriggerElement instanceof HTMLButtonElement && triggerListElement instanceof HTMLDivElement) {\n            moveActiveIndicator(triggerListElement, activeIndicatorRef);\n            activeTriggerElement.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end' });\n        }\n    }, [activeTab, activeIndicatorRef]);\n\n    useLayoutEffect(() => {\n        const triggerListElement = triggerListRef.current;\n        const activeTriggerElement = triggerListElement?.querySelector('[data-state=\"active\"]');\n\n        if (triggerListElement instanceof HTMLDivElement && activeTriggerElement instanceof HTMLButtonElement) {\n            // move the active indicator to the initial active tab\n            moveActiveIndicator(triggerListElement, activeIndicatorRef);\n\n            // observe addition of the dropdown trigger which reduces the available width\n            const mutationObserver = new MutationObserver(() => {\n                activeTriggerElement.scrollIntoView({ behavior: 'instant', block: 'nearest', inline: 'end' });\n                moveActiveIndicator(triggerListElement, activeIndicatorRef);\n            });\n            if (triggerListElement.parentNode) {\n                mutationObserver.observe(triggerListElement.parentNode, { childList: true });\n            }\n\n            // calculate the overflowing elements when item starts overflowing the parent\n            const intersectionObserver = new IntersectionObserver(\n                () => {\n                    setTriggersOutOfView(getOverflowingTriggers(triggers, triggerListElement));\n                    moveActiveIndicator(triggerListElement, activeIndicatorRef);\n                },\n                {\n                    root: triggerListElement,\n                    threshold: 1,\n                },\n            );\n            for (const trigger of triggers) {\n                if (trigger.ref?.current) {\n                    intersectionObserver.observe(trigger.ref.current);\n                }\n            }\n\n            return () => {\n                intersectionObserver.disconnect();\n                mutationObserver.disconnect();\n            };\n        }\n    }, [triggers, triggerListRef, activeIndicatorRef]);\n\n    const addTrigger = (trigger: TabTrigger) => {\n        if (!trigger.previousElement) {\n            setTriggers((prev) => [...prev, trigger]);\n        }\n\n        setTriggers((prev) => {\n            const index = prev.findIndex((element) => element.element === trigger.previousElement);\n            prev[index] = trigger;\n            return [...prev];\n        });\n    };\n\n    return {\n        triggerListRef,\n        activeIndicatorRef,\n        triggersOutOfView,\n        triggers,\n        addTrigger,\n    };\n};\n"],"names":["getOverflowingTriggers","triggers","triggerListElement","trigger","triggerElement","_a","moveActiveIndicator","activeIndicatorRef","activeIndicatorElement","activeTriggerElement","isOverflowingLeft","isOverflowingRight","useTabTriggers","activeTab","triggerListRef","useRef","setTriggers","useState","triggersOutOfView","setTriggersOutOfView","useEffect","useLayoutEffect","mutationObserver","intersectionObserver","prev","index","element"],"mappings":"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"}

package/dist/fondue-components76.js

@@ -1,18 +1,18 @@
-const o = "_root_kjbh5_5", t = "_input_kjbh5_59", s = "_slot_kjbh5_82", c = "_iconSuccess_kjbh5_132", n = "_iconError_kjbh5_141", _ = "_loadingStatus_kjbh5_155", r = {
-  root: o,
-  input: t,
-  slot: s,
-  iconSuccess: c,
-  iconError: n,
-  loadingStatus: _
+const t = "_triggerListWrapper_chl5v_5", r = "_trigger_chl5v_5", c = "_activeIndicator_chl5v_53", e = "_triggerList_chl5v_5", i = "_root_chl5v_143", o = "_content_chl5v_166", g = {
+  triggerListWrapper: t,
+  trigger: r,
+  activeIndicator: c,
+  triggerList: e,
+  root: i,
+  content: o
 };
 export {
-  r as default,
-  n as iconError,
-  c as iconSuccess,
-  t as input,
-  _ as loadingStatus,
-  o as root,
-  s as slot
+  c as activeIndicator,
+  o as content,
+  g as default,
+  i as root,
+  r as trigger,
+  e as triggerList,
+  t as triggerListWrapper
 };
 //# sourceMappingURL=fondue-components76.js.map

package/dist/fondue-components77.js

@@ -1,10 +1,29 @@
-const t = "_dark_1mr83_1", r = "_light_1mr83_250", s = {
-  dark: t,
-  light: r
+const o = "_root_1cjgh_2", _ = {
+  root: o,
+  "weight-default": "_weight-default_1cjgh_7",
+  "weight-strong": "_weight-strong_1cjgh_11",
+  "weight-x-strong": "_weight-x-strong_1cjgh_15",
+  "size-x-small": "_size-x-small_1cjgh_19",
+  "size-small": "_size-small_1cjgh_24",
+  "size-medium": "_size-medium_1cjgh_29",
+  "size-large": "_size-large_1cjgh_34",
+  "color-default": "_color-default_1cjgh_39",
+  "color-weak": "_color-weak_1cjgh_43",
+  "color-x-weak": "_color-x-weak_1cjgh_47",
+  "color-disabled": "_color-disabled_1cjgh_51",
+  "color-negative": "_color-negative_1cjgh_55",
+  "color-positive": "_color-positive_1cjgh_59",
+  "color-warning": "_color-warning_1cjgh_63",
+  "color-interactive": "_color-interactive_1cjgh_67",
+  "color-box-neutral": "_color-box-neutral_1cjgh_71",
+  "color-box-selected": "_color-box-selected_1cjgh_75",
+  "color-box-disabled": "_color-box-disabled_1cjgh_79",
+  "color-box-positive": "_color-box-positive_1cjgh_83",
+  "color-box-negative": "_color-box-negative_1cjgh_87",
+  "color-box-warning": "_color-box-warning_1cjgh_91"
 };
 export {
-  t as dark,
-  s as default,
-  r as light
+  _ as default,
+  o as root
 };
 //# sourceMappingURL=fondue-components77.js.map

package/dist/fondue-components77.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components77.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"fondue-components77.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/fondue-components78.js

@@ -1,10 +1,18 @@
-const o = "_root_13m98_4", r = "_arrow_13m98_25", t = {
+const o = "_root_kjbh5_5", t = "_input_kjbh5_59", s = "_slot_kjbh5_82", c = "_iconSuccess_kjbh5_132", n = "_iconError_kjbh5_141", _ = "_loadingStatus_kjbh5_155", r = {
   root: o,
-  arrow: r
+  input: t,
+  slot: s,
+  iconSuccess: c,
+  iconError: n,
+  loadingStatus: _
 };
 export {
-  r as arrow,
-  t as default,
-  o as root
+  r as default,
+  n as iconError,
+  c as iconSuccess,
+  t as input,
+  _ as loadingStatus,
+  o as root,
+  s as slot
 };
 //# sourceMappingURL=fondue-components78.js.map

package/dist/fondue-components78.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components78.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"fondue-components78.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/fondue-components79.js

@@ -1,5 +1,26 @@
-const t = "focus-visible:tw-outline has-[[data-show-focus-ring=true]]:tw-outline tw-outline-4 tw-outline-offset-2 tw-outline-blue focus-visible:tw-outline-blue";
+const o = "_root_18lbr_5", t = "_textarea_18lbr_73", s = "_slot_18lbr_123", r = "_decorator_18lbr_137", _ = "_tools_18lbr_150", l = "_toolsButton_18lbr_162", c = "_success_18lbr_194", n = "_error_18lbr_198", e = "_loadingStatus_18lbr_202", a = "_spin_18lbr_1", b = {
+  root: o,
+  textarea: t,
+  slot: s,
+  decorator: r,
+  tools: _,
+  toolsButton: l,
+  success: c,
+  error: n,
+  loadingStatus: e,
+  spin: a
+};
 export {
-  t as FOCUS_OUTLINE
+  r as decorator,
+  b as default,
+  n as error,
+  e as loadingStatus,
+  o as root,
+  s as slot,
+  a as spin,
+  c as success,
+  t as textarea,
+  _ as tools,
+  l as toolsButton
 };
 //# sourceMappingURL=fondue-components79.js.map

package/dist/fondue-components79.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components79.js","sources":["../src/utilities/focusStyle.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nexport const FOCUS_OUTLINE =\n    'focus-visible:tw-outline has-[[data-show-focus-ring=true]]:tw-outline tw-outline-4 tw-outline-offset-2 tw-outline-blue focus-visible:tw-outline-blue'; // second declaration of tw-outline-blue is to assure that in firefox the outline isn't overriden by a global definition of :-moz-focusring which is coming from tailwinds normalization styling\n"],"names":["FOCUS_OUTLINE"],"mappings":"AAEO,MAAMA,IACT;"}
+{"version":3,"file":"fondue-components79.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/fondue-components8.js

@@ -1,11 +1,11 @@
 import { jsx as a } from "react/jsx-runtime";
 import { Slot as P } from "@radix-ui/react-slot";
 import { forwardRef as F, useState as y, useMemo as N, Children as I } from "react";
-import { ForwardedRefColorGradientInput as w } from "./fondue-components41.js";
-import { ForwardedRefColorPickerInput as h } from "./fondue-components42.js";
-import { ForwardedRefColorValueInput as G } from "./fondue-components43.js";
-import V from "./fondue-components44.js";
-import { DEFAULT_FORMAT as g, DEFAULT_COLOR as A, getColorWithName as s } from "./fondue-components45.js";
+import { ForwardedRefColorGradientInput as w } from "./fondue-components42.js";
+import { ForwardedRefColorPickerInput as h } from "./fondue-components43.js";
+import { ForwardedRefColorValueInput as G } from "./fondue-components44.js";
+import V from "./fondue-components45.js";
+import { DEFAULT_FORMAT as g, DEFAULT_COLOR as A, getColorWithName as s } from "./fondue-components46.js";
 const p = ({
   children: t,
   currentColor: r = A,

package/dist/fondue-components8.js.map

@@ -1 +1 @@
-{"version":3,"file":"fondue-components8.js","sources":["../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Slot as RadixSlot } from '@radix-ui/react-slot';\nimport { Children, forwardRef, useMemo, useState, type ForwardedRef, type ReactNode } from 'react';\n\nimport { ForwardedRefColorGradientInput } from './ColorGradientInput';\nimport { ForwardedRefColorPickerInput } from './ColorPickerInput';\nimport { ForwardedRefColorValueInput } from './ColorValueInput';\nimport styles from './styles/customColorPicker.module.scss';\nimport { type ColorFormat, type RgbaColor } from './types';\nimport { DEFAULT_COLOR, DEFAULT_FORMAT, getColorWithName } from './utils';\n\ntype ColorPickerProps = {\n    /**\n     * The children of the color picker component. This can contain multiple `ColorPicker.Values` or `ColorPicker.Gradient` components.\n     */\n    children?: ReactNode;\n    /**\n     * The active color in the color picker\n     */\n    currentColor?: RgbaColor;\n    /**\n     * Event handler called when the color changes\n     */\n    onColorChange?: (color: RgbaColor) => void;\n    /**\n     * The active color format in the color picker\n     */\n    currentFormat?: ColorFormat;\n    /**\n     * Event handler called when the color format changes\n     */\n    onFormatChange?: (format: ColorFormat) => void;\n    /**\n     * The default format to use for the color input when not controlled externally\n     * @default \"HEX\"\n     */\n    defaultFormat?: ColorFormat;\n    /**\n     * The test id of the color picker\n     */\n    'data-test-id'?: string;\n};\n\nexport const ColorPickerRoot = (\n    {\n        children,\n        currentColor = DEFAULT_COLOR,\n        onColorChange = () => {},\n        currentFormat,\n        onFormatChange = () => {},\n        defaultFormat = DEFAULT_FORMAT,\n        'data-test-id': dataTestId = 'color-picker-input',\n        ...props\n    }: ColorPickerProps,\n    forwardedRef: ForwardedRef<HTMLDivElement>,\n) => {\n    const [managedFormat, setManagedFormat] = useState<ColorFormat>(defaultFormat);\n    const activeFormat = useMemo(() => currentFormat ?? managedFormat, [currentFormat, managedFormat]);\n\n    return (\n        <div className={styles.root} data-picker-type=\"custom-color\" data-test-id={dataTestId} ref={forwardedRef}>\n            {Children.map(children, (child) => (\n                <ColorPickerSlot\n                    {...props}\n                    onColorChange={(color: RgbaColor) => {\n                        onColorChange(getColorWithName(color, activeFormat));\n                    }}\n                    currentColor={currentColor}\n                    currentFormat={activeFormat}\n                    setCurrentFormat={(currentFormat: ColorFormat) => {\n                        setManagedFormat(currentFormat);\n                        onFormatChange(currentFormat);\n                        onColorChange(getColorWithName(currentColor, currentFormat));\n                    }}\n                >\n                    {child}\n                </ColorPickerSlot>\n            ))}\n        </div>\n    );\n};\nColorPickerRoot.displayName = 'ColorPicker';\n\ntype ColorPickerSlotProps = ColorPickerProps & {\n    currentFormat?: ColorFormat;\n    setCurrentFormat?: (format: ColorFormat) => void;\n};\nconst ColorPickerSlot = ({ children, ...props }: ColorPickerSlotProps) => <RadixSlot {...props}>{children}</RadixSlot>;\n\nexport const ForwardedRefColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(ColorPickerRoot);\n\nexport const ColorPicker = {\n    Root: ForwardedRefColorPicker,\n    Values: ForwardedRefColorValueInput,\n    Gradient: ForwardedRefColorGradientInput,\n    Input: ForwardedRefColorPickerInput,\n};\n\nColorPicker.Root.displayName = 'ColorPicker.Root';\nColorPicker.Values.displayName = 'ColorPicker.Values';\nColorPicker.Gradient.displayName = 'ColorPicker.Gradient';\nColorPicker.Input.displayName = 'ColorPicker.Input';\n"],"names":["ColorPickerRoot","children","currentColor","DEFAULT_COLOR","onColorChange","currentFormat","onFormatChange","defaultFormat","DEFAULT_FORMAT","dataTestId","props","forwardedRef","managedFormat","setManagedFormat","useState","activeFormat","useMemo","jsx","styles","Children","child","ColorPickerSlot","color","getColorWithName","RadixSlot","ForwardedRefColorPicker","forwardRef","ColorPicker","ForwardedRefColorValueInput","ForwardedRefColorGradientInput","ForwardedRefColorPickerInput"],"mappings":";;;;;;;;AA4CO,MAAMA,IAAkB,CAC3B;AAAA,EACI,UAAAC;AAAA,EACA,cAAAC,IAAeC;AAAA,EACf,eAAAC,IAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAAC;AAAA,EACA,gBAAAC,IAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,eAAAC,IAAgBC;AAAA,EAChB,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAsBP,CAAa,GACvEQ,IAAeC,EAAQ,MAAMX,KAAiBO,GAAe,CAACP,GAAeO,CAAa,CAAC;AAEjG,SACK,gBAAAK,EAAA,OAAA,EAAI,WAAWC,EAAO,MAAM,oBAAiB,gBAAe,gBAAcT,GAAY,KAAKE,GACvF,UAAAQ,EAAS,IAAIlB,GAAU,CAACmB,MACrB,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACI,GAAGX;AAAA,MACJ,eAAe,CAACY,MAAqB;AACnB,QAAAlB,EAAAmB,EAAiBD,GAAOP,CAAY,CAAC;AAAA,MACvD;AAAA,MACA,cAAAb;AAAA,MACA,eAAea;AAAA,MACf,kBAAkB,CAACV,MAA+B;AAC9C,QAAAQ,EAAiBR,CAAa,GAC9BC,EAAeD,CAAa,GACdD,EAAAmB,EAAiBrB,GAAcG,CAAa,CAAC;AAAA,MAC/D;AAAA,MAEC,UAAAe;AAAA,IAAA;AAAA,EAER,CAAA,GACL;AAER;AACApB,EAAgB,cAAc;AAM9B,MAAMqB,IAAkB,CAAC,EAAE,UAAApB,GAAU,GAAGS,EAAM,MAA6B,gBAAAO,EAAAO,GAAA,EAAW,GAAGd,GAAQ,UAAAT,GAAS,GAE7FwB,IAA0BC,EAA6C1B,CAAe,GAEtF2B,IAAc;AAAA,EACvB,MAAMF;AAAA,EACN,QAAQG;AAAA,EACR,UAAUC;AAAA,EACV,OAAOC;AACX;AAEAH,EAAY,KAAK,cAAc;AAC/BA,EAAY,OAAO,cAAc;AACjCA,EAAY,SAAS,cAAc;AACnCA,EAAY,MAAM,cAAc;"}
+{"version":3,"file":"fondue-components8.js","sources":["../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Slot as RadixSlot } from '@radix-ui/react-slot';\nimport { Children, forwardRef, useMemo, useState, type ForwardedRef, type ReactNode } from 'react';\n\nimport { ForwardedRefColorGradientInput } from './ColorGradientInput';\nimport { ForwardedRefColorPickerInput } from './ColorPickerInput';\nimport { ForwardedRefColorValueInput } from './ColorValueInput';\nimport styles from './styles/customColorPicker.module.scss';\nimport { type ColorFormat, type RgbaColor } from './types';\nimport { DEFAULT_COLOR, DEFAULT_FORMAT, getColorWithName } from './utils';\n\ntype ColorPickerProps = {\n    /**\n     * The children of the color picker component. This can contain multiple `ColorPicker.Values` or `ColorPicker.Gradient` components.\n     */\n    children?: ReactNode;\n    /**\n     * The active color in the color picker\n     */\n    currentColor?: RgbaColor;\n    /**\n     * Event handler called when the color changes\n     */\n    onColorChange?: (color: RgbaColor) => void;\n    /**\n     * The active color format in the color picker\n     */\n    currentFormat?: ColorFormat;\n    /**\n     * Event handler called when the color format changes\n     */\n    onFormatChange?: (format: ColorFormat) => void;\n    /**\n     * The default format to use for the color input when not controlled externally\n     * @default \"HEX\"\n     */\n    defaultFormat?: ColorFormat;\n    /**\n     * The test id of the color picker\n     */\n    'data-test-id'?: string;\n};\n\nexport const ColorPickerRoot = (\n    {\n        children,\n        currentColor = DEFAULT_COLOR,\n        onColorChange = () => {},\n        currentFormat,\n        onFormatChange = () => {},\n        defaultFormat = DEFAULT_FORMAT,\n        'data-test-id': dataTestId = 'color-picker-input',\n        ...props\n    }: ColorPickerProps,\n    forwardedRef: ForwardedRef<HTMLDivElement>,\n) => {\n    const [managedFormat, setManagedFormat] = useState<ColorFormat>(defaultFormat);\n    const activeFormat = useMemo(() => currentFormat ?? managedFormat, [currentFormat, managedFormat]);\n\n    return (\n        <div className={styles.root} data-picker-type=\"custom-color\" data-test-id={dataTestId} ref={forwardedRef}>\n            {Children.map(children, (child) => (\n                <ColorPickerSlot\n                    {...props}\n                    onColorChange={(color: RgbaColor) => {\n                        onColorChange(getColorWithName(color, activeFormat));\n                    }}\n                    currentColor={currentColor}\n                    currentFormat={activeFormat}\n                    setCurrentFormat={(currentFormat: ColorFormat) => {\n                        setManagedFormat(currentFormat);\n                        onFormatChange(currentFormat);\n                        onColorChange(getColorWithName(currentColor, currentFormat));\n                    }}\n                >\n                    {child}\n                </ColorPickerSlot>\n            ))}\n        </div>\n    );\n};\nColorPickerRoot.displayName = 'ColorPicker';\n\ntype ColorPickerSlotProps = ColorPickerProps & {\n    currentFormat?: ColorFormat;\n    setCurrentFormat?: (format: ColorFormat) => void;\n};\nconst ColorPickerSlot = ({ children, ...props }: ColorPickerSlotProps) => <RadixSlot {...props}>{children}</RadixSlot>;\n\nexport const ForwardedRefColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(ColorPickerRoot);\n\nexport const ColorPicker = {\n    Root: ForwardedRefColorPicker,\n    Values: ForwardedRefColorValueInput,\n    Gradient: ForwardedRefColorGradientInput,\n    Input: ForwardedRefColorPickerInput,\n};\n\nColorPicker.Root.displayName = 'ColorPicker.Root';\nColorPicker.Values.displayName = 'ColorPicker.Values';\nColorPicker.Gradient.displayName = 'ColorPicker.Gradient';\nColorPicker.Input.displayName = 'ColorPicker.Input';\n"],"names":["ColorPickerRoot","children","currentColor","DEFAULT_COLOR","onColorChange","currentFormat","onFormatChange","defaultFormat","DEFAULT_FORMAT","dataTestId","props","forwardedRef","managedFormat","setManagedFormat","useState","activeFormat","useMemo","jsx","styles","Children","child","ColorPickerSlot","color","getColorWithName","RadixSlot","ForwardedRefColorPicker","forwardRef","ColorPicker","ForwardedRefColorValueInput","ForwardedRefColorGradientInput","ForwardedRefColorPickerInput"],"mappings":";;;;;;;;AA4CO,MAAMA,IAAkB,CAC3B;AAAA,EACI,UAAAC;AAAA,EACA,cAAAC,IAAeC;AAAA,EACf,eAAAC,IAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,eAAAC;AAAA,EACA,gBAAAC,IAAiB,MAAM;AAAA,EAAC;AAAA,EACxB,eAAAC,IAAgBC;AAAA,EAChB,gBAAgBC,IAAa;AAAA,EAC7B,GAAGC;AACP,GACAC,MACC;AACD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAsBP,CAAa,GACvEQ,IAAeC,EAAQ,MAAMX,KAAiBO,GAAe,CAACP,GAAeO,CAAa,CAAC;AAEjG,SACI,gBAAAK,EAAC,OAAA,EAAI,WAAWC,EAAO,MAAM,oBAAiB,gBAAe,gBAAcT,GAAY,KAAKE,GACvF,UAAAQ,EAAS,IAAIlB,GAAU,CAACmB,MACrB,gBAAAH;AAAA,IAACI;AAAA,IAAA;AAAA,MACI,GAAGX;AAAA,MACJ,eAAe,CAACY,MAAqB;AACjC,QAAAlB,EAAcmB,EAAiBD,GAAOP,CAAY,CAAC;AAAA,MACvD;AAAA,MACA,cAAAb;AAAA,MACA,eAAea;AAAA,MACf,kBAAkB,CAACV,MAA+B;AAC9C,QAAAQ,EAAiBR,CAAa,GAC9BC,EAAeD,CAAa,GAC5BD,EAAcmB,EAAiBrB,GAAcG,CAAa,CAAC;AAAA,MAC/D;AAAA,MAEC,UAAAe;AAAA,IAAA;AAAA,EAAA,CAER,GACL;AAER;AACApB,EAAgB,cAAc;AAM9B,MAAMqB,IAAkB,CAAC,EAAE,UAAApB,GAAU,GAAGS,EAAA,MAAkC,gBAAAO,EAACO,GAAA,EAAW,GAAGd,GAAQ,UAAAT,GAAS,GAE7FwB,IAA0BC,EAA6C1B,CAAe,GAEtF2B,IAAc;AAAA,EACvB,MAAMF;AAAA,EACN,QAAQG;AAAA,EACR,UAAUC;AAAA,EACV,OAAOC;AACX;AAEAH,EAAY,KAAK,cAAc;AAC/BA,EAAY,OAAO,cAAc;AACjCA,EAAY,SAAS,cAAc;AACnCA,EAAY,MAAM,cAAc;"}