@uva-glass/component-library 3.31.0 → 3.32.0

package/dist/SortableProvider-DisCfTTN.js

@@ -0,0 +1,160 @@
+import { jsx as f } from "react/jsx-runtime";
+import { useRef as x, useEffect as E, cloneElement as P, createContext as O, useReducer as A, useContext as L } from "react";
+import { sortableReducer as j, initialState as q } from "./components/Sortable/sortableReducer.js";
+import { c as _ } from "./clsx-OuTLNxxd.js";
+import { s as g } from "./Sortable.module--kgnzOjW.js";
+import { setDraggingTarget as B, setDraggingSource as H, setClone as W, reset as X, moveToPosition as Y, drop as k, dragStart as z, dragEnd as F, clearDraggingTarget as G, clearDraggingSource as J } from "./components/Sortable/actions.js";
+function K({ scrollable: i, hideNumbers: a, onSort: s }) {
+  const { clone: n, draggingTarget: p, drop: D, sortableItems: S, setDraggingTarget: o, reset: T, indices: c } = U(), d = x(null), l = x(null), u = x(c);
+  function m(r) {
+    const t = d.current;
+    if (!t?.hasChildNodes()) return;
+    const e = r.currentTarget;
+    return Array.from(t.childNodes).findIndex((v) => v.isEqualNode(e));
+  }
+  function C(r) {
+    const t = m(r);
+    t !== void 0 && (n && l.current && l.current.removeChild(n), D(t));
+  }
+  function $(r) {
+    if (r.preventDefault(), r.dataTransfer.dropEffect = "move", n) {
+      const { clientX: e, clientY: h } = r, { x: b, y: v, width: y, height: w } = r.currentTarget.getBoundingClientRect(), R = w / 2 - (h - v);
+      n.setAttribute(
+        "style",
+        `
+        left: ${e - (e - b)}px;
+        top: ${v - R}px;
+        height: ${w}px;
+        width: ${y}px;
+        visibility: visible;
+      `
+      );
+    }
+    const t = m(r);
+    t === void 0 || t === p || o(t);
+  }
+  function I(r) {
+    const { relatedTarget: t } = r;
+    t !== null && d.current?.contains(t) || (T(), n && n.setAttribute("style", "visibility: hidden;"));
+  }
+  return E(() => {
+    if (!(!n || !l.current))
+      return l.current.appendChild(n), function() {
+        n.remove();
+      };
+  }, [n]), E(() => {
+    s && c.valueOf() !== u.current.valueOf() && (s(c), u.current = c);
+  }, [c, u, s]), /* @__PURE__ */ f(
+    "div",
+    {
+      className: _(g.sortable__wrapper, { [g["sortable__wrapper--scrollable"]]: i }),
+      ref: l,
+      children: /* @__PURE__ */ f(
+        "ul",
+        {
+          className: _(g.sortable__container, {
+            [g["sortable__container--drag-over"]]: n !== void 0
+          }),
+          onDragLeave: I,
+          ref: d,
+          role: "presentation",
+          children: S.map((r, t) => /* @__PURE__ */ f(
+            "li",
+            {
+              className: _(g["sortable__drop-target"], {
+                [g["sortable__drop-target--no-number"]]: a
+              }),
+              draggable: !1,
+              onDragOver: $,
+              onDrop: C,
+              role: "presentation",
+              children: P(r, { index: t })
+            },
+            t
+          ))
+        }
+      )
+    }
+  );
+}
+const N = O(void 0);
+function M(i) {
+  return typeof i != "string";
+}
+const Q = (i) => {
+  const a = i.filter(M);
+  return {
+    ...q,
+    indices: a.map(({ props: s }) => s.index),
+    maxIndex: a.length - 1,
+    sortableItems: a
+  };
+};
+function oe({ renderItems: i, dataItems: a, scrollable: s, hideNumbers: n, onSort: p }) {
+  const D = x(a), [S, o] = A(j, i, Q);
+  function T(e) {
+    o(H(e));
+  }
+  function c(e) {
+    o(B(e));
+  }
+  function d(e) {
+    o(Y(e));
+  }
+  function l() {
+    o(G());
+  }
+  function u() {
+    o(J());
+  }
+  function m(e) {
+    o(k(e));
+  }
+  function C(e) {
+    o(z(e));
+  }
+  function $() {
+    o(F());
+  }
+  function I() {
+    o(X());
+  }
+  function r(e) {
+    o(W(e));
+  }
+  function t(e) {
+    const h = e.map((b) => D.current[b]);
+    p && p(h);
+  }
+  return /* @__PURE__ */ f(
+    N.Provider,
+    {
+      value: {
+        ...S,
+        clearDraggingSource: u,
+        clearDraggingTarget: l,
+        dragEnd: $,
+        dragStart: C,
+        drop: m,
+        moveToPosition: d,
+        reset: I,
+        setClone: r,
+        setDraggingSource: T,
+        setDraggingTarget: c
+      },
+      children: /* @__PURE__ */ f(K, { scrollable: s, hideNumbers: n, onSort: t })
+    }
+  );
+}
+function U() {
+  const i = L(N);
+  if (i === void 0)
+    throw new Error("useSortable must be used within a SortableProvider");
+  return i;
+}
+export {
+  oe as S,
+  K as a,
+  U as u
+};
+//# sourceMappingURL=SortableProvider-DisCfTTN.js.map

package/dist/SortableProvider-DisCfTTN.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortableProvider-DisCfTTN.js","sources":["../src/components/Sortable/components/SortableContainer.tsx","../src/components/Sortable/SortableProvider.tsx"],"sourcesContent":["import { cloneElement, useEffect, useRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { DragEvent } from 'react';\n\nimport styles from 'components/Sortable/Sortable.module.css';\nimport { useSortable } from 'components/Sortable/SortableProvider';\n\nexport type OnSort = (indices: number[]) => void;\n\ninterface SortableContainerProps {\n  scrollable?: boolean;\n  hideNumbers?: boolean;\n  onSort?: OnSort;\n}\n\nexport function SortableContainer({ scrollable, hideNumbers, onSort }: SortableContainerProps) {\n  const { clone, draggingTarget, drop, sortableItems, setDraggingTarget, reset, indices } = useSortable();\n  const containerRef = useRef<HTMLUListElement>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const indicesRef = useRef<number[]>(indices);\n\n  function getTargetIndex(event: DragEvent<HTMLLIElement>) {\n    const sortableContainer = containerRef.current;\n\n    if (!sortableContainer?.hasChildNodes()) return;\n\n    const listItemNode = event.currentTarget;\n    const childNodes = Array.from(sortableContainer.childNodes);\n    const targetIndex = childNodes.findIndex((node) => node.isEqualNode(listItemNode));\n\n    return targetIndex;\n  }\n\n  function handleDrop(event: DragEvent<HTMLLIElement>) {\n    const targetIndex = getTargetIndex(event);\n\n    if (targetIndex === undefined) return;\n\n    if (clone && wrapperRef.current) wrapperRef.current.removeChild(clone);\n\n    drop(targetIndex);\n  }\n\n  function handleDragOver(event: DragEvent<HTMLLIElement>) {\n    // Prevent default to allow drop\n    event.preventDefault();\n    event.dataTransfer.dropEffect = 'move';\n\n    if (clone) {\n      const { clientX, clientY } = event;\n      const { x, y, width, height } = event.currentTarget.getBoundingClientRect();\n      // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n      const grabPosition = height / 2 - (clientY - y);\n\n      // lock drag image movement to x-axis and mouse pointer\n      clone.setAttribute(\n        'style',\n        `\n        left: ${clientX - (clientX - x)}px;\n        top: ${y - grabPosition}px;\n        height: ${height}px;\n        width: ${width}px;\n        visibility: visible;\n      `\n      );\n    }\n\n    const targetIndex = getTargetIndex(event);\n\n    if (targetIndex === undefined || targetIndex === draggingTarget) return;\n\n    setDraggingTarget(targetIndex);\n  }\n\n  function handleContainerDragLeave(event: DragEvent<HTMLUListElement>) {\n    const { relatedTarget } = event;\n\n    const within = relatedTarget !== null && containerRef.current?.contains(relatedTarget as Node);\n\n    if (!within) {\n      reset();\n\n      if (clone) {\n        clone.setAttribute('style', 'visibility: hidden;');\n      }\n    }\n  }\n\n  useEffect(() => {\n    if (!clone || !wrapperRef.current) return;\n\n    wrapperRef.current.appendChild(clone);\n\n    return function () {\n      clone.remove();\n    };\n  }, [clone]);\n\n  useEffect(() => {\n    if (!onSort) return;\n\n    if (indices.valueOf() !== indicesRef.current.valueOf()) {\n      onSort(indices);\n\n      indicesRef.current = indices;\n    }\n  }, [indices, indicesRef, onSort]);\n\n  return (\n    <div\n      className={clsx(styles['sortable__wrapper'], { [styles['sortable__wrapper--scrollable']]: scrollable })}\n      ref={wrapperRef}\n    >\n      <ul\n        className={clsx(styles['sortable__container'], {\n          [styles['sortable__container--drag-over']]: clone !== undefined,\n        })}\n        onDragLeave={handleContainerDragLeave}\n        ref={containerRef}\n        role=\"presentation\"\n      >\n        {sortableItems.map((child, index) => (\n          <li\n            className={clsx(styles['sortable__drop-target'], {\n              [styles['sortable__drop-target--no-number']]: hideNumbers,\n            })}\n            draggable={false}\n            key={index}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop}\n            role=\"presentation\"\n          >\n            {cloneElement(child, { index })}\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n","import { createContext, useContext, useReducer, useRef } from 'react';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport type { SortableStateType } from './sortableReducer';\nimport type { SortableItem, SortableItemProps } from './components/SortableItem';\n\nimport { sortableReducer, initialState } from './sortableReducer';\nimport { SortableContainer } from './components/SortableContainer';\nimport * as actions from './actions';\n\ntype SortableContextType = {\n  clearDraggingSource: () => void;\n  clearDraggingTarget: () => void;\n  dragEnd: () => void;\n  dragStart: (index: number) => void;\n  drop: (index: number) => void;\n  moveToPosition: (index: number) => void;\n  reset: () => void;\n  setClone: (node: Element) => void;\n  setDraggingSource: (index: number) => void;\n  setDraggingTarget: (index: number) => void;\n};\n\nconst SortableContext = createContext<(SortableContextType & SortableStateType) | undefined>(undefined);\n\ntype SortableItems = ReactElement<SortableItemProps, typeof SortableItem>[];\n\ninterface Props<T = unknown> {\n  renderItems: SortableItems;\n  dataItems: T[];\n  scrollable?: boolean;\n  hideNumbers?: boolean;\n  onSort?: (items: T[]) => void;\n  children?: ReactNode;\n}\n\nfunction isReactElementWithIndex(value: string | ReactElement): value is ReactElement<{ index: number }> {\n  return typeof value !== 'string';\n}\n\nconst init = (renderItems: SortableItems): SortableStateType => {\n  const reactChildren = renderItems.filter(isReactElementWithIndex);\n\n  return {\n    ...initialState,\n    indices: reactChildren.map(({ props }) => props.index),\n    maxIndex: reactChildren.length - 1,\n    sortableItems: reactChildren,\n  };\n};\n\nexport function SortableProvider<T>({ renderItems, dataItems, scrollable, hideNumbers, onSort }: Props<T>) {\n  const persistentItems = useRef(dataItems);\n\n  const [state, dispatch] = useReducer(sortableReducer, renderItems, init);\n\n  function setDraggingSource(index: number) {\n    dispatch(actions.setDraggingSource(index));\n  }\n\n  function setDraggingTarget(index: number) {\n    dispatch(actions.setDraggingTarget(index));\n  }\n\n  function moveToPosition(index: number) {\n    dispatch(actions.moveToPosition(index));\n  }\n\n  function clearDraggingTarget() {\n    dispatch(actions.clearDraggingTarget());\n  }\n\n  function clearDraggingSource() {\n    dispatch(actions.clearDraggingSource());\n  }\n\n  function drop(index: number) {\n    dispatch(actions.drop(index));\n  }\n\n  function dragStart(index: number) {\n    dispatch(actions.dragStart(index));\n  }\n\n  function dragEnd() {\n    dispatch(actions.dragEnd());\n  }\n\n  function reset() {\n    dispatch(actions.reset());\n  }\n\n  function setClone(node: Element) {\n    dispatch(actions.setClone(node));\n  }\n\n  function onHandleSort(sortedIndices: number[]) {\n    const sortedData = sortedIndices.map((index) => persistentItems.current[index]);\n    onSort && onSort(sortedData);\n  }\n\n  return (\n    <SortableContext.Provider\n      value={{\n        ...state,\n        clearDraggingSource,\n        clearDraggingTarget,\n        dragEnd,\n        dragStart,\n        drop,\n        moveToPosition,\n        reset,\n        setClone,\n        setDraggingSource,\n        setDraggingTarget,\n      }}\n    >\n      <SortableContainer scrollable={scrollable} hideNumbers={hideNumbers} onSort={onHandleSort} />\n    </SortableContext.Provider>\n  );\n}\n\nexport function useSortable() {\n  const context = useContext(SortableContext);\n\n  if (context === undefined) {\n    throw new Error('useSortable must be used within a SortableProvider');\n  }\n\n  return context;\n}\n"],"names":["SortableContainer","scrollable","hideNumbers","onSort","clone","draggingTarget","drop","sortableItems","setDraggingTarget","reset","indices","useSortable","containerRef","useRef","wrapperRef","indicesRef","getTargetIndex","event","sortableContainer","listItemNode","node","handleDrop","targetIndex","handleDragOver","clientX","clientY","x","y","width","height","grabPosition","handleContainerDragLeave","relatedTarget","useEffect","jsx","clsx","styles","child","index","cloneElement","SortableContext","createContext","isReactElementWithIndex","value","init","renderItems","reactChildren","initialState","props","SortableProvider","dataItems","persistentItems","state","dispatch","useReducer","sortableReducer","setDraggingSource","actions.setDraggingSource","actions.setDraggingTarget","moveToPosition","actions.moveToPosition","clearDraggingTarget","actions.clearDraggingTarget","clearDraggingSource","actions.clearDraggingSource","actions.drop","dragStart","actions.dragStart","dragEnd","actions.dragEnd","actions.reset","setClone","actions.setClone","onHandleSort","sortedIndices","sortedData","context","useContext"],"mappings":"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"}

package/dist/{TablePlugin-Dmy98Epb.js → TablePlugin-oF-gInNx.js}

@@ -34,7 +34,7 @@ import "./index-nrPtQ1dv.js";
 import "./components/SelectListbox/SelectListbox.js";
 import "./components/SelectListbox/SelectProvider.js";
 import "./components/Sortable/components/SortableItem.js";
-import "./SortableProvider-C2T7b-pm.js";
+import "./SortableProvider-DisCfTTN.js";
 import { setScrollableContainers as _e, removeScrollableContainers as ke } from "./components/RteEditor/helpers.js";
 import './assets/TablePlugin.css';function he({ label: b, clearTrigger: d, onClear: a }) {
   return /* @__PURE__ */ m("header", { className: L["multi-select__header"], children: [
@@ -297,4 +297,4 @@ export {
   he as a,
   ye as b
 };
-//# sourceMappingURL=TablePlugin-Dmy98Epb.js.map
+//# sourceMappingURL=TablePlugin-oF-gInNx.js.map

package/dist/{TablePlugin-Dmy98Epb.js.map → TablePlugin-oF-gInNx.js.map}

@@ -1 +1 @@
-{"version":3,"file":"TablePlugin-Dmy98Epb.js","sources":["../src/components/MultiSelect/components/MultiSelectHeader.tsx","../src/components/MultiSelect/MultiSelect.tsx","../src/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/AddTableFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/TablePlugin.tsx"],"sourcesContent":["import styles from 'components/MultiSelect/MultiSelect.module.css';\nimport { Label } from 'components/Label';\nimport { Button } from 'components';\n\nexport interface MultiSelectHeaderProps {\n  label: string;\n  clearTrigger?: string;\n  onClear?: () => void;\n}\n\nexport function MultiSelectHeader({ label, clearTrigger, onClear }: MultiSelectHeaderProps) {\n  return (\n    <header className={styles['multi-select__header']}>\n      <Label htmlFor=\"multi-select-list\">{label}</Label>\n      {clearTrigger && (\n        <Button variant={'blank'} onClick={onClear}>\n          {clearTrigger}\n        </Button>\n      )}\n    </header>\n  );\n}\n","import { clsx } from 'clsx';\n\nimport type { PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './MultiSelect.module.css';\n\nimport { MultiSelectItem } from 'components/MultiSelect/components/MultiSelectItem';\nimport { MultiSelectHeader } from 'components/MultiSelect/components/MultiSelectHeader';\n\nexport interface MultiSelectProps {\n  /** `true` if the container should scroll on overflow; otherwise, `false` to resize the container to its contents. The default is `true`. */\n  scrollable?: boolean;\n  /** `true` to disable the border around the container; otherwise, `false`. The default is `false`. */\n  noBorder?: boolean;\n  /** The header contents. */\n  header?: ReactNode;\n}\n\n/** Represents a component to list a number of checkboxes. */\nexport const MultiSelect = ({ scrollable = true, noBorder, header, children }: PropsWithChildren<MultiSelectProps>) => (\n  <>\n    {header}\n    <div\n      className={clsx(styles['multi-select'], {\n        [styles['multi-select--no-border']]: noBorder,\n      })}\n    >\n      <ul\n        className={clsx(styles['multi-select__list'], {\n          [styles['multi-select__list--scrollable']]: scrollable,\n        })}\n        id=\"multi-select-list\"\n      >\n        {children}\n      </ul>\n    </div>\n  </>\n);\n\nMultiSelect.MultiSelectHeader = MultiSelectHeader;\nMultiSelect.MultiSelectItem = MultiSelectItem;\n","import { useState, forwardRef, useImperativeHandle, useRef, useId } from 'react';\n\nimport type { ChangeEvent, JSX } from 'react';\nimport type { LinkType } from 'components/RteEditor/Plugins/LinkPlugin';\n\nimport styles from './AddLinkForm.module.css';\n\nimport { ensureHttps, validateUrlWithProtocol } from 'components/RteEditor/Plugins/LinkPlugin/helpers';\nimport { Button, FeedbackBox, FormField, Icon, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\ninterface AddLinkFormProps {\n  onCloseHandler: () => void;\n  onSaveHandler: (url: string, linktext: string) => void;\n  isLink: LinkType;\n}\n\nexport interface addLinkFormMethods {\n  clearForm: () => void;\n  focusFirstField: () => void;\n  setDefaults: (url: string, linktext: string) => void;\n}\n\nexport const AddLinkForm = forwardRef(\n  (\n    { onCloseHandler, onSaveHandler, isLink = { active: false, url: '', linktext: '' } }: AddLinkFormProps,\n    ref\n  ): JSX.Element => {\n    const t = useTranslation();\n    const [url, setUrl] = useState<string>(isLink.url || '');\n    const [linkText, setLinkText] = useState<string>(isLink.linktext || '');\n    const [showLinktextField, setShowLinktextField] = useState<boolean>(false);\n    const [urlError, setUrlError] = useState<string | null>(null);\n    const [linkTextError, setLinkTextError] = useState<string | null>(null);\n    const firstField = useRef<HTMLInputElement>(null);\n    const linkId = `link_${useId()}`;\n    const textId = `text_${useId()}`;\n\n    const handleOpenUrl = () => {\n      window.open(ensureHttps(url), '_blank');\n    };\n\n    const handleUrl = (event: ChangeEvent<HTMLInputElement>) => {\n      setUrl(event.target.value);\n    };\n\n    const handleLinkText = (event: ChangeEvent<HTMLInputElement>) => {\n      setLinkText(event.target.value);\n    };\n\n    const validateUrl = (url: string): boolean => {\n      if (validateUrlWithProtocol(url) === false || url.trim() === '') {\n        setUrlError(t.errortext.urlNotValid);\n        return false;\n      }\n      setUrlError(null);\n      return true;\n    };\n\n    const validateLinkText = (linkText: string): boolean => {\n      if (linkText.trim() === '') {\n        setLinkTextError(t.errortext.linkTextNotValid);\n        return false;\n      }\n      setLinkTextError(null);\n      return true;\n    };\n\n    const handleSave = () => {\n      if (!validateUrl(url) || (showLinktextField && !validateLinkText(linkText))) {\n        return;\n      }\n\n      onSaveHandler(url, linkText);\n      resetForm();\n    };\n\n    const handleClose = () => {\n      onCloseHandler();\n      resetForm();\n    };\n\n    const resetForm = () => {\n      setUrl('');\n      setShowLinktextField(false);\n      setUrlError(null);\n      setLinkTextError(null);\n    };\n\n    const setDefaults = (url: string, linktext: string) => {\n      setUrl(url);\n      if (!linktext && !url) {\n        setShowLinktextField(true);\n      }\n    };\n\n    const focusFirstField = () => {\n      if (firstField.current) {\n        firstField.current.focus();\n      }\n    };\n\n    useImperativeHandle(ref, () => ({\n      clearForm: resetForm,\n      focusFirstField,\n      setDefaults,\n    }));\n\n    return (\n      <div className={styles['linkform']}>\n        <FormField className={styles['linkform__input-field']}>\n          <Label htmlFor={linkId}>{t.links.linkLabel}</Label>\n          <div className={styles['linkform__input-url-wrapper']}>\n            <InputField\n              id={linkId}\n              placeholder={t.links.linkPlaceholder}\n              value={url}\n              onChange={(event) => handleUrl(event)}\n              onFocus={() => setUrlError(null)}\n              ref={firstField}\n              aria-label={t.aria.labels.linkField}\n            />\n            {url && (\n              <button type=\"button\" onClick={handleOpenUrl} className={styles['linkform__open-url-button']}>\n                <Icon name=\"ArrowTopRightOnSquare\" size={20} />\n              </button>\n            )}\n          </div>\n          {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n        </FormField>\n        {showLinktextField && (\n          <FormField className={styles['linkform__input-field']}>\n            <Label htmlFor={textId}>{t.links.linkText}</Label>\n            <InputField\n              id={textId}\n              value={linkText}\n              onChange={(event) => handleLinkText(event)}\n              onFocus={() => setLinkTextError(null)}\n              aria-label={t.aria.labels.linkTextfield}\n            />\n            {linkTextError && <FeedbackBox level=\"error\" feedback={linkTextError} />}\n          </FormField>\n        )}\n        <div className={styles['linkform__footer']}>\n          <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\n            {t.common.cancel}\n          </Button>\n          <Button variant={'primary'} onClick={handleSave} aria-label={t.aria.labels.linkOkButton} type=\"button\">\n            {t.links.addLink}\n          </Button>\n        </div>\n      </div>\n    );\n  }\n);\n","import { useState, forwardRef, useImperativeHandle, useRef, useId, useEffect } from 'react';\n\nimport type { ChangeEvent } from 'react';\n\nimport styles from './AddTableFrom.module.css';\n\nimport { Button, FormField, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\ninterface AddTableFormProps {\n  onCloseHandler: () => void;\n  onSaveHandler: (nrfOfRows: number, nrOfColumns: number) => void;\n}\n\nexport interface addTableForm {\n  clearForm: () => void;\n  focusFirstField: () => void;\n}\n\nexport const AddTableForm = forwardRef(({ onCloseHandler, onSaveHandler }: AddTableFormProps, ref) => {\n  const t = useTranslation();\n  const [rowCount, setRowCount] = useState<number>();\n  const [columnCount, setColumnCount] = useState<number>();\n  const firstField = useRef<HTMLInputElement>(null);\n  const rowId = `row_${useId()}`;\n  const columnId = `column_${useId()}`;\n\n  const handleDimentionChange = (event: ChangeEvent<HTMLInputElement>, type: string) => {\n    const value = event.target.value;\n    type === 'row' ? setRowCount(parseInt(value)) : setColumnCount(parseInt(value));\n  };\n\n  const handleSave = () => {\n    if (rowCount !== undefined && columnCount !== undefined) {\n      onSaveHandler(rowCount, columnCount);\n      resetForm();\n    }\n  };\n\n  const handleClose = () => {\n    onCloseHandler();\n    resetForm();\n  };\n\n  const resetForm = () => {\n    setRowCount(undefined);\n    setColumnCount(undefined);\n  };\n\n  useImperativeHandle(ref, () => ({\n    clearForm: resetForm,\n    focusFirstField: () => firstField.current?.focus(),\n  }));\n\n  useEffect(() => {\n    const handleResizeScroll = () => {\n      handleClose();\n    };\n\n    setScrollableContainers(handleResizeScroll);\n\n    window.addEventListener('scroll', handleResizeScroll);\n    window.addEventListener('resize', handleResizeScroll);\n\n    return () => {\n      window.removeEventListener('scroll', handleResizeScroll);\n      window.removeEventListener('resize', handleResizeScroll);\n      removeScrollableContainers(handleResizeScroll);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div className={styles['tableform']}>\n      <FormField className={styles['tableform__input-field']}>\n        <Label htmlFor={rowId}>{t.table.nrofRows}</Label>\n        <InputField\n          id={rowId}\n          placeholder={t.table.nrofRowsPlaceholder}\n          value={rowCount ? rowCount : ''}\n          onChange={(event) => handleDimentionChange(event, 'row')}\n          aria-label={t.aria.labels.tableRowfield}\n          ref={firstField}\n        />\n      </FormField>\n      <FormField className={styles['tableform__input-field']}>\n        <Label htmlFor={columnId}>{t.table.nrofColumns}</Label>\n        <InputField\n          id={columnId}\n          placeholder={t.table.nrofColumnsPlaceholder}\n          value={columnCount ? columnCount : ''}\n          onChange={(event) => handleDimentionChange(event, 'column')}\n          aria-label={t.aria.labels.tableColumnfield}\n        />\n      </FormField>\n      <div className={styles['tableform__footer']}>\n        <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel}>\n          {t.common.cancel}\n        </Button>\n        <Button\n          variant={'primary'}\n          onClick={handleSave}\n          disabled={!rowCount || !columnCount}\n          aria-label={t.aria.labels.tableOkButton}\n        >\n          {t.common.add}\n        </Button>\n      </div>\n    </div>\n  );\n});\n","import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { clsx } from 'clsx';\nimport { $getTableCellNodeFromLexicalNode, $isTableCellNode } from '@lexical/table';\nimport { $getSelection, $isRangeSelection, $getRoot, KEY_DOWN_COMMAND, COMMAND_PRIORITY_EDITOR } from 'lexical';\nimport { useRef, useEffect, useImperativeHandle, forwardRef } from 'react';\n\nimport type { JSX } from 'react';\nimport type { TextNode } from 'lexical';\nimport type { addTableForm } from './AddTableFrom';\nimport type { Actions } from './TableCellContextMenu';\n\nimport { AddTableForm } from './AddTableFrom';\nimport { createTable, deleteColumn, deleteRow, deleteTable, insertColumn, insertRow } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks/useFlyout';\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nconst PREVENT_OPEN_DELAY = 200;\n\ninterface TablePluginProps {\n  isActive: boolean;\n}\n\nexport interface TableMutation {\n  mutateTable: (type: Actions) => void;\n}\n\nexport const TablePlugin = forwardRef(({ isActive }: TablePluginProps, ref): JSX.Element => {\n  const t = useTranslation();\n  const [editor] = useLexicalComposerContext();\n  const { flyout, showFlyout, hideFlyout, isVisible } = useFlyout();\n  const addTableForm = useRef<addTableForm>(undefined);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const preventOpen = useRef(false);\n  const isVisibleRef = useRef(isVisible);\n\n  const openFlyout = () => {\n    const rect = buttonRef.current?.getBoundingClientRect();\n    if (!preventOpen.current && rect) {\n      showFlyout({ position: { top: rect.bottom, left: rect.left }, ...flyoutOptions });\n    }\n  };\n\n  const closeFlyout = () => {\n    hideFlyout();\n  };\n\n  const insertTable = (nrOfRows: number, nrOfColumns: number) => {\n    editor.update(() => {\n      const selection = $getSelection();\n      const tableNode = createTable(nrOfRows, nrOfColumns);\n      if ($isRangeSelection(selection)) {\n        selection.insertNodes([tableNode]);\n      } else {\n        $getRoot().append(tableNode);\n      }\n      const firstDescendant = tableNode.getFirstDescendant();\n      if (firstDescendant) {\n        (firstDescendant as TextNode).select();\n      }\n    });\n\n    closeFlyout();\n  };\n\n  const mutateTable = (action: Actions) => {\n    editor.update(() => {\n      const selection = $getSelection();\n      if ($isRangeSelection(selection)) {\n        const anchorNode = selection.anchor.getNode();\n        const currentNode = $getTableCellNodeFromLexicalNode(anchorNode);\n\n        if ($isTableCellNode(currentNode)) {\n          switch (action) {\n            case 'insertRowAbove':\n            case 'insertRowBelow':\n              insertRow(currentNode, action);\n              break;\n            case 'deleteRow':\n              deleteRow(currentNode);\n              break;\n            case 'insertColumnLeft':\n            case 'insertColumnRight':\n              insertColumn(currentNode, action);\n              break;\n            case 'deleteColumn':\n              deleteColumn(currentNode);\n              break;\n            case 'deleteTable':\n              deleteTable(currentNode);\n              break;\n          }\n        }\n      }\n    });\n  };\n\n  const flyoutOptions = {\n    children: (\n      <AddTableForm\n        onCloseHandler={closeFlyout}\n        onSaveHandler={(rows, columns) => insertTable(rows, columns)}\n        ref={addTableForm}\n      />\n    ),\n  };\n\n  useEffect(() => {\n    if (!isVisible) {\n      addTableForm.current?.clearForm();\n      setTimeout(() => (preventOpen.current = false), PREVENT_OPEN_DELAY);\n    } else {\n      preventOpen.current = true;\n      addTableForm.current?.focusFirstField();\n    }\n  }, [addTableForm, isVisible]);\n\n  useEffect(() => {\n    const removeKeyboardShortcut = editor.registerCommand(\n      KEY_DOWN_COMMAND,\n      (event: KeyboardEvent) => {\n        if (event.ctrlKey && event.shiftKey && event.code === 'Digit9') {\n          event.preventDefault();\n          openFlyout();\n          return true;\n        }\n        return false;\n      },\n      COMMAND_PRIORITY_EDITOR\n    );\n\n    return () => {\n      removeKeyboardShortcut();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [editor]);\n\n  useEffect(() => {\n    isVisibleRef.current = isVisible;\n  }, [isVisible]);\n\n  useEffect(() => {\n    const removeKeydown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isVisibleRef.current) {\n        event.preventDefault();\n        event.stopPropagation();\n        closeFlyout();\n      }\n    };\n\n    document.addEventListener('keydown', removeKeydown, { capture: true });\n\n    return () => {\n      document.removeEventListener('keydown', removeKeydown);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    mutateTable,\n  }));\n\n  return (\n    <div className={styles['editor__toolbar-button-group']}>\n      <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n        <button\n          onClick={openFlyout}\n          title={t.table.tableTooltip}\n          className={clsx(styles['editor__toolbar-button'], isActive && styles[`editor__toolbar-button--active`])}\n          aria-label={t.aria.labels.table}\n          aria-keyshortcuts={t.aria.keyshortcuts.table}\n          ref={buttonRef}\n          type=\"button\"\n        >\n          <Icon name=\"Table\" size={24} />\n        </button>\n        {flyout}\n      </div>\n    </div>\n  );\n});\n"],"names":["MultiSelectHeader","label","clearTrigger","onClear","jsxs","styles","jsx","Label","Button","MultiSelect","scrollable","noBorder","header","children","Fragment","clsx","MultiSelectItem","AddLinkForm","forwardRef","onCloseHandler","onSaveHandler","isLink","ref","t","useTranslation","url","setUrl","useState","linkText","setLinkText","showLinktextField","setShowLinktextField","urlError","setUrlError","linkTextError","setLinkTextError","firstField","useRef","linkId","useId","textId","handleOpenUrl","ensureHttps","handleUrl","event","handleLinkText","validateUrl","validateUrlWithProtocol","validateLinkText","handleSave","resetForm","handleClose","setDefaults","linktext","focusFirstField","useImperativeHandle","FormField","InputField","Icon","FeedbackBox","AddTableForm","rowCount","setRowCount","columnCount","setColumnCount","rowId","columnId","handleDimentionChange","type","value","useEffect","handleResizeScroll","setScrollableContainers","removeScrollableContainers","PREVENT_OPEN_DELAY","TablePlugin","isActive","editor","useLexicalComposerContext","flyout","showFlyout","hideFlyout","isVisible","useFlyout","addTableForm","buttonRef","preventOpen","isVisibleRef","openFlyout","rect","flyoutOptions","closeFlyout","insertTable","nrOfRows","nrOfColumns","selection","$getSelection","tableNode","createTable","$isRangeSelection","$getRoot","firstDescendant","mutateTable","action","anchorNode","currentNode","$getTableCellNodeFromLexicalNode","$isTableCellNode","insertRow","deleteRow","insertColumn","deleteColumn","deleteTable","rows","columns","removeKeyboardShortcut","KEY_DOWN_COMMAND","COMMAND_PRIORITY_EDITOR","removeKeydown"],"mappings":"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"}
+{"version":3,"file":"TablePlugin-oF-gInNx.js","sources":["../src/components/MultiSelect/components/MultiSelectHeader.tsx","../src/components/MultiSelect/MultiSelect.tsx","../src/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/AddTableFrom.tsx","../src/components/RteEditor/Plugins/TablePlugin/TablePlugin.tsx"],"sourcesContent":["import styles from 'components/MultiSelect/MultiSelect.module.css';\nimport { Label } from 'components/Label';\nimport { Button } from 'components';\n\nexport interface MultiSelectHeaderProps {\n  label: string;\n  clearTrigger?: string;\n  onClear?: () => void;\n}\n\nexport function MultiSelectHeader({ label, clearTrigger, onClear }: MultiSelectHeaderProps) {\n  return (\n    <header className={styles['multi-select__header']}>\n      <Label htmlFor=\"multi-select-list\">{label}</Label>\n      {clearTrigger && (\n        <Button variant={'blank'} onClick={onClear}>\n          {clearTrigger}\n        </Button>\n      )}\n    </header>\n  );\n}\n","import { clsx } from 'clsx';\n\nimport type { PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './MultiSelect.module.css';\n\nimport { MultiSelectItem } from 'components/MultiSelect/components/MultiSelectItem';\nimport { MultiSelectHeader } from 'components/MultiSelect/components/MultiSelectHeader';\n\nexport interface MultiSelectProps {\n  /** `true` if the container should scroll on overflow; otherwise, `false` to resize the container to its contents. The default is `true`. */\n  scrollable?: boolean;\n  /** `true` to disable the border around the container; otherwise, `false`. The default is `false`. */\n  noBorder?: boolean;\n  /** The header contents. */\n  header?: ReactNode;\n}\n\n/** Represents a component to list a number of checkboxes. */\nexport const MultiSelect = ({ scrollable = true, noBorder, header, children }: PropsWithChildren<MultiSelectProps>) => (\n  <>\n    {header}\n    <div\n      className={clsx(styles['multi-select'], {\n        [styles['multi-select--no-border']]: noBorder,\n      })}\n    >\n      <ul\n        className={clsx(styles['multi-select__list'], {\n          [styles['multi-select__list--scrollable']]: scrollable,\n        })}\n        id=\"multi-select-list\"\n      >\n        {children}\n      </ul>\n    </div>\n  </>\n);\n\nMultiSelect.MultiSelectHeader = MultiSelectHeader;\nMultiSelect.MultiSelectItem = MultiSelectItem;\n","import { useState, forwardRef, useImperativeHandle, useRef, useId } from 'react';\n\nimport type { ChangeEvent, JSX } from 'react';\nimport type { LinkType } from 'components/RteEditor/Plugins/LinkPlugin';\n\nimport styles from './AddLinkForm.module.css';\n\nimport { ensureHttps, validateUrlWithProtocol } from 'components/RteEditor/Plugins/LinkPlugin/helpers';\nimport { Button, FeedbackBox, FormField, Icon, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\ninterface AddLinkFormProps {\n  onCloseHandler: () => void;\n  onSaveHandler: (url: string, linktext: string) => void;\n  isLink: LinkType;\n}\n\nexport interface addLinkFormMethods {\n  clearForm: () => void;\n  focusFirstField: () => void;\n  setDefaults: (url: string, linktext: string) => void;\n}\n\nexport const AddLinkForm = forwardRef(\n  (\n    { onCloseHandler, onSaveHandler, isLink = { active: false, url: '', linktext: '' } }: AddLinkFormProps,\n    ref\n  ): JSX.Element => {\n    const t = useTranslation();\n    const [url, setUrl] = useState<string>(isLink.url || '');\n    const [linkText, setLinkText] = useState<string>(isLink.linktext || '');\n    const [showLinktextField, setShowLinktextField] = useState<boolean>(false);\n    const [urlError, setUrlError] = useState<string | null>(null);\n    const [linkTextError, setLinkTextError] = useState<string | null>(null);\n    const firstField = useRef<HTMLInputElement>(null);\n    const linkId = `link_${useId()}`;\n    const textId = `text_${useId()}`;\n\n    const handleOpenUrl = () => {\n      window.open(ensureHttps(url), '_blank');\n    };\n\n    const handleUrl = (event: ChangeEvent<HTMLInputElement>) => {\n      setUrl(event.target.value);\n    };\n\n    const handleLinkText = (event: ChangeEvent<HTMLInputElement>) => {\n      setLinkText(event.target.value);\n    };\n\n    const validateUrl = (url: string): boolean => {\n      if (validateUrlWithProtocol(url) === false || url.trim() === '') {\n        setUrlError(t.errortext.urlNotValid);\n        return false;\n      }\n      setUrlError(null);\n      return true;\n    };\n\n    const validateLinkText = (linkText: string): boolean => {\n      if (linkText.trim() === '') {\n        setLinkTextError(t.errortext.linkTextNotValid);\n        return false;\n      }\n      setLinkTextError(null);\n      return true;\n    };\n\n    const handleSave = () => {\n      if (!validateUrl(url) || (showLinktextField && !validateLinkText(linkText))) {\n        return;\n      }\n\n      onSaveHandler(url, linkText);\n      resetForm();\n    };\n\n    const handleClose = () => {\n      onCloseHandler();\n      resetForm();\n    };\n\n    const resetForm = () => {\n      setUrl('');\n      setShowLinktextField(false);\n      setUrlError(null);\n      setLinkTextError(null);\n    };\n\n    const setDefaults = (url: string, linktext: string) => {\n      setUrl(url);\n      if (!linktext && !url) {\n        setShowLinktextField(true);\n      }\n    };\n\n    const focusFirstField = () => {\n      if (firstField.current) {\n        firstField.current.focus();\n      }\n    };\n\n    useImperativeHandle(ref, () => ({\n      clearForm: resetForm,\n      focusFirstField,\n      setDefaults,\n    }));\n\n    return (\n      <div className={styles['linkform']}>\n        <FormField className={styles['linkform__input-field']}>\n          <Label htmlFor={linkId}>{t.links.linkLabel}</Label>\n          <div className={styles['linkform__input-url-wrapper']}>\n            <InputField\n              id={linkId}\n              placeholder={t.links.linkPlaceholder}\n              value={url}\n              onChange={(event) => handleUrl(event)}\n              onFocus={() => setUrlError(null)}\n              ref={firstField}\n              aria-label={t.aria.labels.linkField}\n            />\n            {url && (\n              <button type=\"button\" onClick={handleOpenUrl} className={styles['linkform__open-url-button']}>\n                <Icon name=\"ArrowTopRightOnSquare\" size={20} />\n              </button>\n            )}\n          </div>\n          {urlError && <FeedbackBox level=\"error\" feedback={urlError} />}\n        </FormField>\n        {showLinktextField && (\n          <FormField className={styles['linkform__input-field']}>\n            <Label htmlFor={textId}>{t.links.linkText}</Label>\n            <InputField\n              id={textId}\n              value={linkText}\n              onChange={(event) => handleLinkText(event)}\n              onFocus={() => setLinkTextError(null)}\n              aria-label={t.aria.labels.linkTextfield}\n            />\n            {linkTextError && <FeedbackBox level=\"error\" feedback={linkTextError} />}\n          </FormField>\n        )}\n        <div className={styles['linkform__footer']}>\n          <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\n            {t.common.cancel}\n          </Button>\n          <Button variant={'primary'} onClick={handleSave} aria-label={t.aria.labels.linkOkButton} type=\"button\">\n            {t.links.addLink}\n          </Button>\n        </div>\n      </div>\n    );\n  }\n);\n","import { useState, forwardRef, useImperativeHandle, useRef, useId, useEffect } from 'react';\n\nimport type { ChangeEvent } from 'react';\n\nimport styles from './AddTableFrom.module.css';\n\nimport { Button, FormField, InputField, Label } from 'components';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\nimport { removeScrollableContainers, setScrollableContainers } from 'components/RteEditor/helpers';\n\ninterface AddTableFormProps {\n  onCloseHandler: () => void;\n  onSaveHandler: (nrfOfRows: number, nrOfColumns: number) => void;\n}\n\nexport interface addTableForm {\n  clearForm: () => void;\n  focusFirstField: () => void;\n}\n\nexport const AddTableForm = forwardRef(({ onCloseHandler, onSaveHandler }: AddTableFormProps, ref) => {\n  const t = useTranslation();\n  const [rowCount, setRowCount] = useState<number>();\n  const [columnCount, setColumnCount] = useState<number>();\n  const firstField = useRef<HTMLInputElement>(null);\n  const rowId = `row_${useId()}`;\n  const columnId = `column_${useId()}`;\n\n  const handleDimentionChange = (event: ChangeEvent<HTMLInputElement>, type: string) => {\n    const value = event.target.value;\n    type === 'row' ? setRowCount(parseInt(value)) : setColumnCount(parseInt(value));\n  };\n\n  const handleSave = () => {\n    if (rowCount !== undefined && columnCount !== undefined) {\n      onSaveHandler(rowCount, columnCount);\n      resetForm();\n    }\n  };\n\n  const handleClose = () => {\n    onCloseHandler();\n    resetForm();\n  };\n\n  const resetForm = () => {\n    setRowCount(undefined);\n    setColumnCount(undefined);\n  };\n\n  useImperativeHandle(ref, () => ({\n    clearForm: resetForm,\n    focusFirstField: () => firstField.current?.focus(),\n  }));\n\n  useEffect(() => {\n    const handleResizeScroll = () => {\n      handleClose();\n    };\n\n    setScrollableContainers(handleResizeScroll);\n\n    window.addEventListener('scroll', handleResizeScroll);\n    window.addEventListener('resize', handleResizeScroll);\n\n    return () => {\n      window.removeEventListener('scroll', handleResizeScroll);\n      window.removeEventListener('resize', handleResizeScroll);\n      removeScrollableContainers(handleResizeScroll);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <div className={styles['tableform']}>\n      <FormField className={styles['tableform__input-field']}>\n        <Label htmlFor={rowId}>{t.table.nrofRows}</Label>\n        <InputField\n          id={rowId}\n          placeholder={t.table.nrofRowsPlaceholder}\n          value={rowCount ? rowCount : ''}\n          onChange={(event) => handleDimentionChange(event, 'row')}\n          aria-label={t.aria.labels.tableRowfield}\n          ref={firstField}\n        />\n      </FormField>\n      <FormField className={styles['tableform__input-field']}>\n        <Label htmlFor={columnId}>{t.table.nrofColumns}</Label>\n        <InputField\n          id={columnId}\n          placeholder={t.table.nrofColumnsPlaceholder}\n          value={columnCount ? columnCount : ''}\n          onChange={(event) => handleDimentionChange(event, 'column')}\n          aria-label={t.aria.labels.tableColumnfield}\n        />\n      </FormField>\n      <div className={styles['tableform__footer']}>\n        <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel}>\n          {t.common.cancel}\n        </Button>\n        <Button\n          variant={'primary'}\n          onClick={handleSave}\n          disabled={!rowCount || !columnCount}\n          aria-label={t.aria.labels.tableOkButton}\n        >\n          {t.common.add}\n        </Button>\n      </div>\n    </div>\n  );\n});\n","import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\nimport { clsx } from 'clsx';\nimport { $getTableCellNodeFromLexicalNode, $isTableCellNode } from '@lexical/table';\nimport { $getSelection, $isRangeSelection, $getRoot, KEY_DOWN_COMMAND, COMMAND_PRIORITY_EDITOR } from 'lexical';\nimport { useRef, useEffect, useImperativeHandle, forwardRef } from 'react';\n\nimport type { JSX } from 'react';\nimport type { TextNode } from 'lexical';\nimport type { addTableForm } from './AddTableFrom';\nimport type { Actions } from './TableCellContextMenu';\n\nimport { AddTableForm } from './AddTableFrom';\nimport { createTable, deleteColumn, deleteRow, deleteTable, insertColumn, insertRow } from './helpers';\n\nimport { useFlyout } from 'components/RteEditor/hooks/useFlyout';\nimport { Icon } from 'components';\nimport styles from 'components/RteEditor/RteEditor.module.css';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nconst PREVENT_OPEN_DELAY = 200;\n\ninterface TablePluginProps {\n  isActive: boolean;\n}\n\nexport interface TableMutation {\n  mutateTable: (type: Actions) => void;\n}\n\nexport const TablePlugin = forwardRef(({ isActive }: TablePluginProps, ref): JSX.Element => {\n  const t = useTranslation();\n  const [editor] = useLexicalComposerContext();\n  const { flyout, showFlyout, hideFlyout, isVisible } = useFlyout();\n  const addTableForm = useRef<addTableForm>(undefined);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const preventOpen = useRef(false);\n  const isVisibleRef = useRef(isVisible);\n\n  const openFlyout = () => {\n    const rect = buttonRef.current?.getBoundingClientRect();\n    if (!preventOpen.current && rect) {\n      showFlyout({ position: { top: rect.bottom, left: rect.left }, ...flyoutOptions });\n    }\n  };\n\n  const closeFlyout = () => {\n    hideFlyout();\n  };\n\n  const insertTable = (nrOfRows: number, nrOfColumns: number) => {\n    editor.update(() => {\n      const selection = $getSelection();\n      const tableNode = createTable(nrOfRows, nrOfColumns);\n      if ($isRangeSelection(selection)) {\n        selection.insertNodes([tableNode]);\n      } else {\n        $getRoot().append(tableNode);\n      }\n      const firstDescendant = tableNode.getFirstDescendant();\n      if (firstDescendant) {\n        (firstDescendant as TextNode).select();\n      }\n    });\n\n    closeFlyout();\n  };\n\n  const mutateTable = (action: Actions) => {\n    editor.update(() => {\n      const selection = $getSelection();\n      if ($isRangeSelection(selection)) {\n        const anchorNode = selection.anchor.getNode();\n        const currentNode = $getTableCellNodeFromLexicalNode(anchorNode);\n\n        if ($isTableCellNode(currentNode)) {\n          switch (action) {\n            case 'insertRowAbove':\n            case 'insertRowBelow':\n              insertRow(currentNode, action);\n              break;\n            case 'deleteRow':\n              deleteRow(currentNode);\n              break;\n            case 'insertColumnLeft':\n            case 'insertColumnRight':\n              insertColumn(currentNode, action);\n              break;\n            case 'deleteColumn':\n              deleteColumn(currentNode);\n              break;\n            case 'deleteTable':\n              deleteTable(currentNode);\n              break;\n          }\n        }\n      }\n    });\n  };\n\n  const flyoutOptions = {\n    children: (\n      <AddTableForm\n        onCloseHandler={closeFlyout}\n        onSaveHandler={(rows, columns) => insertTable(rows, columns)}\n        ref={addTableForm}\n      />\n    ),\n  };\n\n  useEffect(() => {\n    if (!isVisible) {\n      addTableForm.current?.clearForm();\n      setTimeout(() => (preventOpen.current = false), PREVENT_OPEN_DELAY);\n    } else {\n      preventOpen.current = true;\n      addTableForm.current?.focusFirstField();\n    }\n  }, [addTableForm, isVisible]);\n\n  useEffect(() => {\n    const removeKeyboardShortcut = editor.registerCommand(\n      KEY_DOWN_COMMAND,\n      (event: KeyboardEvent) => {\n        if (event.ctrlKey && event.shiftKey && event.code === 'Digit9') {\n          event.preventDefault();\n          openFlyout();\n          return true;\n        }\n        return false;\n      },\n      COMMAND_PRIORITY_EDITOR\n    );\n\n    return () => {\n      removeKeyboardShortcut();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [editor]);\n\n  useEffect(() => {\n    isVisibleRef.current = isVisible;\n  }, [isVisible]);\n\n  useEffect(() => {\n    const removeKeydown = (event: KeyboardEvent) => {\n      if (event.key === 'Escape' && isVisibleRef.current) {\n        event.preventDefault();\n        event.stopPropagation();\n        closeFlyout();\n      }\n    };\n\n    document.addEventListener('keydown', removeKeydown, { capture: true });\n\n    return () => {\n      document.removeEventListener('keydown', removeKeydown);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    mutateTable,\n  }));\n\n  return (\n    <div className={styles['editor__toolbar-button-group']}>\n      <div className={styles['editor__toolbar-button-flyoutwrapper']}>\n        <button\n          onClick={openFlyout}\n          title={t.table.tableTooltip}\n          className={clsx(styles['editor__toolbar-button'], isActive && styles[`editor__toolbar-button--active`])}\n          aria-label={t.aria.labels.table}\n          aria-keyshortcuts={t.aria.keyshortcuts.table}\n          ref={buttonRef}\n          type=\"button\"\n        >\n          <Icon name=\"Table\" size={24} />\n        </button>\n        {flyout}\n      </div>\n    </div>\n  );\n});\n"],"names":["MultiSelectHeader","label","clearTrigger","onClear","jsxs","styles","jsx","Label","Button","MultiSelect","scrollable","noBorder","header","children","Fragment","clsx","MultiSelectItem","AddLinkForm","forwardRef","onCloseHandler","onSaveHandler","isLink","ref","t","useTranslation","url","setUrl","useState","linkText","setLinkText","showLinktextField","setShowLinktextField","urlError","setUrlError","linkTextError","setLinkTextError","firstField","useRef","linkId","useId","textId","handleOpenUrl","ensureHttps","handleUrl","event","handleLinkText","validateUrl","validateUrlWithProtocol","validateLinkText","handleSave","resetForm","handleClose","setDefaults","linktext","focusFirstField","useImperativeHandle","FormField","InputField","Icon","FeedbackBox","AddTableForm","rowCount","setRowCount","columnCount","setColumnCount","rowId","columnId","handleDimentionChange","type","value","useEffect","handleResizeScroll","setScrollableContainers","removeScrollableContainers","PREVENT_OPEN_DELAY","TablePlugin","isActive","editor","useLexicalComposerContext","flyout","showFlyout","hideFlyout","isVisible","useFlyout","addTableForm","buttonRef","preventOpen","isVisibleRef","openFlyout","rect","flyoutOptions","closeFlyout","insertTable","nrOfRows","nrOfColumns","selection","$getSelection","tableNode","createTable","$isRangeSelection","$getRoot","firstDescendant","mutateTable","action","anchorNode","currentNode","$getTableCellNodeFromLexicalNode","$isTableCellNode","insertRow","deleteRow","insertColumn","deleteColumn","deleteTable","rows","columns","removeKeyboardShortcut","KEY_DOWN_COMMAND","COMMAND_PRIORITY_EDITOR","removeKeydown"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,SAASA,GAAkB,EAAE,OAAAC,GAAO,cAAAC,GAAc,SAAAC,KAAmC;AAC1F,SACE,gBAAAC,EAAC,UAAA,EAAO,WAAWC,EAAO,sBAAsB,GAC9C,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAM,SAAQ,qBAAqB,UAAAN,GAAM;AAAA,IACzCC,KACC,gBAAAI,EAACE,GAAA,EAAO,SAAS,SAAS,SAASL,GAChC,UAAAD,EAAA,CACH;AAAA,EAAA,GAEJ;AAEJ;ACFO,MAAMO,IAAc,CAAC,EAAE,YAAAC,IAAa,IAAM,UAAAC,GAAU,QAAAC,GAAQ,UAAAC,QACjE,gBAAAT,EAAAU,GAAA,EACG,UAAA;AAAA,EAAAF;AAAA,EACD,gBAAAN;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWS,EAAKV,EAAO,cAAc,GAAG;AAAA,QACtC,CAACA,EAAO,yBAAyB,CAAC,GAAGM;AAAA,MAAA,CACtC;AAAA,MAED,UAAA,gBAAAL;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWS,EAAKV,EAAO,oBAAoB,GAAG;AAAA,YAC5C,CAACA,EAAO,gCAAgC,CAAC,GAAGK;AAAA,UAAA,CAC7C;AAAA,UACD,IAAG;AAAA,UAEF,UAAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AACF,EAAA,CACF;AAGFJ,EAAY,oBAAoBT;AAChCS,EAAY,kBAAkBO;;;;;;;GCjBjBC,KAAcC;AAAA,EACzB,CACE,EAAE,gBAAAC,GAAgB,eAAAC,GAAe,QAAAC,IAAS,EAAE,QAAQ,IAAO,KAAK,IAAI,UAAU,GAAA,EAAG,GACjFC,MACgB;AAChB,UAAMC,IAAIC,EAAA,GACJ,CAACC,GAAKC,CAAM,IAAIC,EAAiBN,EAAO,OAAO,EAAE,GACjD,CAACO,GAAUC,CAAW,IAAIF,EAAiBN,EAAO,YAAY,EAAE,GAChE,CAACS,GAAmBC,CAAoB,IAAIJ,EAAkB,EAAK,GACnE,CAACK,GAAUC,CAAW,IAAIN,EAAwB,IAAI,GACtD,CAACO,GAAeC,CAAgB,IAAIR,EAAwB,IAAI,GAChES,IAAaC,EAAyB,IAAI,GAC1CC,IAAS,QAAQC,EAAA,CAAO,IACxBC,IAAS,QAAQD,EAAA,CAAO,IAExBE,IAAgB,MAAM;AAC1B,aAAO,KAAKC,GAAYjB,CAAG,GAAG,QAAQ;AAAA,IAAA,GAGlCkB,IAAY,CAACC,MAAyC;AAC1D,MAAAlB,EAAOkB,EAAM,OAAO,KAAK;AAAA,IAAA,GAGrBC,IAAiB,CAACD,MAAyC;AAC/D,MAAAf,EAAYe,EAAM,OAAO,KAAK;AAAA,IAAA,GAG1BE,IAAc,CAACrB,MACfsB,GAAwBtB,CAAG,MAAM,MAASA,EAAI,KAAA,MAAW,MAC3DQ,EAAYV,EAAE,UAAU,WAAW,GAC5B,OAETU,EAAY,IAAI,GACT,KAGHe,IAAmB,CAACpB,MACpBA,EAAS,KAAA,MAAW,MACtBO,EAAiBZ,EAAE,UAAU,gBAAgB,GACtC,OAETY,EAAiB,IAAI,GACd,KAGHc,IAAa,MAAM;AACvB,MAAI,CAACH,EAAYrB,CAAG,KAAMK,KAAqB,CAACkB,EAAiBpB,CAAQ,MAIzER,EAAcK,GAAKG,CAAQ,GAC3BsB,EAAA;AAAA,IAAU,GAGNC,IAAc,MAAM;AACxB,MAAAhC,EAAA,GACA+B,EAAA;AAAA,IAAU,GAGNA,IAAY,MAAM;AACtB,MAAAxB,EAAO,EAAE,GACTK,EAAqB,EAAK,GAC1BE,EAAY,IAAI,GAChBE,EAAiB,IAAI;AAAA,IAAA,GAGjBiB,IAAc,CAAC3B,GAAa4B,MAAqB;AACrD,MAAA3B,EAAOD,CAAG,GACN,CAAC4B,KAAY,CAAC5B,KAChBM,EAAqB,EAAI;AAAA,IAC3B,GAGIuB,IAAkB,MAAM;AAC5B,MAAIlB,EAAW,WACbA,EAAW,QAAQ,MAAA;AAAA,IACrB;AAGF,WAAAmB,EAAoBjC,GAAK,OAAO;AAAA,MAC9B,WAAW4B;AAAA,MACX,iBAAAI;AAAA,MACA,aAAAF;AAAA,IAAA,EACA,GAGA,gBAAAhD,EAAC,OAAA,EAAI,WAAWC,EAAO,UACrB,UAAA;AAAA,MAAA,gBAAAD,EAACoD,GAAA,EAAU,WAAWnD,EAAO,uBAAuB,GAClD,UAAA;AAAA,QAAA,gBAAAC,EAACC,GAAA,EAAM,SAAS+B,GAAS,UAAAf,EAAE,MAAM,WAAU;AAAA,QAC3C,gBAAAnB,EAAC,OAAA,EAAI,WAAWC,EAAO,6BAA6B,GAClD,UAAA;AAAA,UAAA,gBAAAC;AAAA,YAACmD;AAAA,YAAA;AAAA,cACC,IAAInB;AAAA,cACJ,aAAaf,EAAE,MAAM;AAAA,cACrB,OAAOE;AAAA,cACP,UAAU,CAACmB,MAAUD,EAAUC,CAAK;AAAA,cACpC,SAAS,MAAMX,EAAY,IAAI;AAAA,cAC/B,KAAKG;AAAA,cACL,cAAYb,EAAE,KAAK,OAAO;AAAA,YAAA;AAAA,UAAA;AAAA,UAE3BE,KACC,gBAAAnB,EAAC,UAAA,EAAO,MAAK,UAAS,SAASmC,GAAe,WAAWpC,EAAO,2BAA2B,GACzF,UAAA,gBAAAC,EAACoD,GAAA,EAAK,MAAK,yBAAwB,MAAM,IAAI,EAAA,CAC/C;AAAA,QAAA,GAEJ;AAAA,QACC1B,KAAY,gBAAA1B,EAACqD,GAAA,EAAY,OAAM,SAAQ,UAAU3B,EAAA,CAAU;AAAA,MAAA,GAC9D;AAAA,MACCF,KACC,gBAAA1B,EAACoD,GAAA,EAAU,WAAWnD,EAAO,uBAAuB,GAClD,UAAA;AAAA,QAAA,gBAAAC,EAACC,GAAA,EAAM,SAASiC,GAAS,UAAAjB,EAAE,MAAM,UAAS;AAAA,QAC1C,gBAAAjB;AAAA,UAACmD;AAAA,UAAA;AAAA,YACC,IAAIjB;AAAA,YACJ,OAAOZ;AAAA,YACP,UAAU,CAACgB,MAAUC,EAAeD,CAAK;AAAA,YACzC,SAAS,MAAMT,EAAiB,IAAI;AAAA,YACpC,cAAYZ,EAAE,KAAK,OAAO;AAAA,UAAA;AAAA,QAAA;AAAA,QAE3BW,KAAiB,gBAAA5B,EAACqD,GAAA,EAAY,OAAM,SAAQ,UAAUzB,EAAA,CAAe;AAAA,MAAA,GACxE;AAAA,MAEF,gBAAA9B,EAAC,OAAA,EAAI,WAAWC,EAAO,kBACrB,UAAA;AAAA,QAAA,gBAAAC,EAACE,GAAA,EAAO,SAAS,aAAa,SAAS2C,GAAa,cAAY5B,EAAE,OAAO,QAAQ,MAAK,UACnF,UAAAA,EAAE,OAAO,QACZ;AAAA,QACA,gBAAAjB,EAACE,GAAA,EAAO,SAAS,WAAW,SAASyC,GAAY,cAAY1B,EAAE,KAAK,OAAO,cAAc,MAAK,UAC3F,UAAAA,EAAE,MAAM,QAAA,CACX;AAAA,MAAA,EAAA,CACF;AAAA,IAAA,GACF;AAAA,EAAA;AAGN;;;;GCtIaqC,KAAe1C,EAAW,CAAC,EAAE,gBAAAC,GAAgB,eAAAC,EAAA,GAAoCE,MAAQ;AACpG,QAAMC,IAAIC,EAAA,GACJ,CAACqC,GAAUC,CAAW,IAAInC,EAAA,GAC1B,CAACoC,GAAaC,CAAc,IAAIrC,EAAA,GAChCS,IAAaC,EAAyB,IAAI,GAC1C4B,IAAQ,OAAO1B,EAAA,CAAO,IACtB2B,IAAW,UAAU3B,EAAA,CAAO,IAE5B4B,IAAwB,CAACvB,GAAsCwB,MAAiB;AACpF,UAAMC,IAAQzB,EAAM,OAAO;AAC3B,IAAAwB,MAAS,QAAQN,EAAY,SAASO,CAAK,CAAC,IAAIL,EAAe,SAASK,CAAK,CAAC;AAAA,EAAA,GAG1EpB,IAAa,MAAM;AACvB,IAAIY,MAAa,UAAaE,MAAgB,WAC5C3C,EAAcyC,GAAUE,CAAW,GACnCb,EAAA;AAAA,EACF,GAGIC,IAAc,MAAM;AACxB,IAAAhC,EAAA,GACA+B,EAAA;AAAA,EAAU,GAGNA,IAAY,MAAM;AACtB,IAAAY,EAAY,MAAS,GACrBE,EAAe,MAAS;AAAA,EAAA;AAG1B,SAAAT,EAAoBjC,GAAK,OAAO;AAAA,IAC9B,WAAW4B;AAAA,IACX,iBAAiB,MAAMd,EAAW,SAAS,MAAA;AAAA,EAAM,EACjD,GAEFkC,EAAU,MAAM;AACd,UAAMC,IAAqB,MAAM;AAC/B,MAAApB,EAAA;AAAA,IAAY;AAGd,WAAAqB,GAAwBD,CAAkB,GAE1C,OAAO,iBAAiB,UAAUA,CAAkB,GACpD,OAAO,iBAAiB,UAAUA,CAAkB,GAE7C,MAAM;AACX,aAAO,oBAAoB,UAAUA,CAAkB,GACvD,OAAO,oBAAoB,UAAUA,CAAkB,GACvDE,GAA2BF,CAAkB;AAAA,IAAA;AAAA,EAC/C,GAEC,EAAE,GAGH,gBAAAnE,EAAC,OAAA,EAAI,WAAWC,EAAO,WACrB,UAAA;AAAA,IAAA,gBAAAD,EAACoD,GAAA,EAAU,WAAWnD,EAAO,wBAAwB,GACnD,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAM,SAAS0D,GAAQ,UAAA1C,EAAE,MAAM,UAAS;AAAA,MACzC,gBAAAjB;AAAA,QAACmD;AAAA,QAAA;AAAA,UACC,IAAIQ;AAAA,UACJ,aAAa1C,EAAE,MAAM;AAAA,UACrB,OAAOsC,KAAsB;AAAA,UAC7B,UAAU,CAACjB,MAAUuB,EAAsBvB,GAAO,KAAK;AAAA,UACvD,cAAYrB,EAAE,KAAK,OAAO;AAAA,UAC1B,KAAKa;AAAA,QAAA;AAAA,MAAA;AAAA,IACP,GACF;AAAA,IACA,gBAAAhC,EAACoD,GAAA,EAAU,WAAWnD,EAAO,wBAAwB,GACnD,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAM,SAAS2D,GAAW,UAAA3C,EAAE,MAAM,aAAY;AAAA,MAC/C,gBAAAjB;AAAA,QAACmD;AAAA,QAAA;AAAA,UACC,IAAIS;AAAA,UACJ,aAAa3C,EAAE,MAAM;AAAA,UACrB,OAAOwC,KAA4B;AAAA,UACnC,UAAU,CAACnB,MAAUuB,EAAsBvB,GAAO,QAAQ;AAAA,UAC1D,cAAYrB,EAAE,KAAK,OAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAC5B,GACF;AAAA,IACA,gBAAAnB,EAAC,OAAA,EAAI,WAAWC,EAAO,mBACrB,UAAA;AAAA,MAAA,gBAAAC,EAACE,GAAA,EAAO,SAAS,aAAa,SAAS2C,GAAa,cAAY5B,EAAE,OAAO,QACtE,UAAAA,EAAE,OAAO,QACZ;AAAA,MACA,gBAAAjB;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,SAASyC;AAAA,UACT,UAAU,CAACY,KAAY,CAACE;AAAA,UACxB,cAAYxC,EAAE,KAAK,OAAO;AAAA,UAEzB,YAAE,OAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ,EAAA,CACF;AAAA,EAAA,GACF;AAEJ,CAAC,GC5FKmD,KAAqB,KAUdC,KAAczD,EAAW,CAAC,EAAE,UAAA0D,EAAA,GAA8BtD,MAAqB;AAC1F,QAAMC,IAAIC,EAAA,GACJ,CAACqD,CAAM,IAAIC,GAAA,GACX,EAAE,QAAAC,GAAQ,YAAAC,GAAY,YAAAC,GAAY,WAAAC,EAAA,IAAcC,GAAA,GAChDC,IAAe/C,EAAqB,MAAS,GAC7CgD,IAAYhD,EAA0B,IAAI,GAC1CiD,IAAcjD,EAAO,EAAK,GAC1BkD,IAAelD,EAAO6C,CAAS,GAE/BM,IAAa,MAAM;AACvB,UAAMC,IAAOJ,EAAU,SAAS,sBAAA;AAChC,IAAI,CAACC,EAAY,WAAWG,KAC1BT,EAAW,EAAE,UAAU,EAAE,KAAKS,EAAK,QAAQ,MAAMA,EAAK,QAAQ,GAAGC,EAAA,CAAe;AAAA,EAClF,GAGIC,IAAc,MAAM;AACxB,IAAAV,EAAA;AAAA,EAAW,GAGPW,IAAc,CAACC,GAAkBC,MAAwB;AAC7D,IAAAjB,EAAO,OAAO,MAAM;AAClB,YAAMkB,IAAYC,EAAA,GACZC,IAAYC,GAAYL,GAAUC,CAAW;AACnD,MAAIK,EAAkBJ,CAAS,IAC7BA,EAAU,YAAY,CAACE,CAAS,CAAC,IAEjCG,GAAA,EAAW,OAAOH,CAAS;AAE7B,YAAMI,IAAkBJ,EAAU,mBAAA;AAClC,MAAII,KACDA,EAA6B,OAAA;AAAA,IAChC,CACD,GAEDV,EAAA;AAAA,EAAY,GAGRW,IAAc,CAACC,MAAoB;AACvC,IAAA1B,EAAO,OAAO,MAAM;AAClB,YAAMkB,IAAYC,EAAA;AAClB,UAAIG,EAAkBJ,CAAS,GAAG;AAChC,cAAMS,IAAaT,EAAU,OAAO,QAAA,GAC9BU,IAAcC,GAAiCF,CAAU;AAE/D,YAAIG,GAAiBF,CAAW;AAC9B,kBAAQF,GAAA;AAAA,YACN,KAAK;AAAA,YACL,KAAK;AACH,cAAAK,GAAUH,GAAaF,CAAM;AAC7B;AAAA,YACF,KAAK;AACH,cAAAM,GAAUJ,CAAW;AACrB;AAAA,YACF,KAAK;AAAA,YACL,KAAK;AACH,cAAAK,GAAaL,GAAaF,CAAM;AAChC;AAAA,YACF,KAAK;AACH,cAAAQ,GAAaN,CAAW;AACxB;AAAA,YACF,KAAK;AACH,cAAAO,GAAYP,CAAW;AACvB;AAAA,UAAA;AAAA,MAEN;AAAA,IACF,CACD;AAAA,EAAA,GAGGf,IAAgB;AAAA,IACpB,UACE,gBAAApF;AAAA,MAACsD;AAAA,MAAA;AAAA,QACC,gBAAgB+B;AAAA,QAChB,eAAe,CAACsB,GAAMC,MAAYtB,EAAYqB,GAAMC,CAAO;AAAA,QAC3D,KAAK9B;AAAA,MAAA;AAAA,IAAA;AAAA,EACP;AAIJ,SAAAd,EAAU,MAAM;AACd,IAAKY,KAIHI,EAAY,UAAU,IACtBF,EAAa,SAAS,gBAAA,MAJtBA,EAAa,SAAS,UAAA,GACtB,WAAW,MAAOE,EAAY,UAAU,IAAQZ,EAAkB;AAAA,EAIpE,GACC,CAACU,GAAcF,CAAS,CAAC,GAE5BZ,EAAU,MAAM;AACd,UAAM6C,IAAyBtC,EAAO;AAAA,MACpCuC;AAAAA,MACA,CAACxE,MACKA,EAAM,WAAWA,EAAM,YAAYA,EAAM,SAAS,YACpDA,EAAM,eAAA,GACN4C,EAAA,GACO,MAEF;AAAA,MAET6B;AAAAA,IAAA;AAGF,WAAO,MAAM;AACX,MAAAF,EAAA;AAAA,IAAuB;AAAA,EACzB,GAEC,CAACtC,CAAM,CAAC,GAEXP,EAAU,MAAM;AACd,IAAAiB,EAAa,UAAUL;AAAA,EAAA,GACtB,CAACA,CAAS,CAAC,GAEdZ,EAAU,MAAM;AACd,UAAMgD,IAAgB,CAAC1E,MAAyB;AAC9C,MAAIA,EAAM,QAAQ,YAAY2C,EAAa,YACzC3C,EAAM,eAAA,GACNA,EAAM,gBAAA,GACN+C,EAAA;AAAA,IACF;AAGF,oBAAS,iBAAiB,WAAW2B,GAAe,EAAE,SAAS,IAAM,GAE9D,MAAM;AACX,eAAS,oBAAoB,WAAWA,CAAa;AAAA,IAAA;AAAA,EACvD,GAEC,EAAE,GAEL/D,EAAoBjC,GAAK,OAAO;AAAA,IAC9B,aAAAgF;AAAA,EAAA,EACA,GAGA,gBAAAhG,EAAC,OAAA,EAAI,WAAWD,EAAO,8BAA8B,GACnD,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAWC,EAAO,sCAAsC,GAC3D,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASkF;AAAA,QACT,OAAOjE,EAAE,MAAM;AAAA,QACf,WAAWR,EAAKV,EAAO,wBAAwB,GAAGuE,KAAYvE,EAAO,gCAAgC,CAAC;AAAA,QACtG,cAAYkB,EAAE,KAAK,OAAO;AAAA,QAC1B,qBAAmBA,EAAE,KAAK,aAAa;AAAA,QACvC,KAAK8D;AAAA,QACL,MAAK;AAAA,QAEL,UAAA,gBAAA/E,EAACoD,GAAA,EAAK,MAAK,SAAQ,MAAM,GAAA,CAAI;AAAA,MAAA;AAAA,IAAA;AAAA,IAE9BqB;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAEJ,CAAC;"}

package/dist/components/CheckboxTree/CheckboxTree.js

@@ -17,7 +17,7 @@ import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "../InputField/InputField.js";
 import "react-router";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -25,7 +25,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 import { useResponsive as N } from "../hooks/useResponsive.js";
 import '../../assets/CheckboxTree.css';const a = {
   "checkbox-tree__header": "_checkbox-tree__header_l338d_1",

package/dist/components/FormInput/FormInput.js

@@ -16,7 +16,7 @@ import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "../InputField/InputField.js";
 import "react-router";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -24,7 +24,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 import '../../assets/FormInput.css';const o = {
   "form-input__container": "_form-input__container_c0vpz_1",
   "form-input__container--label-left": "_form-input__container--label-left_c0vpz_7",

package/dist/components/InputField/InputField.stories.js

@@ -16,7 +16,7 @@ import "../GridRow/GridRow.js";
 import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "react-router";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -24,7 +24,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 const C = `
 // Has all HTMLInputElement props available except "className" and "style" 
 <InputField aria-labelledby={aria-labelledby} id={id} onChange={onChangeFunction}

package/dist/components/MultiSelect/MultiSelect.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "../../clsx-OuTLNxxd.js";
 import "../../MultiSelectItem-DbOdEllV.js";
-import { M as p } from "../../TablePlugin-Dmy98Epb.js";
+import { M as p } from "../../TablePlugin-oF-gInNx.js";
 export {
   p as MultiSelect
 };

package/dist/components/MultiSelect/MultiSelect.stories.js

@@ -1,7 +1,7 @@
 import { jsxs as S, jsx as r } from "react/jsx-runtime";
 import { l as d } from "../../index-C2E9FY6V.js";
 import { useState as p } from "react";
-import { M as e } from "../../TablePlugin-Dmy98Epb.js";
+import { M as e } from "../../TablePlugin-oF-gInNx.js";
 import { Container as M } from "../../storyComponents/Container/Container.js";
 const C = `
   // MultiSelectHeader can be added optionally

package/dist/components/MultiSelect/components/MultiSelectHeader.js

@@ -15,7 +15,7 @@ import "../../IconButton/IconButton.js";
 import "../../Input/Input.js";
 import "../../InputField/InputField.js";
 import "react-router";
-import { a as y } from "../../../TablePlugin-Dmy98Epb.js";
+import { a as y } from "../../../TablePlugin-oF-gInNx.js";
 import "../../RteEditor/Providers/LanguageProvider.js";
 import "../../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../../RteEditor/hooks/components/Flyout.js";
@@ -23,7 +23,7 @@ import "../../../index-nrPtQ1dv.js";
 import "../../SelectListbox/SelectListbox.js";
 import "../../SelectListbox/SelectProvider.js";
 import "../../Sortable/components/SortableItem.js";
-import "../../../SortableProvider-C2T7b-pm.js";
+import "../../../SortableProvider-DisCfTTN.js";
 export {
   y as MultiSelectHeader
 };

package/dist/components/MultiSelect/index.js

@@ -1,4 +1,4 @@
-import { M as l } from "../../TablePlugin-Dmy98Epb.js";
+import { M as l } from "../../TablePlugin-oF-gInNx.js";
 export {
   l as MultiSelect
 };

package/dist/components/PeriodSelector/PeriodSelector.js

@@ -17,7 +17,7 @@ import "../Input/Input.js";
 import "../InputField/InputField.js";
 import { Label as B } from "../Label/Label.js";
 import "react-router";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -25,7 +25,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 import '../../assets/PeriodSelector.css';const s = {
   "period-selector__container": "_period-selector__container_d1p0j_1",
   "period-selector__container--label-left": "_period-selector__container--label-left_d1p0j_6",

package/dist/components/ProgrammeCard/ProgrammeCard.stories.js

@@ -17,7 +17,7 @@ import "../GridRow/GridRow.js";
 import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "../InputField/InputField.js";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -25,7 +25,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 const p = "<ProgrammeCard key={key} header={header} details={details} href={href} />", J = {
   title: "Atoms/ProgrammeCard",
   component: o,

package/dist/components/RadioTabSelector/RadioTabSelector.js

@@ -17,7 +17,7 @@ import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "../InputField/InputField.js";
 import "react-router";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../RteEditor/hooks/components/Flyout.js";
@@ -25,7 +25,7 @@ import "../../index-nrPtQ1dv.js";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 import '../../assets/RadioTabSelector.css';const t = {
   "radio-tab-selector-button-bar__container": "_radio-tab-selector-button-bar__container_a4wnc_1",
   "radio-tab-selector-button-bar__container--label-left": "_radio-tab-selector-button-bar__container--label-left_a4wnc_6",

package/dist/components/RteEditor/EditorHeader/EditorHeader.js

@@ -14,7 +14,7 @@ import "../../IconButton/IconButton.js";
 import "../../Input/Input.js";
 import "../../InputField/InputField.js";
 import "react-router";
-import "../../../TablePlugin-Dmy98Epb.js";
+import "../../../TablePlugin-oF-gInNx.js";
 import "../Providers/LanguageProvider.js";
 import "../Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "../hooks/components/Flyout.js";
@@ -22,7 +22,7 @@ import "../../../index-nrPtQ1dv.js";
 import "../../SelectListbox/SelectListbox.js";
 import "../../SelectListbox/SelectProvider.js";
 import "../../Sortable/components/SortableItem.js";
-import "../../../SortableProvider-C2T7b-pm.js";
+import "../../../SortableProvider-DisCfTTN.js";
 import '../../../assets/EditorHeader.css';const t = {
   "editor-header__container": "_editor-header__container_9khdz_1",
   "editor-header__info": "_editor-header__info_9khdz_10"

package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js

@@ -17,7 +17,7 @@ import "../../../IconButton/IconButton.js";
 import "../../../Input/Input.js";
 import "../../../InputField/InputField.js";
 import "react-router";
-import "../../../../TablePlugin-Dmy98Epb.js";
+import "../../../../TablePlugin-oF-gInNx.js";
 import { s as r } from "../../../../RteEditor.module-B_3uFnFu.js";
 import { useTranslation as x } from "../../hooks/useTranslation.js";
 import "../LinkPlugin/LinkContextMenu/LinkContextMenu.js";
@@ -27,7 +27,7 @@ import "../../../../index-nrPtQ1dv.js";
 import "../../../SelectListbox/SelectListbox.js";
 import "../../../SelectListbox/SelectProvider.js";
 import "../../../Sortable/components/SortableItem.js";
-import "../../../../SortableProvider-C2T7b-pm.js";
+import "../../../../SortableProvider-DisCfTTN.js";
 const Z = () => {
   const o = x(), [t] = h(), [p, d] = s(!1), [l, c] = s(!1), u = () => {
     t.dispatchCommand(y, void 0);

package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { A as D } from "../../../../../TablePlugin-Dmy98Epb.js";
+import { A as D } from "../../../../../TablePlugin-oF-gInNx.js";
 import "../../../../../helpers-CMG0anwr.js";
 import "../../../../Icon/Icon.js";
 import "../../../../Buttons/Button.js";
@@ -27,7 +27,7 @@ import "../../../../../index-nrPtQ1dv.js";
 import "../../../../SelectListbox/SelectListbox.js";
 import "../../../../SelectListbox/SelectProvider.js";
 import "../../../../Sortable/components/SortableItem.js";
-import "../../../../../SortableProvider-C2T7b-pm.js";
+import "../../../../../SortableProvider-DisCfTTN.js";
 export {
   D as AddLinkForm
 };

package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js

@@ -4,7 +4,7 @@ import { c as W } from "../../../../clsx-OuTLNxxd.js";
 import { p as O, k as Y, v as G } from "../../../../LexicalLink.prod-DoU9RL94.js";
 import { useRef as a, useState as J, useEffect as m } from "react";
 import { _ as Q, N as f, q as Z, aq as $, c as N, L as tt, m as et, X as ot } from "../../../../Lexical.prod-B84LhBo3.js";
-import { A as rt } from "../../../../TablePlugin-Dmy98Epb.js";
+import { A as rt } from "../../../../TablePlugin-oF-gInNx.js";
 import { e as nt } from "../../../../helpers-CMG0anwr.js";
 import { LinkContextMenu as it } from "./LinkContextMenu/LinkContextMenu.js";
 import { useFlyout as st } from "../../hooks/useFlyout.js";
@@ -30,7 +30,7 @@ import "../../../../index-nrPtQ1dv.js";
 import "../../../SelectListbox/SelectListbox.js";
 import "../../../SelectListbox/SelectProvider.js";
 import "../../../Sortable/components/SortableItem.js";
-import "../../../../SortableProvider-C2T7b-pm.js";
+import "../../../../SortableProvider-DisCfTTN.js";
 const ut = 200, z = (p) => {
   let n = p;
   for (; n; ) {

package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { b as B } from "../../../../TablePlugin-Dmy98Epb.js";
+import { b as B } from "../../../../TablePlugin-oF-gInNx.js";
 import "../../../Buttons/Button.js";
 import "../../../Buttons/LinkButton.js";
 import "@react-aria/button";
@@ -25,7 +25,7 @@ import "../../../../index-nrPtQ1dv.js";
 import "../../../SelectListbox/SelectListbox.js";
 import "../../../SelectListbox/SelectProvider.js";
 import "../../../Sortable/components/SortableItem.js";
-import "../../../../SortableProvider-C2T7b-pm.js";
+import "../../../../SortableProvider-DisCfTTN.js";
 export {
   B as AddTableForm
 };

package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js

@@ -4,7 +4,7 @@ import "../../../../clsx-OuTLNxxd.js";
 import "../../../../LexicalTable.prod-9xjyWB0C.js";
 import "../../../../Lexical.prod-B84LhBo3.js";
 import "react";
-import { T as F } from "../../../../TablePlugin-Dmy98Epb.js";
+import { T as F } from "../../../../TablePlugin-oF-gInNx.js";
 import "./helpers.js";
 import "../../hooks/useFlyout.js";
 import "../../../Icon/Icon.js";
@@ -29,7 +29,7 @@ import "../../../../index-nrPtQ1dv.js";
 import "../../../SelectListbox/SelectListbox.js";
 import "../../../SelectListbox/SelectProvider.js";
 import "../../../Sortable/components/SortableItem.js";
-import "../../../../SortableProvider-C2T7b-pm.js";
+import "../../../../SortableProvider-DisCfTTN.js";
 export {
   F as TablePlugin
 };

package/dist/components/RteEditor/Plugins/TablePlugin/index.js

@@ -1,4 +1,4 @@
-import { T as o } from "../../../../TablePlugin-Dmy98Epb.js";
+import { T as o } from "../../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as t } from "./TableCellContextMenu/TableCellContextMenu.js";
 export {
   t as TableCellContextMenu,

package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js

@@ -7,7 +7,7 @@ import { BlockFormatPlugin as T } from "../BlockFormatPlugin/BlockFormatPlugin.j
 import { ListPlugin as k } from "../ListPlugin/ListPlugin.js";
 import { LinkPlugin as x } from "../LinkPlugin/LinkPlugin.js";
 import { HistoryPlugin as B } from "../HistoryPlugin/HistoryPlugin.js";
-import { T as S } from "../../../../TablePlugin-Dmy98Epb.js";
+import { T as S } from "../../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as z } from "../TablePlugin/TableCellContextMenu/TableCellContextMenu.js";
 import { s as A } from "../../../../RteEditor.module-B_3uFnFu.js";
 import { setScrollableContainers as b, removeScrollableContainers as K } from "../../helpers.js";

package/dist/components/RteEditor/Plugins/index.js

@@ -3,7 +3,7 @@ import { BlockFormatPlugin as l } from "./BlockFormatPlugin/BlockFormatPlugin.js
 import { ListPlugin as n } from "./ListPlugin/ListPlugin.js";
 import { LinkPlugin as m, getLinkNodeTag as x } from "./LinkPlugin/LinkPlugin.js";
 import { HistoryPlugin as p } from "./HistoryPlugin/HistoryPlugin.js";
-import { T as a } from "../../../TablePlugin-Dmy98Epb.js";
+import { T as a } from "../../../TablePlugin-oF-gInNx.js";
 import { TableCellContextMenu as T } from "./TablePlugin/TableCellContextMenu/TableCellContextMenu.js";
 export {
   l as BlockFormatPlugin,

package/dist/components/RteEditor/RteEditor.js

@@ -16,7 +16,7 @@ import { exportMap as ir, isStartingWithHtmlTag as lr, mergeBoldStrongTags as ur
 import { s as I } from "../../RteEditor.module-B_3uFnFu.js";
 import { ToolBarPlugin as cr } from "./Plugins/ToolbarPlugin/ToolbarPlugin.js";
 import { useTranslation as dr } from "./hooks/useTranslation.js";
-import "../../TablePlugin-Dmy98Epb.js";
+import "../../TablePlugin-oF-gInNx.js";
 import "./Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
 import "./hooks/components/Flyout.js";
 import "../Buttons/Button.js";
@@ -36,7 +36,7 @@ import "react-router";
 import "../SelectListbox/SelectListbox.js";
 import "../SelectListbox/SelectProvider.js";
 import "../Sortable/components/SortableItem.js";
-import "../../SortableProvider-C2T7b-pm.js";
+import "../../SortableProvider-DisCfTTN.js";
 import { UvaTheme as mr } from "./UvaTheme/UvaTheme.js";
 import { EditorHeader as pr } from "./EditorHeader/EditorHeader.js";
 import { LanguageProvider as gr, useLanguage as hr } from "./Providers/LanguageProvider.js";

package/dist/components/Sortable/Sortable.d.ts

@@ -2,9 +2,11 @@ import { ReactElement } from 'react';
 import { SortableItemProps } from './components/SortableItem';
 export type Index = string | number;
 export type SortableItemColors = 'grey-200' | 'white';
-export interface SortableProps {
+export interface SortableProps<T = unknown> {
     /** The elements to show inside the Sortable. */
     children: ReactElement[] | string[];
+    /** The data objects that are actually being sorted. */
+    childrenData?: T[];
     /** The placement of each item Handle (6 dots 2x3). */
     ItemHandlePlacement?: SortableItemProps['handlePlacement'];
     /** If true, a scrollable version of the list will be rendered (max height 21rem/336px). */
@@ -16,6 +18,6 @@ export interface SortableProps {
     /** Change the color of the SortableItem wrapper. */
     sortableItemColor?: SortableItemColors;
     /** The callback function that is invoked when new sorting takes place. */
-    onSort?: (items: (string | ReactElement)[]) => void;
+    onSort?: (items: T[]) => void;
 }
-export declare const Sortable: ({ children, ItemHandlePlacement, scrollable, disabled, onSort, hideNumbers, sortableItemColor, }: SortableProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Sortable: <T>({ children, childrenData, ItemHandlePlacement, scrollable, disabled, onSort, hideNumbers, sortableItemColor, }: SortableProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Sortable/Sortable.js

@@ -1,37 +1,42 @@
 import { jsx as o } from "react/jsx-runtime";
-import { Children as e } from "react";
-import { SortableItem as p } from "./components/SortableItem.js";
-import { S as f } from "../../SortableProvider-C2T7b-pm.js";
-const u = ({
-  children: r,
-  ItemHandlePlacement: m = "left",
-  scrollable: a,
-  disabled: l,
+import { Children as a } from "react";
+import { SortableItem as f } from "./components/SortableItem.js";
+import { S as I } from "../../SortableProvider-DisCfTTN.js";
+const P = ({
+  children: t,
+  childrenData: m,
+  ItemHandlePlacement: s = "left",
+  scrollable: l,
+  disabled: n,
   onSort: i,
-  hideNumbers: s,
+  hideNumbers: p,
   sortableItemColor: b = "grey-200"
-}) => /* @__PURE__ */ o(
-  f,
-  {
-    items: r,
-    scrollable: a,
-    hideNumbers: s,
-    onSort: i,
-    children: r.map((n, t) => /* @__PURE__ */ o(
-      p,
-      {
-        handlePlacement: m,
-        disabled: l || e.count(r) <= 1,
-        sortableItemColor: b,
-        index: t,
-        children: n
-      },
-      `sortable-item-${t}`
-    ))
-  },
-  `sortable-with-children-${e.count(r)}`
-);
+}) => {
+  const d = m ?? t, r = t.map((c, e) => /* @__PURE__ */ o(
+    f,
+    {
+      handlePlacement: s,
+      disabled: n || a.count(t) <= 1,
+      sortableItemColor: b,
+      index: e,
+      children: c
+    },
+    `sortable-item-${e}`
+  ));
+  return /* @__PURE__ */ o(
+    I,
+    {
+      renderItems: r,
+      dataItems: d,
+      scrollable: l,
+      hideNumbers: p,
+      onSort: i,
+      children: r
+    },
+    `sortable-with-children-${a.count(t)}`
+  );
+};
 export {
-  u as Sortable
+  P as Sortable
 };
 //# sourceMappingURL=Sortable.js.map

package/dist/components/Sortable/Sortable.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sortable.js","sources":["../../../src/components/Sortable/Sortable.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport type { ReactElement } from 'react';\nimport type { SortableItemProps } from './components/SortableItem';\n\nimport { SortableItem } from './components/SortableItem';\nimport { SortableProvider } from './SortableProvider';\n\nexport type Index = string | number;\nexport type SortableItemColors = 'grey-200' | 'white';\n\nexport interface SortableProps {\n  /** The elements to show inside the Sortable. */\n  children: ReactElement[] | string[];\n  /** The placement of each item Handle (6 dots 2x3). */\n  ItemHandlePlacement?: SortableItemProps['handlePlacement'];\n  /** If true, a scrollable version of the list will be rendered (max height 21rem/336px). */\n  scrollable?: boolean;\n  /** If true, the sorting will be disabled. */\n  disabled?: boolean;\n  /** Hide the numbers shown next to the sortable elements. */\n  hideNumbers?: boolean;\n  /** Change the color of the SortableItem wrapper. */\n  sortableItemColor?: SortableItemColors;\n  /** The callback function that is invoked when new sorting takes place. */\n  onSort?: (items: (string | ReactElement)[]) => void;\n}\n\n// A component that renders a list of children that can be sorted with drag and drop.\nexport const Sortable = ({\n  children,\n  ItemHandlePlacement = 'left',\n  scrollable,\n  disabled,\n  onSort,\n  hideNumbers,\n  sortableItemColor = 'grey-200',\n}: SortableProps) => {\n  return (\n    <SortableProvider\n      items={children}\n      scrollable={scrollable}\n      hideNumbers={hideNumbers}\n      onSort={onSort}\n      key={`sortable-with-children-${Children.count(children)}`}\n    >\n      {children.map((child, index) => (\n        <SortableItem\n          handlePlacement={ItemHandlePlacement}\n          disabled={disabled || Children.count(children) <= 1}\n          sortableItemColor={sortableItemColor}\n          index={index}\n          key={`sortable-item-${index}`}\n        >\n          {child}\n        </SortableItem>\n      ))}\n    </SortableProvider>\n  );\n};\n"],"names":["Sortable","children","ItemHandlePlacement","scrollable","disabled","onSort","hideNumbers","sortableItemColor","jsx","SortableProvider","child","index","SortableItem","Children"],"mappings":";;;;AA6BO,MAAMA,IAAW,CAAC;AAAA,EACvB,UAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC,IAAoB;AACtB,MAEI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,OAAOR;AAAA,IACP,YAAAE;AAAA,IACA,aAAAG;AAAA,IACA,QAAAD;AAAA,IAGC,UAAAJ,EAAS,IAAI,CAACS,GAAOC,MACpB,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,iBAAiBV;AAAA,QACjB,UAAUE,KAAYS,EAAS,MAAMZ,CAAQ,KAAK;AAAA,QAClD,mBAAAM;AAAA,QACA,OAAAI;AAAA,QAGC,UAAAD;AAAA,MAAA;AAAA,MAFI,iBAAiBC,CAAK;AAAA,IAAA,CAI9B;AAAA,EAAA;AAAA,EAZI,0BAA0BE,EAAS,MAAMZ,CAAQ,CAAC;AAAA;"}
+{"version":3,"file":"Sortable.js","sources":["../../../src/components/Sortable/Sortable.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport type { ReactElement } from 'react';\nimport type { SortableItemProps } from './components/SortableItem';\n\nimport { SortableItem } from './components/SortableItem';\nimport { SortableProvider } from './SortableProvider';\n\nexport type Index = string | number;\nexport type SortableItemColors = 'grey-200' | 'white';\n\nexport interface SortableProps<T = unknown> {\n  /** The elements to show inside the Sortable. */\n  children: ReactElement[] | string[];\n  /** The data objects that are actually being sorted. */\n  childrenData?: T[];\n  /** The placement of each item Handle (6 dots 2x3). */\n  ItemHandlePlacement?: SortableItemProps['handlePlacement'];\n  /** If true, a scrollable version of the list will be rendered (max height 21rem/336px). */\n  scrollable?: boolean;\n  /** If true, the sorting will be disabled. */\n  disabled?: boolean;\n  /** Hide the numbers shown next to the sortable elements. */\n  hideNumbers?: boolean;\n  /** Change the color of the SortableItem wrapper. */\n  sortableItemColor?: SortableItemColors;\n  /** The callback function that is invoked when new sorting takes place. */\n  onSort?: (items: T[]) => void;\n}\n\n// A component that renders a list of children that can be sorted with drag and drop.\nexport const Sortable = <T,>({\n  children,\n  childrenData,\n  ItemHandlePlacement = 'left',\n  scrollable,\n  disabled,\n  onSort,\n  hideNumbers,\n  sortableItemColor = 'grey-200',\n}: SortableProps<T>) => {\n  const sortableData: T[] = childrenData ?? (children as unknown as T[]);\n\n  const wrappedItems = children.map((child, index) => (\n    <SortableItem\n      handlePlacement={ItemHandlePlacement}\n      disabled={disabled || Children.count(children) <= 1}\n      sortableItemColor={sortableItemColor}\n      index={index}\n      key={`sortable-item-${index}`}\n    >\n      {child}\n    </SortableItem>\n  ));\n\n  return (\n    <SortableProvider\n      renderItems={wrappedItems}\n      dataItems={sortableData}\n      scrollable={scrollable}\n      hideNumbers={hideNumbers}\n      onSort={onSort}\n      key={`sortable-with-children-${Children.count(children)}`}\n    >\n      {wrappedItems}\n    </SortableProvider>\n  );\n};\n"],"names":["Sortable","children","childrenData","ItemHandlePlacement","scrollable","disabled","onSort","hideNumbers","sortableItemColor","sortableData","wrappedItems","child","index","jsx","SortableItem","Children","SortableProvider"],"mappings":";;;;AA+BO,MAAMA,IAAW,CAAK;AAAA,EAC3B,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC,IAAoB;AACtB,MAAwB;AACtB,QAAMC,IAAoBP,KAAiBD,GAErCS,IAAeT,EAAS,IAAI,CAACU,GAAOC,MACxC,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,iBAAiBX;AAAA,MACjB,UAAUE,KAAYU,EAAS,MAAMd,CAAQ,KAAK;AAAA,MAClD,mBAAAO;AAAA,MACA,OAAAI;AAAA,MAGC,UAAAD;AAAA,IAAA;AAAA,IAFI,iBAAiBC,CAAK;AAAA,EAAA,CAI9B;AAED,SACE,gBAAAC;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,aAAaN;AAAA,MACb,WAAWD;AAAA,MACX,YAAAL;AAAA,MACA,aAAAG;AAAA,MACA,QAAAD;AAAA,MAGC,UAAAI;AAAA,IAAA;AAAA,IAFI,0BAA0BK,EAAS,MAAMd,CAAQ,CAAC;AAAA,EAAA;AAK7D;"}

package/dist/components/Sortable/Sortable.stories.d.ts

@@ -2,6 +2,6 @@ import { Meta } from '@storybook/react';
 import { SortableProps } from './Sortable';
 declare const _default: Meta<SortableProps>;
 export default _default;
-export declare const SortableExample: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps>;
-export declare const withHandleRight: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps>;
-export declare const WithComplexChildren: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps>;
+export declare const SortableExample: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps<unknown>>;
+export declare const withHandleRight: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps<unknown>>;
+export declare const WithComplexChildren: import('storybook/internal/csf').AnnotatedStoryFn<import('@storybook/react').ReactRenderer, SortableProps<unknown>>;

package/dist/components/Sortable/Sortable.stories.js

@@ -1,15 +1,15 @@
-import { jsx as e, jsxs as m, Fragment as i } from "react/jsx-runtime";
+import { jsx as e, jsxs as i, Fragment as m } from "react/jsx-runtime";
 import { l as s } from "../../index-C2E9FY6V.js";
-import { Sortable as o } from "./Sortable.js";
+import { Sortable as l } from "./Sortable.js";
 import { InputField as d } from "../InputField/InputField.js";
 import { Icon as c } from "../Icon/Icon.js";
 import { Button as b } from "../Buttons/Button.js";
 import "../Buttons/LinkButton.js";
 import "@react-aria/button";
 const p = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} 
-    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `, j = {
+    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `, F = {
   title: "Organisms/Sortable",
-  component: o,
+  component: l,
   argTypes: {
     children: {
       table: {
@@ -23,13 +23,13 @@ const p = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlac
     }
   },
   parameters: {
-    inspectComponent: o,
+    inspectComponent: l,
     codeString: p
   }
 }, r = {
   ItemHandlePlacement: "left",
   onSort: s()
-}, a = ["Item-1", "Item-2", "Item-3", "Item-4", "Item-5"], n = (l) => /* @__PURE__ */ e(o, { ...l, children: a }), h = n.bind({});
+}, a = ["Item-1", "Item-2", "Item-3", "Item-4", "Item-5"], n = (o) => /* @__PURE__ */ e(l, { ...o, children: a }), h = n.bind({});
 h.args = {
   ...r
 };
@@ -38,17 +38,24 @@ I.args = {
   ...r,
   ItemHandlePlacement: "right"
 };
-const f = (l) => /* @__PURE__ */ e(o, { ...l, children: a.map((t) => /* @__PURE__ */ m(i, { children: [
+const u = (o) => /* @__PURE__ */ e(l, { ...o, children: a.map((t) => /* @__PURE__ */ i(m, { children: [
   /* @__PURE__ */ e("div", { style: { width: "100%" }, children: /* @__PURE__ */ e(d, { id: t, placeholder: t }, t) }),
   /* @__PURE__ */ e(b, { variant: "blank-icon", children: /* @__PURE__ */ e(c, { name: "Trash", color: "#a0002aff" }) })
-] }, t)) }), g = f.bind({});
-g.args = {
-  ...r
+] }, t)) }), f = u.bind({});
+f.args = {
+  ...r,
+  childrenData: [
+    { title: "item-1", value: 1 },
+    { title: "item-2", value: 2 },
+    { title: "item-3", value: 3 },
+    { title: "item-4", value: 4 },
+    { title: "item-5", value: 5 }
+  ]
 };
 export {
   h as SortableExample,
-  g as WithComplexChildren,
-  j as default,
+  f as WithComplexChildren,
+  F as default,
   I as withHandleRight
 };
 //# sourceMappingURL=Sortable.stories.js.map

package/dist/components/Sortable/Sortable.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sortable.stories.js","sources":["../../../src/components/Sortable/Sortable.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\nimport { Fragment } from 'react/jsx-runtime';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { SortableProps } from './Sortable';\n\nimport { Sortable } from './Sortable';\n\nimport { InputField } from 'components/InputField';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Buttons';\n\nconst codeString = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} \n    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Organisms/Sortable',\n  component: Sortable,\n  argTypes: {\n    children: {\n      table: {\n        disable: true,\n      },\n    },\n    ItemHandlePlacement: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n  parameters: {\n    inspectComponent: Sortable,\n    codeString: codeString,\n  },\n} as Meta<SortableProps>;\n\nconst defaultArgs: Partial<SortableProps> = {\n  ItemHandlePlacement: 'left',\n  onSort: fn(),\n};\n\nconst mockItems = ['Item-1', 'Item-2', 'Item-3', 'Item-4', 'Item-5'];\n\nconst Template: StoryFn<SortableProps> = (args) => <Sortable {...args}>{mockItems}</Sortable>;\n\nexport const SortableExample = Template.bind({});\nSortableExample.args = {\n  ...defaultArgs,\n};\n\nexport const withHandleRight = Template.bind({});\nwithHandleRight.args = {\n  ...defaultArgs,\n  ItemHandlePlacement: 'right',\n};\n\nconst TemplateComplex: StoryFn<SortableProps> = (args) => (\n  <Sortable {...args}>\n    {mockItems.map((item) => (\n      <Fragment key={item}>\n        <div style={{ width: '100%' }}>\n          <InputField key={item} id={item} placeholder={item} />\n        </div>\n        <Button variant=\"blank-icon\">\n          <Icon name=\"Trash\" color=\"#a0002aff\" />\n        </Button>\n      </Fragment>\n    ))}\n  </Sortable>\n);\n\nexport const WithComplexChildren = TemplateComplex.bind({});\nWithComplexChildren.args = {\n  ...defaultArgs,\n};\n"],"names":["codeString","Sortable_stories","Sortable","defaultArgs","fn","mockItems","Template","args","SortableExample","withHandleRight","TemplateComplex","jsx","item","jsxs","Fragment","InputField","Button","Icon","WithComplexChildren"],"mappings":";;;;;;;;AAYA,MAAMA,IAAa;AAAA,8HAInBC,IAAe;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,qBAAqB;AAAA,MACnB,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EACF;AAAA,EAEF,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAsC;AAAA,EAC1C,qBAAqB;AAAA,EACrB,QAAQC,EAAA;AACV,GAEMC,IAAY,CAAC,UAAU,UAAU,UAAU,UAAU,QAAQ,GAE7DC,IAAmC,CAACC,wBAAUL,GAAA,EAAU,GAAGK,GAAO,UAAAF,GAAU,GAErEG,IAAkBF,EAAS,KAAK,CAAA,CAAE;AAC/CE,EAAgB,OAAO;AAAA,EACrB,GAAGL;AACL;AAEO,MAAMM,IAAkBH,EAAS,KAAK,CAAA,CAAE;AAC/CG,EAAgB,OAAO;AAAA,EACrB,GAAGN;AAAA,EACH,qBAAqB;AACvB;AAEA,MAAMO,IAA0C,CAACH,MAC/C,gBAAAI,EAACT,GAAA,EAAU,GAAGK,GACX,UAAAF,EAAU,IAAI,CAACO,MACd,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAH,EAAC,OAAA,EAAI,OAAO,EAAE,OAAO,OAAA,GACnB,UAAA,gBAAAA,EAACI,GAAA,EAAsB,IAAIH,GAAM,aAAaA,EAAA,GAA7BA,CAAmC,GACtD;AAAA,EACA,gBAAAD,EAACK,GAAA,EAAO,SAAQ,cACd,UAAA,gBAAAL,EAACM,KAAK,MAAK,SAAQ,OAAM,YAAA,CAAY,EAAA,CACvC;AAAA,KANaL,CAOf,CACD,GACH,GAGWM,IAAsBR,EAAgB,KAAK,CAAA,CAAE;AAC1DQ,EAAoB,OAAO;AAAA,EACzB,GAAGf;AACL;"}
+{"version":3,"file":"Sortable.stories.js","sources":["../../../src/components/Sortable/Sortable.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\nimport { Fragment } from 'react/jsx-runtime';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { SortableProps } from './Sortable';\n\nimport { Sortable } from './Sortable';\n\nimport { InputField } from 'components/InputField';\nimport { Icon } from 'components/Icon';\nimport { Button } from 'components/Buttons';\n\nconst codeString = `<Sortable onSort={onSortFunction} ItemHandlePlacement={ItemHandlePlacement} scrollable={scrollable} \n    disabled={ disabled } hideNumbers={ hideNumbers } sortableItemColor={ sortableItemColor } > { children } </ Sortable > `;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n  title: 'Organisms/Sortable',\n  component: Sortable,\n  argTypes: {\n    children: {\n      table: {\n        disable: true,\n      },\n    },\n    ItemHandlePlacement: {\n      table: {\n        disable: true,\n      },\n    },\n  },\n  parameters: {\n    inspectComponent: Sortable,\n    codeString: codeString,\n  },\n} as Meta<SortableProps>;\n\nconst defaultArgs: Partial<SortableProps> = {\n  ItemHandlePlacement: 'left',\n  onSort: fn(),\n};\n\nconst mockItems = ['Item-1', 'Item-2', 'Item-3', 'Item-4', 'Item-5'];\n\nconst Template: StoryFn<SortableProps> = (args) => <Sortable {...args}>{mockItems}</Sortable>;\n\nexport const SortableExample = Template.bind({});\nSortableExample.args = {\n  ...defaultArgs,\n};\n\nexport const withHandleRight = Template.bind({});\nwithHandleRight.args = {\n  ...defaultArgs,\n  ItemHandlePlacement: 'right',\n};\n\nconst TemplateComplex: StoryFn<SortableProps> = (args) => (\n  <Sortable {...args}>\n    {mockItems.map((item) => (\n      <Fragment key={item}>\n        <div style={{ width: '100%' }}>\n          <InputField key={item} id={item} placeholder={item} />\n        </div>\n        <Button variant=\"blank-icon\">\n          <Icon name=\"Trash\" color=\"#a0002aff\" />\n        </Button>\n      </Fragment>\n    ))}\n  </Sortable>\n);\n\nexport const WithComplexChildren = TemplateComplex.bind({});\nWithComplexChildren.args = {\n  ...defaultArgs,\n  childrenData: [\n    { title: 'item-1', value: 1 },\n    { title: 'item-2', value: 2 },\n    { title: 'item-3', value: 3 },\n    { title: 'item-4', value: 4 },\n    { title: 'item-5', value: 5 },\n  ],\n};\n"],"names":["codeString","Sortable_stories","Sortable","defaultArgs","fn","mockItems","Template","args","SortableExample","withHandleRight","TemplateComplex","jsx","item","jsxs","Fragment","InputField","Button","Icon","WithComplexChildren"],"mappings":";;;;;;;;AAYA,MAAMA,IAAa;AAAA,8HAInBC,IAAe;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,IAEF,qBAAqB;AAAA,MACnB,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EACF;AAAA,EAEF,YAAY;AAAA,IACV,kBAAkBA;AAAA,IAClB,YAAAF;AAAA,EAAA;AAEJ,GAEMG,IAAsC;AAAA,EAC1C,qBAAqB;AAAA,EACrB,QAAQC,EAAA;AACV,GAEMC,IAAY,CAAC,UAAU,UAAU,UAAU,UAAU,QAAQ,GAE7DC,IAAmC,CAACC,wBAAUL,GAAA,EAAU,GAAGK,GAAO,UAAAF,GAAU,GAErEG,IAAkBF,EAAS,KAAK,CAAA,CAAE;AAC/CE,EAAgB,OAAO;AAAA,EACrB,GAAGL;AACL;AAEO,MAAMM,IAAkBH,EAAS,KAAK,CAAA,CAAE;AAC/CG,EAAgB,OAAO;AAAA,EACrB,GAAGN;AAAA,EACH,qBAAqB;AACvB;AAEA,MAAMO,IAA0C,CAACH,MAC/C,gBAAAI,EAACT,GAAA,EAAU,GAAGK,GACX,UAAAF,EAAU,IAAI,CAACO,MACd,gBAAAC,EAACC,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAH,EAAC,OAAA,EAAI,OAAO,EAAE,OAAO,OAAA,GACnB,UAAA,gBAAAA,EAACI,GAAA,EAAsB,IAAIH,GAAM,aAAaA,EAAA,GAA7BA,CAAmC,GACtD;AAAA,EACA,gBAAAD,EAACK,GAAA,EAAO,SAAQ,cACd,UAAA,gBAAAL,EAACM,KAAK,MAAK,SAAQ,OAAM,YAAA,CAAY,EAAA,CACvC;AAAA,KANaL,CAOf,CACD,GACH,GAGWM,IAAsBR,EAAgB,KAAK,CAAA,CAAE;AAC1DQ,EAAoB,OAAO;AAAA,EACzB,GAAGf;AAAA,EACH,cAAc;AAAA,IACZ,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,IAC1B,EAAE,OAAO,UAAU,OAAO,EAAA;AAAA,EAAE;AAEhC;"}

package/dist/components/Sortable/SortableProvider.d.ts

@@ -1,5 +1,6 @@
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { SortableStateType } from './sortableReducer';
+import { SortableItem, SortableItemProps } from './components/SortableItem';
 type SortableContextType = {
     clearDraggingSource: () => void;
     clearDraggingTarget: () => void;
@@ -12,13 +13,15 @@ type SortableContextType = {
     setDraggingSource: (index: number) => void;
     setDraggingTarget: (index: number) => void;
 };
-interface Props {
-    children: SortableStateType['sortableItems'];
-    items: ReactElement[] | string[];
+type SortableItems = ReactElement<SortableItemProps, typeof SortableItem>[];
+interface Props<T = unknown> {
+    renderItems: SortableItems;
+    dataItems: T[];
     scrollable?: boolean;
     hideNumbers?: boolean;
-    onSort?: (items: (string | ReactElement)[]) => void;
+    onSort?: (items: T[]) => void;
+    children?: ReactNode;
 }
-export declare function SortableProvider({ children, items, scrollable, hideNumbers, onSort }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function SortableProvider<T>({ renderItems, dataItems, scrollable, hideNumbers, onSort }: Props<T>): import("react/jsx-runtime").JSX.Element;
 export declare function useSortable(): SortableContextType & SortableStateType;
 export {};

package/dist/components/Sortable/SortableProvider.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "react";
 import "./sortableReducer.js";
-import { S as p, u as a } from "../../SortableProvider-C2T7b-pm.js";
+import { S as p, u as a } from "../../SortableProvider-DisCfTTN.js";
 import "./actions.js";
 export {
   p as SortableProvider,

package/dist/components/Sortable/components/SortableContainer.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "react";
 import "../../../clsx-OuTLNxxd.js";
 import "../../../Sortable.module--kgnzOjW.js";
-import { a } from "../../../SortableProvider-C2T7b-pm.js";
+import { a } from "../../../SortableProvider-DisCfTTN.js";
 export {
   a as SortableContainer
 };

package/dist/components/Sortable/components/SortableItem.js

@@ -4,7 +4,7 @@ import { c as G } from "../../../clsx-OuTLNxxd.js";
 import { Icon as w } from "../../Icon/Icon.js";
 import { SortableHandle as E } from "./SortableHandle.js";
 import { s as e } from "../../../Sortable.module--kgnzOjW.js";
-import { u as J } from "../../../SortableProvider-C2T7b-pm.js";
+import { u as J } from "../../../SortableProvider-DisCfTTN.js";
 const j = ["Space", "ArrowDown", "ArrowUp"], F = "ontouchstart" in globalThis.document.documentElement, C = new Image(0, 0);
 C.src = // 1px transparent png
 "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==";

package/dist/components/index.js

@@ -35,7 +35,7 @@ import { Label as Bo } from "./Label/Label.js";
 import { MenuLink as So } from "./MenuLink/MenuLink.js";
 import { MetaDataList as Co } from "./MetaDataList/MetaDataList.js";
 import { ModalDialog as ko } from "./ModalDialog/ModalDialog.js";
-import { M as Mo } from "../TablePlugin-Dmy98Epb.js";
+import { M as Mo } from "../TablePlugin-oF-gInNx.js";
 import { MultiSelectBox as Lo } from "./MultiSelectBox/MultiSelectBox.js";
 import { Notification as Ro } from "./Notification/Notification.js";
 import { OverlayCloseButton as ho } from "./OverlayCloseButton/OverlayCloseButton.js";

package/dist/index.js

@@ -35,7 +35,7 @@ import { Label as Bo } from "./components/Label/Label.js";
 import { MenuLink as So } from "./components/MenuLink/MenuLink.js";
 import { MetaDataList as Co } from "./components/MetaDataList/MetaDataList.js";
 import { ModalDialog as ko } from "./components/ModalDialog/ModalDialog.js";
-import { M as Mo } from "./TablePlugin-Dmy98Epb.js";
+import { M as Mo } from "./TablePlugin-oF-gInNx.js";
 import { MultiSelectBox as Lo } from "./components/MultiSelectBox/MultiSelectBox.js";
 import { Notification as Ro } from "./components/Notification/Notification.js";
 import { OverlayCloseButton as ho } from "./components/OverlayCloseButton/OverlayCloseButton.js";

package/package.json

@@ -2,7 +2,7 @@
   "name": "@uva-glass/component-library",
   "author": "Team Glass - Frontend vrienden",
   "private": false,
-  "version": "3.31.0",
+  "version": "3.32.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/dist/SortableProvider-C2T7b-pm.js

@@ -1,153 +0,0 @@
-import { jsx as f } from "react/jsx-runtime";
-import { useRef as x, useEffect as N, cloneElement as O, createContext as A, useReducer as L, Children as E, useContext as j } from "react";
-import { sortableReducer as q, initialState as B } from "./components/Sortable/sortableReducer.js";
-import { c as _ } from "./clsx-OuTLNxxd.js";
-import { s as c } from "./Sortable.module--kgnzOjW.js";
-import { setDraggingTarget as H, setDraggingSource as X, setClone as Y, reset as k, moveToPosition as z, drop as F, dragStart as G, dragEnd as J, clearDraggingTarget as K, clearDraggingSource as M } from "./components/Sortable/actions.js";
-function Q({ scrollable: i, hideNumbers: g, onSort: l }) {
-  const { clone: n, draggingTarget: p, drop: D, sortableItems: S, setDraggingTarget: o, reset: T, indices: a } = V(), d = x(null), s = x(null), u = x(a);
-  function m(r) {
-    const t = d.current;
-    if (!t?.hasChildNodes()) return;
-    const e = r.currentTarget;
-    return Array.from(t.childNodes).findIndex((v) => v.isEqualNode(e));
-  }
-  function C(r) {
-    const t = m(r);
-    t !== void 0 && (n && s.current && s.current.removeChild(n), D(t));
-  }
-  function $(r) {
-    if (r.preventDefault(), r.dataTransfer.dropEffect = "move", n) {
-      const { clientX: e, clientY: b } = r, { x: h, y: v, width: P, height: w } = r.currentTarget.getBoundingClientRect(), R = w / 2 - (b - v);
-      n.setAttribute(
-        "style",
-        `
-        left: ${e - (e - h)}px;
-        top: ${v - R}px;
-        height: ${w}px;
-        width: ${P}px;
-        visibility: visible;
-      `
-      );
-    }
-    const t = m(r);
-    t === void 0 || t === p || o(t);
-  }
-  function I(r) {
-    const { relatedTarget: t } = r;
-    t !== null && d.current?.contains(t) || (T(), n && n.setAttribute("style", "visibility: hidden;"));
-  }
-  return N(() => {
-    if (!(!n || !s.current))
-      return s.current.appendChild(n), function() {
-        n.remove();
-      };
-  }, [n]), N(() => {
-    l && a.valueOf() !== u.current.valueOf() && (l(a), u.current = a);
-  }, [a, u, l]), /* @__PURE__ */ f(
-    "div",
-    {
-      className: _(c.sortable__wrapper, { [c["sortable__wrapper--scrollable"]]: i }),
-      ref: s,
-      children: /* @__PURE__ */ f(
-        "ul",
-        {
-          className: _(c.sortable__container, {
-            [c["sortable__container--drag-over"]]: n !== void 0
-          }),
-          onDragLeave: I,
-          ref: d,
-          role: "presentation",
-          children: S.map((r, t) => /* @__PURE__ */ f(
-            "li",
-            {
-              className: _(c["sortable__drop-target"], {
-                [c["sortable__drop-target--no-number"]]: g
-              }),
-              draggable: !1,
-              onDragOver: $,
-              onDrop: C,
-              role: "presentation",
-              children: O(r, { index: t })
-            },
-            t
-          ))
-        }
-      )
-    }
-  );
-}
-const y = A(void 0), U = (i) => ({
-  ...B,
-  indices: E.map(i, ({ props: g }) => g.index),
-  maxIndex: E.count(i) - 1,
-  sortableItems: i
-});
-function oe({ children: i, items: g, scrollable: l, hideNumbers: n, onSort: p }) {
-  const D = x(g), [S, o] = L(q, i, U);
-  function T(e) {
-    o(X(e));
-  }
-  function a(e) {
-    o(H(e));
-  }
-  function d(e) {
-    o(z(e));
-  }
-  function s() {
-    o(K());
-  }
-  function u() {
-    o(M());
-  }
-  function m(e) {
-    o(F(e));
-  }
-  function C(e) {
-    o(G(e));
-  }
-  function $() {
-    o(J());
-  }
-  function I() {
-    o(k());
-  }
-  function r(e) {
-    o(Y(e));
-  }
-  function t(e) {
-    const b = e.map((h) => D.current[h]);
-    p && p(b);
-  }
-  return /* @__PURE__ */ f(
-    y.Provider,
-    {
-      value: {
-        ...S,
-        clearDraggingSource: u,
-        clearDraggingTarget: s,
-        dragEnd: $,
-        dragStart: C,
-        drop: m,
-        moveToPosition: d,
-        reset: I,
-        setClone: r,
-        setDraggingSource: T,
-        setDraggingTarget: a
-      },
-      children: /* @__PURE__ */ f(Q, { scrollable: l, hideNumbers: n, onSort: t })
-    }
-  );
-}
-function V() {
-  const i = j(y);
-  if (i === void 0)
-    throw new Error("useSortable must be used within a SortableProvider");
-  return i;
-}
-export {
-  oe as S,
-  Q as a,
-  V as u
-};
-//# sourceMappingURL=SortableProvider-C2T7b-pm.js.map

package/dist/SortableProvider-C2T7b-pm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SortableProvider-C2T7b-pm.js","sources":["../src/components/Sortable/components/SortableContainer.tsx","../src/components/Sortable/SortableProvider.tsx"],"sourcesContent":["import { cloneElement, useEffect, useRef } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { DragEvent } from 'react';\n\nimport styles from 'components/Sortable/Sortable.module.css';\nimport { useSortable } from 'components/Sortable/SortableProvider';\n\nexport type OnSort = (indices: number[]) => void;\n\ninterface SortableContainerProps {\n  scrollable?: boolean;\n  hideNumbers?: boolean;\n  onSort?: OnSort;\n}\n\nexport function SortableContainer({ scrollable, hideNumbers, onSort }: SortableContainerProps) {\n  const { clone, draggingTarget, drop, sortableItems, setDraggingTarget, reset, indices } = useSortable();\n  const containerRef = useRef<HTMLUListElement>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const indicesRef = useRef<number[]>(indices);\n\n  function getTargetIndex(event: DragEvent<HTMLLIElement>) {\n    const sortableContainer = containerRef.current;\n\n    if (!sortableContainer?.hasChildNodes()) return;\n\n    const listItemNode = event.currentTarget;\n    const childNodes = Array.from(sortableContainer.childNodes);\n    const targetIndex = childNodes.findIndex((node) => node.isEqualNode(listItemNode));\n\n    return targetIndex;\n  }\n\n  function handleDrop(event: DragEvent<HTMLLIElement>) {\n    const targetIndex = getTargetIndex(event);\n\n    if (targetIndex === undefined) return;\n\n    if (clone && wrapperRef.current) wrapperRef.current.removeChild(clone);\n\n    drop(targetIndex);\n  }\n\n  function handleDragOver(event: DragEvent<HTMLLIElement>) {\n    // Prevent default to allow drop\n    event.preventDefault();\n    event.dataTransfer.dropEffect = 'move';\n\n    if (clone) {\n      const { clientX, clientY } = event;\n      const { x, y, width, height } = event.currentTarget.getBoundingClientRect();\n      // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n      const grabPosition = height / 2 - (clientY - y);\n\n      // lock drag image movement to x-axis and mouse pointer\n      clone.setAttribute(\n        'style',\n        `\n        left: ${clientX - (clientX - x)}px;\n        top: ${y - grabPosition}px;\n        height: ${height}px;\n        width: ${width}px;\n        visibility: visible;\n      `\n      );\n    }\n\n    const targetIndex = getTargetIndex(event);\n\n    if (targetIndex === undefined || targetIndex === draggingTarget) return;\n\n    setDraggingTarget(targetIndex);\n  }\n\n  function handleContainerDragLeave(event: DragEvent<HTMLUListElement>) {\n    const { relatedTarget } = event;\n\n    const within = relatedTarget !== null && containerRef.current?.contains(relatedTarget as Node);\n\n    if (!within) {\n      reset();\n\n      if (clone) {\n        clone.setAttribute('style', 'visibility: hidden;');\n      }\n    }\n  }\n\n  useEffect(() => {\n    if (!clone || !wrapperRef.current) return;\n\n    wrapperRef.current.appendChild(clone);\n\n    return function () {\n      clone.remove();\n    };\n  }, [clone]);\n\n  useEffect(() => {\n    if (!onSort) return;\n\n    if (indices.valueOf() !== indicesRef.current.valueOf()) {\n      onSort(indices);\n\n      indicesRef.current = indices;\n    }\n  }, [indices, indicesRef, onSort]);\n\n  return (\n    <div\n      className={clsx(styles['sortable__wrapper'], { [styles['sortable__wrapper--scrollable']]: scrollable })}\n      ref={wrapperRef}\n    >\n      <ul\n        className={clsx(styles['sortable__container'], {\n          [styles['sortable__container--drag-over']]: clone !== undefined,\n        })}\n        onDragLeave={handleContainerDragLeave}\n        ref={containerRef}\n        role=\"presentation\"\n      >\n        {sortableItems.map((child, index) => (\n          <li\n            className={clsx(styles['sortable__drop-target'], {\n              [styles['sortable__drop-target--no-number']]: hideNumbers,\n            })}\n            draggable={false}\n            key={index}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop}\n            role=\"presentation\"\n          >\n            {cloneElement(child, { index })}\n          </li>\n        ))}\n      </ul>\n    </div>\n  );\n}\n","import { Children, createContext, useContext, useReducer, useRef } from 'react';\n\nimport type { ReactElement } from 'react';\nimport type { SortableStateType } from './sortableReducer';\n\nimport { sortableReducer, initialState } from './sortableReducer';\nimport { SortableContainer } from './components/SortableContainer';\nimport * as actions from './actions';\n\ntype SortableContextType = {\n  clearDraggingSource: () => void;\n  clearDraggingTarget: () => void;\n  dragEnd: () => void;\n  dragStart: (index: number) => void;\n  drop: (index: number) => void;\n  moveToPosition: (index: number) => void;\n  reset: () => void;\n  setClone: (node: Element) => void;\n  setDraggingSource: (index: number) => void;\n  setDraggingTarget: (index: number) => void;\n};\n\nconst SortableContext = createContext<(SortableContextType & SortableStateType) | undefined>(undefined);\n\ninterface Props {\n  children: SortableStateType['sortableItems'];\n  items: ReactElement[] | string[];\n  scrollable?: boolean;\n  hideNumbers?: boolean;\n  onSort?: (items: (string | ReactElement)[]) => void;\n}\n\nconst init = (children: Props['children']): SortableStateType => ({\n  ...initialState,\n  indices: Children.map(children, ({ props }) => props.index),\n  maxIndex: Children.count(children) - 1,\n  sortableItems: children,\n});\n\nexport function SortableProvider({ children, items, scrollable, hideNumbers, onSort }: Props) {\n  const persistentItems = useRef(items);\n\n  const [state, dispatch] = useReducer(sortableReducer, children, init);\n\n  function setDraggingSource(index: number) {\n    dispatch(actions.setDraggingSource(index));\n  }\n\n  function setDraggingTarget(index: number) {\n    dispatch(actions.setDraggingTarget(index));\n  }\n\n  function moveToPosition(index: number) {\n    dispatch(actions.moveToPosition(index));\n  }\n\n  function clearDraggingTarget() {\n    dispatch(actions.clearDraggingTarget());\n  }\n\n  function clearDraggingSource() {\n    dispatch(actions.clearDraggingSource());\n  }\n\n  function drop(index: number) {\n    dispatch(actions.drop(index));\n  }\n\n  function dragStart(index: number) {\n    dispatch(actions.dragStart(index));\n  }\n\n  function dragEnd() {\n    dispatch(actions.dragEnd());\n  }\n\n  function reset() {\n    dispatch(actions.reset());\n  }\n\n  function setClone(node: Element) {\n    dispatch(actions.setClone(node));\n  }\n\n  function onHandleSort(sortedIndices: number[]) {\n    const sortedItems = sortedIndices.map((index) => persistentItems.current[index]);\n    onSort && onSort(sortedItems);\n  }\n\n  return (\n    <SortableContext.Provider\n      value={{\n        ...state,\n        clearDraggingSource,\n        clearDraggingTarget,\n        dragEnd,\n        dragStart,\n        drop,\n        moveToPosition,\n        reset,\n        setClone,\n        setDraggingSource,\n        setDraggingTarget,\n      }}\n    >\n      <SortableContainer scrollable={scrollable} hideNumbers={hideNumbers} onSort={onHandleSort} />\n    </SortableContext.Provider>\n  );\n}\n\nexport function useSortable() {\n  const context = useContext(SortableContext);\n\n  if (context === undefined) {\n    throw new Error('useSortable must be used within a SortableProvider');\n  }\n\n  return context;\n}\n"],"names":["SortableContainer","scrollable","hideNumbers","onSort","clone","draggingTarget","drop","sortableItems","setDraggingTarget","reset","indices","useSortable","containerRef","useRef","wrapperRef","indicesRef","getTargetIndex","event","sortableContainer","listItemNode","node","handleDrop","targetIndex","handleDragOver","clientX","clientY","x","y","width","height","grabPosition","handleContainerDragLeave","relatedTarget","useEffect","jsx","clsx","styles","child","index","cloneElement","SortableContext","createContext","init","children","initialState","Children","props","SortableProvider","items","persistentItems","state","dispatch","useReducer","sortableReducer","setDraggingSource","actions.setDraggingSource","actions.setDraggingTarget","moveToPosition","actions.moveToPosition","clearDraggingTarget","actions.clearDraggingTarget","clearDraggingSource","actions.clearDraggingSource","actions.drop","dragStart","actions.dragStart","dragEnd","actions.dragEnd","actions.reset","setClone","actions.setClone","onHandleSort","sortedIndices","sortedItems","context","useContext"],"mappings":";;;;;;AAgBO,SAASA,EAAkB,EAAE,YAAAC,GAAY,aAAAC,GAAa,QAAAC,KAAkC;AAC7F,QAAM,EAAE,OAAAC,GAAO,gBAAAC,GAAgB,MAAAC,GAAM,eAAAC,GAAe,mBAAAC,GAAmB,OAAAC,GAAO,SAAAC,EAAA,IAAYC,EAAA,GACpFC,IAAeC,EAAyB,IAAI,GAC5CC,IAAaD,EAAuB,IAAI,GACxCE,IAAaF,EAAiBH,CAAO;AAE3C,WAASM,EAAeC,GAAiC;AACvD,UAAMC,IAAoBN,EAAa;AAEvC,QAAI,CAACM,GAAmB,gBAAiB;AAEzC,UAAMC,IAAeF,EAAM;AAI3B,WAHmB,MAAM,KAAKC,EAAkB,UAAU,EAC3B,UAAU,CAACE,MAASA,EAAK,YAAYD,CAAY,CAAC;AAAA,EAE1E;AAGT,WAASE,EAAWJ,GAAiC;AACnD,UAAMK,IAAcN,EAAeC,CAAK;AAExC,IAAIK,MAAgB,WAEhBlB,KAASU,EAAW,WAASA,EAAW,QAAQ,YAAYV,CAAK,GAErEE,EAAKgB,CAAW;AAAA,EAAA;AAGlB,WAASC,EAAeN,GAAiC;AAKvD,QAHAA,EAAM,eAAA,GACNA,EAAM,aAAa,aAAa,QAE5Bb,GAAO;AACT,YAAM,EAAE,SAAAoB,GAAS,SAAAC,EAAA,IAAYR,GACvB,EAAE,GAAAS,GAAG,GAAAC,GAAG,OAAAC,GAAO,QAAAC,MAAWZ,EAAM,cAAc,sBAAA,GAE9Ca,IAAeD,IAAS,KAAKJ,IAAUE;AAG7C,MAAAvB,EAAM;AAAA,QACJ;AAAA,QACA;AAAA,gBACQoB,KAAWA,IAAUE,EAAE;AAAA,eACxBC,IAAIG,CAAY;AAAA,kBACbD,CAAM;AAAA,iBACPD,CAAK;AAAA;AAAA;AAAA,MAAA;AAAA,IAGhB;AAGF,UAAMN,IAAcN,EAAeC,CAAK;AAExC,IAAIK,MAAgB,UAAaA,MAAgBjB,KAEjDG,EAAkBc,CAAW;AAAA,EAAA;AAG/B,WAASS,EAAyBd,GAAoC;AACpE,UAAM,EAAE,eAAAe,MAAkBf;AAI1B,IAFee,MAAkB,QAAQpB,EAAa,SAAS,SAASoB,CAAqB,MAG3FvB,EAAA,GAEIL,KACFA,EAAM,aAAa,SAAS,qBAAqB;AAAA,EAErD;AAGF,SAAA6B,EAAU,MAAM;AACd,QAAI,GAAC7B,KAAS,CAACU,EAAW;AAE1B,aAAAA,EAAW,QAAQ,YAAYV,CAAK,GAE7B,WAAY;AACjB,QAAAA,EAAM,OAAA;AAAA,MAAO;AAAA,EACf,GACC,CAACA,CAAK,CAAC,GAEV6B,EAAU,MAAM;AACd,IAAK9B,KAEDO,EAAQ,QAAA,MAAcK,EAAW,QAAQ,cAC3CZ,EAAOO,CAAO,GAEdK,EAAW,UAAUL;AAAA,EACvB,GACC,CAACA,GAASK,GAAYZ,CAAM,CAAC,GAG9B,gBAAA+B;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,mBAAsB,EAAE,CAACA,EAAO,+BAA+B,CAAC,GAAGnC,GAAY;AAAA,MACtG,KAAKa;AAAA,MAEL,UAAA,gBAAAoB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC,EAAKC,EAAO,qBAAwB;AAAA,YAC7C,CAACA,EAAO,gCAAgC,CAAC,GAAGhC,MAAU;AAAA,UAAA,CACvD;AAAA,UACD,aAAa2B;AAAA,UACb,KAAKnB;AAAA,UACL,MAAK;AAAA,UAEJ,UAAAL,EAAc,IAAI,CAAC8B,GAAOC,MACzB,gBAAAJ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWC,EAAKC,EAAO,uBAAuB,GAAG;AAAA,gBAC/C,CAACA,EAAO,kCAAkC,CAAC,GAAGlC;AAAA,cAAA,CAC/C;AAAA,cACD,WAAW;AAAA,cAEX,YAAYqB;AAAA,cACZ,QAAQF;AAAA,cACR,MAAK;AAAA,cAEJ,UAAAkB,EAAaF,GAAO,EAAE,OAAAC,EAAA,CAAO;AAAA,YAAA;AAAA,YALzBA;AAAA,UAAA,CAOR;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN;ACrHA,MAAME,IAAkBC,EAAqE,MAAS,GAUhGC,IAAO,CAACC,OAAoD;AAAA,EAChE,GAAGC;AAAA,EACH,SAASC,EAAS,IAAIF,GAAU,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,KAAK;AAAA,EAC1D,UAAUD,EAAS,MAAMF,CAAQ,IAAI;AAAA,EACrC,eAAeA;AACjB;AAEO,SAASI,GAAiB,EAAE,UAAAJ,GAAU,OAAAK,GAAO,YAAA/C,GAAY,aAAAC,GAAa,QAAAC,KAAiB;AAC5F,QAAM8C,IAAkBpC,EAAOmC,CAAK,GAE9B,CAACE,GAAOC,CAAQ,IAAIC,EAAWC,GAAiBV,GAAUD,CAAI;AAEpE,WAASY,EAAkBhB,GAAe;AACxC,IAAAa,EAASI,EAA0BjB,CAAK,CAAC;AAAA,EAAA;AAG3C,WAAS9B,EAAkB8B,GAAe;AACxC,IAAAa,EAASK,EAA0BlB,CAAK,CAAC;AAAA,EAAA;AAG3C,WAASmB,EAAenB,GAAe;AACrC,IAAAa,EAASO,EAAuBpB,CAAK,CAAC;AAAA,EAAA;AAGxC,WAASqB,IAAsB;AAC7B,IAAAR,EAASS,GAA6B;AAAA,EAAA;AAGxC,WAASC,IAAsB;AAC7B,IAAAV,EAASW,GAA6B;AAAA,EAAA;AAGxC,WAASxD,EAAKgC,GAAe;AAC3B,IAAAa,EAASY,EAAazB,CAAK,CAAC;AAAA,EAAA;AAG9B,WAAS0B,EAAU1B,GAAe;AAChC,IAAAa,EAASc,EAAkB3B,CAAK,CAAC;AAAA,EAAA;AAGnC,WAAS4B,IAAU;AACjB,IAAAf,EAASgB,GAAiB;AAAA,EAAA;AAG5B,WAAS1D,IAAQ;AACf,IAAA0C,EAASiB,GAAe;AAAA,EAAA;AAG1B,WAASC,EAASjD,GAAe;AAC/B,IAAA+B,EAASmB,EAAiBlD,CAAI,CAAC;AAAA,EAAA;AAGjC,WAASmD,EAAaC,GAAyB;AAC7C,UAAMC,IAAcD,EAAc,IAAI,CAAClC,MAAUW,EAAgB,QAAQX,CAAK,CAAC;AAC/E,IAAAnC,KAAUA,EAAOsE,CAAW;AAAA,EAAA;AAG9B,SACE,gBAAAvC;AAAA,IAACM,EAAgB;AAAA,IAAhB;AAAA,MACC,OAAO;AAAA,QACL,GAAGU;AAAA,QAAA,qBACHW;AAAAA,QAAA,qBACAF;AAAAA,QAAA,SACAO;AAAAA,QAAA,WACAF;AAAAA,QAAA,MACA1D;AAAAA,QAAA,gBACAmD;AAAAA,QAAA,OACAhD;AAAAA,QAAA,UACA4D;AAAAA,QAAA,mBACAf;AAAAA,QAAA,mBACA9C;AAAAA,MAAA;AAAA,MAGF,UAAA,gBAAA0B,EAAClC,GAAA,EAAkB,YAAAC,GAAwB,aAAAC,GAA0B,QAAQqE,EAAA,CAAc;AAAA,IAAA;AAAA,EAAA;AAGjG;AAEO,SAAS5D,IAAc;AAC5B,QAAM+D,IAAUC,EAAWnC,CAAe;AAE1C,MAAIkC,MAAY;AACd,UAAM,IAAI,MAAM,oDAAoD;AAGtE,SAAOA;AACT;"}