@uva-glass/component-library 1.62.3 → 1.62.5

package/dist/components/FormInput/FormInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormInput.js","sources":["../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport styles from './FormInput.module.css';\n\nimport { Icon, Label } from 'components';\n\nexport interface FormInputProps {\n  /** The id of the input element. */\n  id: string;\n  /** label text if empthy the label is not renderd */\n  label: string;\n  /** label position `top` or `left`. The default is `top`. */\n  labelPosition?: 'top' | 'left';\n  /** The type of the input element. */\n  type?: 'text' | 'password' | 'email' | 'number';\n  /** Shows red * */\n  required?: boolean;\n  /** error text to display if set */\n  notValidatedText?: string;\n  /** Returns array of selected values as number */\n  onChange: (value: string) => void;\n}\n\nexport const FormInput = ({\n  id,\n  label,\n  labelPosition = 'top',\n  type = 'text',\n  required = false,\n  notValidatedText = '',\n  onChange,\n}: FormInputProps) => {\n  const blockInvalidChar = (event: React.KeyboardEvent<HTMLInputElement>) =>\n    ['e', 'E', '+', '-'].includes(event.key) && event.preventDefault();\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (typeof onChange === 'function') {\n      onChange(event.target.value);\n    }\n  };\n\n  return (\n    <div className={clsx(styles['form-field__container'], styles[`form-field__container--label-${labelPosition}`])}>\n      {label && (\n        <Label htmlFor={id} required={required}>\n          {label}\n        </Label>\n      )}\n\n      <div className={styles['form-field__input-container']}>\n        <input\n          id={id}\n          type={type}\n          {...(type === 'number' && { onKeyDown: blockInvalidChar })}\n          onChange={handleChange}\n          className={clsx(styles['form-field__input'], [notValidatedText !== '' && styles['form-field__input--error']])}\n        />\n        {notValidatedText !== '' && (\n          <div className={styles['form-field__error']}>\n            <Icon name=\"ExclamationTriangleFill\" size={24} />\n            {notValidatedText}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["FormInput","id","label","labelPosition","type","required","notValidatedText","onChange","blockInvalidChar","event","handleChange","jsxs","clsx","styles","jsx","Label","Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuBaA,IAAY,CAAC;AAAA,EACxB,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,kBAAAC,IAAmB;AAAA,EACnB,UAAAC;AACF,MAAsB;AACpB,QAAMC,IAAmB,CAACC,MACxB,CAAC,KAAK,KAAK,KAAK,GAAG,EAAE,SAASA,EAAM,GAAG,KAAKA,EAAM,eAAe,GAE7DC,IAAe,CAACD,MAA+C;AAC/D,IAAA,OAAOF,KAAa,cACbA,EAAAE,EAAM,OAAO,KAAK;AAAA,EAC7B;AAGF,SACG,gBAAAE,EAAA,OAAA,EAAI,WAAWC,EAAKC,EAAO,uBAAuB,GAAGA,EAAO,gCAAgCV,CAAa,EAAE,CAAC,GAC1G,UAAA;AAAA,IAAAD,KACE,gBAAAY,EAAAC,GAAA,EAAM,SAASd,GAAI,UAAAI,GACjB,UACHH,GAAA;AAAA,IAGD,gBAAAS,EAAA,OAAA,EAAI,WAAWE,EAAO,6BAA6B,GAClD,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAAb;AAAA,UACA,MAAAG;AAAA,UACC,GAAIA,MAAS,YAAY,EAAE,WAAWI,EAAiB;AAAA,UACxD,UAAUE;AAAA,UACV,WAAWE,EAAKC,EAAO,mBAAmB,GAAG,CAACP,MAAqB,MAAMO,EAAO,0BAA0B,CAAC,CAAC;AAAA,QAAA;AAAA,MAC9G;AAAA,MACCP,MAAqB,MACpB,gBAAAK,EAAC,SAAI,WAAWE,EAAO,mBAAmB,GACxC,UAAA;AAAA,QAAA,gBAAAC,EAACE,GAAK,EAAA,MAAK,2BAA0B,MAAM,IAAI;AAAA,QAC9CV;AAAA,MAAA,GACH;AAAA,IAAA,GAEJ;AAAA,EACF,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"FormInput.js","sources":["../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport styles from './FormInput.module.css';\n\nimport { FeedbackBox, Label } from 'components';\n\nexport interface FormInputProps {\n  /** The id of the input element. */\n  id: string;\n  /** label text if empthy the label is not renderd */\n  label: string;\n  /** label position `top` or `left`. The default is `top`. */\n  labelPosition?: 'top' | 'left';\n  /** The type of the input element. */\n  type?: 'text' | 'password' | 'email' | 'number';\n  /** Shows red * */\n  required?: boolean;\n  /** error text to display if set */\n  notValidatedText?: string;\n  /** Returns array of selected values as number */\n  onChange: (value: string) => void;\n}\n\nexport const FormInput = ({\n  id,\n  label,\n  labelPosition = 'top',\n  type = 'text',\n  required = false,\n  notValidatedText = '',\n  onChange,\n}: FormInputProps) => {\n  const blockInvalidChar = (event: React.KeyboardEvent<HTMLInputElement>) =>\n    ['e', 'E', '+', '-'].includes(event.key) && event.preventDefault();\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (typeof onChange === 'function') {\n      onChange(event.target.value);\n    }\n  };\n\n  return (\n    <div className={clsx(styles['form-field__container'], styles[`form-field__container--label-${labelPosition}`])}>\n      {label && (\n        <Label htmlFor={id} required={required}>\n          {label}\n        </Label>\n      )}\n\n      <div className={styles['form-field__input-container']}>\n        <input\n          id={id}\n          type={type}\n          {...(type === 'number' && { onKeyDown: blockInvalidChar })}\n          onChange={handleChange}\n          className={clsx(styles['form-field__input'], [notValidatedText !== '' && styles['form-field__input--error']])}\n        />\n        {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n      </div>\n    </div>\n  );\n};\n"],"names":["FormInput","id","label","labelPosition","type","required","notValidatedText","onChange","blockInvalidChar","event","handleChange","jsxs","clsx","styles","jsx","Label","FeedbackBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuBaA,IAAY,CAAC;AAAA,EACxB,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,kBAAAC,IAAmB;AAAA,EACnB,UAAAC;AACF,MAAsB;AACpB,QAAMC,IAAmB,CAACC,MACxB,CAAC,KAAK,KAAK,KAAK,GAAG,EAAE,SAASA,EAAM,GAAG,KAAKA,EAAM,eAAe,GAE7DC,IAAe,CAACD,MAA+C;AAC/D,IAAA,OAAOF,KAAa,cACbA,EAAAE,EAAM,OAAO,KAAK;AAAA,EAC7B;AAGF,SACG,gBAAAE,EAAA,OAAA,EAAI,WAAWC,EAAKC,EAAO,uBAAuB,GAAGA,EAAO,gCAAgCV,CAAa,EAAE,CAAC,GAC1G,UAAA;AAAA,IAAAD,KACE,gBAAAY,EAAAC,GAAA,EAAM,SAASd,GAAI,UAAAI,GACjB,UACHH,GAAA;AAAA,IAGD,gBAAAS,EAAA,OAAA,EAAI,WAAWE,EAAO,6BAA6B,GAClD,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAAb;AAAA,UACA,MAAAG;AAAA,UACC,GAAIA,MAAS,YAAY,EAAE,WAAWI,EAAiB;AAAA,UACxD,UAAUE;AAAA,UACV,WAAWE,EAAKC,EAAO,mBAAmB,GAAG,CAACP,MAAqB,MAAMO,EAAO,0BAA0B,CAAC,CAAC;AAAA,QAAA;AAAA,MAC9G;AAAA,MACCP,MAAqB,MAAM,gBAAAQ,EAACE,KAAY,OAAM,SAAQ,UAAUV,GAAkB;AAAA,IAAA,GACrF;AAAA,EACF,EAAA,CAAA;AAEJ;"}

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

@@ -15,7 +15,7 @@ import "../GridRow/GridRow.js";
 import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "react-router-dom";
-import "../../TablePlugin-B-Q_UBXj.js";
+import "../../TablePlugin-CMsi2UDH.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/hooks/components/Flyout.js";
 import "../SelectListbox/SelectListbox.js";

package/dist/components/MultiSelect/MultiSelect.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "../../clsx-OuTLNxxd.js";
 import "../../MultiSelectItem-D9PxdX43.js";
-import { M as p } from "../../TablePlugin-B-Q_UBXj.js";
+import { M as p } from "../../TablePlugin-CMsi2UDH.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 { fn as d } from "../../index-C9QoqAAt.js";
 import { useState as p } from "react";
-import { M as e } from "../../TablePlugin-B-Q_UBXj.js";
+import { M as e } from "../../TablePlugin-CMsi2UDH.js";
 import { Container as M } from "../../storyComponents/Container/Container.js";
 const C = `
   // MultiSelectHeader can be added optionally

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

@@ -14,7 +14,7 @@ import "../../IconButton/IconButton.js";
 import "../../Input/Input.js";
 import "../../InputField/InputField.js";
 import "react-router-dom";
-import { a as q } from "../../../TablePlugin-B-Q_UBXj.js";
+import { a as q } from "../../../TablePlugin-CMsi2UDH.js";
 import "../../RteEditor/Providers/LanguageProvider.js";
 import "../../RteEditor/hooks/components/Flyout.js";
 import "../../SelectListbox/SelectListbox.js";

package/dist/components/MultiSelect/index.js

@@ -1,4 +1,4 @@
-import { M as l } from "../../TablePlugin-B-Q_UBXj.js";
+import { M as l } from "../../TablePlugin-CMsi2UDH.js";
 export {
   l as MultiSelect
 };

package/dist/components/PeriodSelector/PeriodSelector.js

@@ -1,74 +1,89 @@
-import { jsxs as i, jsx as l } from "react/jsx-runtime";
-import { c as v } from "../../clsx-OuTLNxxd.js";
-import { useRef as N, useState as M, useEffect as $ } from "react";
-import { Label as k } from "../Label/Label.js";
-import { CheckboxButtonBar as I } from "../CheckboxButtonBar/CheckboxButtonBar.js";
-import { Icon as T } from "../Icon/Icon.js";
-import '../../assets/PeriodSelector.css';const c = {
-  "period-selector__container": "_period-selector__container_1on0y_1",
-  "period-selector__container--label-left": "_period-selector__container--label-left_1on0y_6",
-  "period-selector__container--label-top": "_period-selector__container--label-top_1on0y_12",
-  "period-selector__selector-container": "_period-selector__selector-container_1on0y_19",
-  "period-selector__selector-row": "_period-selector__selector-row_1on0y_24",
-  "period-selector__error": "_period-selector__error_1on0y_31"
-}, E = 0, S = 1, f = 2, a = 3, w = 7, D = (_) => {
-  const n = [];
-  for (let t = 0; t < _.length; t += a)
-    n.push(_.slice(t, t + a));
-  return n;
-}, L = ({
-  maxPeriods: _ = w,
-  defaultValues: n,
+import { jsxs as h, jsx as i } from "react/jsx-runtime";
+import { c as k } from "../../clsx-OuTLNxxd.js";
+import { useRef as M, useState as N, useEffect as $ } from "react";
+import "../Buttons/Button.js";
+import "../Buttons/LinkButton.js";
+import "@react-aria/button";
+import { CheckboxButtonBar as w } from "../CheckboxButtonBar/CheckboxButtonBar.js";
+import "@react-aria/dialog";
+import "@react-aria/focus";
+import "@react-aria/overlays";
+import "../OverlayCloseButton/OverlayCloseButton.js";
+import { FeedbackBox as B } from "../FeedbackBox/FeedbackBox.js";
+import "../GridRow/GridRow.js";
+import "../IconButton/IconButton.js";
+import "../Input/Input.js";
+import "../InputField/InputField.js";
+import { Label as D } from "../Label/Label.js";
+import "react-router-dom";
+import "../../TablePlugin-CMsi2UDH.js";
+import "../RteEditor/Providers/LanguageProvider.js";
+import "../RteEditor/hooks/components/Flyout.js";
+import "../SelectListbox/SelectListbox.js";
+import "../SelectListbox/SelectProvider.js";
+import "../Sortable/components/SortableItem.js";
+import "../../SortableProvider-BUsvniX7.js";
+import '../../assets/PeriodSelector.css';const s = {
+  "period-selector__container": "_period-selector__container_1v02t_1",
+  "period-selector__container--label-left": "_period-selector__container--label-left_1v02t_6",
+  "period-selector__container--label-top": "_period-selector__container--label-top_1v02t_12",
+  "period-selector__selector-container": "_period-selector__selector-container_1v02t_19",
+  "period-selector__selector-row": "_period-selector__selector-row_1v02t_24"
+}, S = 0, f = 1, E = 2, _ = 3, I = 7, T = (l) => {
+  const c = [];
+  for (let t = 0; t < l.length; t += _)
+    c.push(l.slice(t, t + _));
+  return c;
+}, nr = ({
+  maxPeriods: l = I,
+  defaultValues: c,
   label: t,
   labelPosition: b = "top",
   required: p = !1,
-  notValidatedText: d = "",
-  onChange: g
+  notValidatedText: m = "",
+  onChange: v
 }) => {
-  const R = Array.from({ length: _ }, (e, r) => r + 1), m = D(R), x = m.map((e, r) => e.map((o) => ({
-    label: `${r + 1}${e.length === 1 ? "" : `.${(o - 1) % a + 1}`}`,
+  const g = Array.from({ length: l }, (r, e) => e + 1), a = T(g), R = a.map((r, e) => r.map((o) => ({
+    label: `${e + 1}${r.length === 1 ? "" : `.${(o - 1) % _ + 1}`}`,
     value: o.toString()
-  }))), s = N(
-    m.map(
-      (e) => e.reduce((r, o) => (n != null && n.includes(o) && r.push(o), r), [])
+  }))), n = M(
+    a.map(
+      (r) => r.reduce((e, o) => (c != null && c.includes(o) && e.push(o), e), [])
     )
-  ), [y, u] = M([]), h = (e) => e[E].length !== 0 || e[S].length !== 0 ? [f] : e[f].length !== 0 ? [E, S] : [], P = (e, r) => {
-    s.current[r] = e.map((o) => Number(o)), u(h(s.current)), g([...s.current.flat()].sort());
+  ), [x, d] = N([]), u = (r) => r[S].length !== 0 || r[f].length !== 0 ? [E] : r[E].length !== 0 ? [S, f] : [], P = (r, e) => {
+    n.current[e] = r.map((o) => Number(o)), d(u(n.current)), v([...n.current.flat()].sort());
   };
   return $(() => {
-    u(h(s.current));
-  }, []), /* @__PURE__ */ i(
+    d(u(n.current));
+  }, []), /* @__PURE__ */ h(
     "div",
     {
-      className: v(
-        c["period-selector__container"],
-        c[`period-selector__container--label-${b}`]
+      className: k(
+        s["period-selector__container"],
+        s[`period-selector__container--label-${b}`]
       ),
       children: [
-        t && /* @__PURE__ */ l(k, { htmlFor: "", required: p, children: t }),
-        /* @__PURE__ */ i("div", { className: c["period-selector__selector-container"], children: [
-          /* @__PURE__ */ l("div", { className: c["period-selector__selector-row"], children: x.map((e, r) => /* @__PURE__ */ l(
-            I,
+        t && /* @__PURE__ */ i(D, { htmlFor: "", required: p, children: t }),
+        /* @__PURE__ */ h("div", { className: s["period-selector__selector-container"], children: [
+          /* @__PURE__ */ i("div", { className: s["period-selector__selector-row"], children: R.map((r, e) => /* @__PURE__ */ i(
+            w,
             {
-              checkboxes: e,
-              defaultValues: s.current[r].map((o) => o.toString()),
-              disableGroup: y.includes(r),
+              checkboxes: r,
+              defaultValues: n.current[e].map((o) => o.toString()),
+              disableGroup: x.includes(e),
               required: p,
-              onSetValues: (o) => P(o, r)
+              onSetValues: (o) => P(o, e)
             },
-            `group_${r}`
+            `group_${e}`
           )) }),
-          /* @__PURE__ */ l("div", { className: c["period-selector__error"] }),
-          d !== "" && /* @__PURE__ */ i("div", { className: c["period-selector__error"], children: [
-            /* @__PURE__ */ l(T, { name: "ExclamationTriangleFill", size: 24 }),
-            d
-          ] })
+          /* @__PURE__ */ i("div", { className: s["period-selector__error"] }),
+          m !== "" && /* @__PURE__ */ i(B, { level: "error", feedback: m })
         ] })
       ]
     }
   );
 };
 export {
-  L as PeriodSelector
+  nr as PeriodSelector
 };
 //# sourceMappingURL=PeriodSelector.js.map

package/dist/components/PeriodSelector/PeriodSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"PeriodSelector.js","sources":["../../../src/components/PeriodSelector/PeriodSelector.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport styles from './PeriodSelector.module.css';\n\nimport { Label } from 'components/Label';\nimport { CheckboxButtonBar } from 'components/CheckboxButtonBar';\nimport { Icon } from 'components/Icon';\n\nexport interface PeriodSelectorProps {\n  /** Indicates how many periods are shown. */\n  // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n  maxPeriods: 6 | 7;\n  /** array of period values [3, 5 ...] */\n  defaultValues?: number[];\n  label: string;\n  labelPosition?: 'top' | 'left';\n  /** Shows red * */\n  required?: boolean;\n  /** error text to display if set */\n  notValidatedText?: string;\n  /** Returns array of selected values as number */\n  onChange: (values: number[]) => void;\n}\n\nconst SEMESTER_1 = 0;\nconst SEMESTER_2 = 1;\nconst SEMESTER_3 = 2;\n\nconst PERIODS_PER_SEMESTER = 3;\nconst MAX_PERIODS = 7;\n\nconst chunkPeriods = (array: number[]): number[][] => {\n  const result: number[][] = [];\n  for (let count = 0; count < array.length; count += PERIODS_PER_SEMESTER) {\n    result.push(array.slice(count, count + PERIODS_PER_SEMESTER));\n  }\n  return result;\n};\n\n/** Checkbox group for selecting periods */\nexport const PeriodSelector = ({\n  maxPeriods = MAX_PERIODS,\n  defaultValues,\n  label,\n  labelPosition = 'top',\n  required = false,\n  notValidatedText = '',\n  onChange,\n}: PeriodSelectorProps) => {\n  const maxPeriodsList = Array.from({ length: maxPeriods }, (_, index) => index + 1);\n  const chunkedPeriods = chunkPeriods(maxPeriodsList);\n\n  const checkboxItems = chunkedPeriods.map((periods, semester) => {\n    return periods.map((period) => ({\n      label: `${semester + 1}${periods.length === 1 ? '' : `.${((period - 1) % PERIODS_PER_SEMESTER) + 1}`}`,\n      value: period.toString(),\n    }));\n  });\n\n  const returnValues = useRef<number[][]>(\n    chunkedPeriods.map((semester) =>\n      semester.reduce((periods, period) => {\n        if (defaultValues?.includes(period)) periods.push(period);\n        return periods;\n      }, [] as number[])\n    )\n  );\n  const [disableSemesters, setDisableSemesters] = useState<number[]>([]);\n\n  const disableGroups = (selects: number[][]) => {\n    if (selects[SEMESTER_1].length !== 0 || selects[SEMESTER_2].length !== 0) return [SEMESTER_3];\n    if (selects[SEMESTER_3].length !== 0) return [SEMESTER_1, SEMESTER_2];\n    return [];\n  };\n\n  const handleChange = (values: string[], index: number) => {\n    returnValues.current[index] = values.map((num) => Number(num));\n    setDisableSemesters(disableGroups(returnValues.current));\n    onChange([...returnValues.current.flat()].sort());\n  };\n\n  useEffect(() => {\n    setDisableSemesters(disableGroups(returnValues.current));\n  }, []);\n\n  return (\n    <div\n      className={clsx(\n        styles['period-selector__container'],\n        styles[`period-selector__container--label-${labelPosition}`]\n      )}\n    >\n      {label && (\n        <Label htmlFor=\"\" required={required}>\n          {label}\n        </Label>\n      )}\n      <div className={styles['period-selector__selector-container']}>\n        <div className={styles['period-selector__selector-row']}>\n          {checkboxItems.map((checkboxes, semester) => (\n            <CheckboxButtonBar\n              key={`group_${semester}`}\n              checkboxes={checkboxes}\n              defaultValues={returnValues.current[semester].map((num) => num.toString())}\n              disableGroup={disableSemesters.includes(semester)}\n              required={required}\n              onSetValues={(event) => handleChange(event, semester)}\n            />\n          ))}\n        </div>\n        <div className={styles['period-selector__error']}></div>\n        {notValidatedText !== '' && (\n          <div className={styles['period-selector__error']}>\n            <Icon name=\"ExclamationTriangleFill\" size={24} />\n            {notValidatedText}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["SEMESTER_1","SEMESTER_2","SEMESTER_3","PERIODS_PER_SEMESTER","MAX_PERIODS","chunkPeriods","array","result","count","PeriodSelector","maxPeriods","defaultValues","label","labelPosition","required","notValidatedText","onChange","maxPeriodsList","_","index","chunkedPeriods","checkboxItems","periods","semester","period","returnValues","useRef","disableSemesters","setDisableSemesters","useState","disableGroups","selects","handleChange","values","num","useEffect","jsxs","clsx","styles","jsx","Label","checkboxes","CheckboxButtonBar","event","Icon"],"mappings":"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"}
+{"version":3,"file":"PeriodSelector.js","sources":["../../../src/components/PeriodSelector/PeriodSelector.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport styles from './PeriodSelector.module.css';\n\nimport { Label, CheckboxButtonBar, FeedbackBox } from 'components';\n\nexport interface PeriodSelectorProps {\n  /** Indicates how many periods are shown. */\n  // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n  maxPeriods: 6 | 7;\n  /** array of period values [3, 5 ...] */\n  defaultValues?: number[];\n  label: string;\n  labelPosition?: 'top' | 'left';\n  /** Shows red * */\n  required?: boolean;\n  /** error text to display if set */\n  notValidatedText?: string;\n  /** Returns array of selected values as number */\n  onChange: (values: number[]) => void;\n}\n\nconst SEMESTER_1 = 0;\nconst SEMESTER_2 = 1;\nconst SEMESTER_3 = 2;\n\nconst PERIODS_PER_SEMESTER = 3;\nconst MAX_PERIODS = 7;\n\nconst chunkPeriods = (array: number[]): number[][] => {\n  const result: number[][] = [];\n  for (let count = 0; count < array.length; count += PERIODS_PER_SEMESTER) {\n    result.push(array.slice(count, count + PERIODS_PER_SEMESTER));\n  }\n  return result;\n};\n\n/** Checkbox group for selecting periods */\nexport const PeriodSelector = ({\n  maxPeriods = MAX_PERIODS,\n  defaultValues,\n  label,\n  labelPosition = 'top',\n  required = false,\n  notValidatedText = '',\n  onChange,\n}: PeriodSelectorProps) => {\n  const maxPeriodsList = Array.from({ length: maxPeriods }, (_, index) => index + 1);\n  const chunkedPeriods = chunkPeriods(maxPeriodsList);\n\n  const checkboxItems = chunkedPeriods.map((periods, semester) => {\n    return periods.map((period) => ({\n      label: `${semester + 1}${periods.length === 1 ? '' : `.${((period - 1) % PERIODS_PER_SEMESTER) + 1}`}`,\n      value: period.toString(),\n    }));\n  });\n\n  const returnValues = useRef<number[][]>(\n    chunkedPeriods.map((semester) =>\n      semester.reduce((periods, period) => {\n        if (defaultValues?.includes(period)) periods.push(period);\n        return periods;\n      }, [] as number[])\n    )\n  );\n  const [disableSemesters, setDisableSemesters] = useState<number[]>([]);\n\n  const disableGroups = (selects: number[][]) => {\n    if (selects[SEMESTER_1].length !== 0 || selects[SEMESTER_2].length !== 0) return [SEMESTER_3];\n    if (selects[SEMESTER_3].length !== 0) return [SEMESTER_1, SEMESTER_2];\n    return [];\n  };\n\n  const handleChange = (values: string[], index: number) => {\n    returnValues.current[index] = values.map((num) => Number(num));\n    setDisableSemesters(disableGroups(returnValues.current));\n    onChange([...returnValues.current.flat()].sort());\n  };\n\n  useEffect(() => {\n    setDisableSemesters(disableGroups(returnValues.current));\n  }, []);\n\n  return (\n    <div\n      className={clsx(\n        styles['period-selector__container'],\n        styles[`period-selector__container--label-${labelPosition}`]\n      )}\n    >\n      {label && (\n        <Label htmlFor=\"\" required={required}>\n          {label}\n        </Label>\n      )}\n      <div className={styles['period-selector__selector-container']}>\n        <div className={styles['period-selector__selector-row']}>\n          {checkboxItems.map((checkboxes, semester) => (\n            <CheckboxButtonBar\n              key={`group_${semester}`}\n              checkboxes={checkboxes}\n              defaultValues={returnValues.current[semester].map((num) => num.toString())}\n              disableGroup={disableSemesters.includes(semester)}\n              required={required}\n              onSetValues={(event) => handleChange(event, semester)}\n            />\n          ))}\n        </div>\n        <div className={styles['period-selector__error']}></div>\n        {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n      </div>\n    </div>\n  );\n};\n"],"names":["SEMESTER_1","SEMESTER_2","SEMESTER_3","PERIODS_PER_SEMESTER","MAX_PERIODS","chunkPeriods","array","result","count","PeriodSelector","maxPeriods","defaultValues","label","labelPosition","required","notValidatedText","onChange","maxPeriodsList","_","index","chunkedPeriods","checkboxItems","periods","semester","period","returnValues","useRef","disableSemesters","setDisableSemesters","useState","disableGroups","selects","handleChange","values","num","useEffect","jsxs","clsx","styles","jsx","Label","checkboxes","CheckboxButtonBar","event","FeedbackBox"],"mappings":"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"}

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

@@ -16,7 +16,7 @@ import "../IconButton/IconButton.js";
 import "../Input/Input.js";
 import "../InputField/InputField.js";
 import "react-router-dom";
-import "../../TablePlugin-B-Q_UBXj.js";
+import "../../TablePlugin-CMsi2UDH.js";
 import { Repeater as i } from "../Repeater/Repeater.js";
 import "../RteEditor/Providers/LanguageProvider.js";
 import "../RteEditor/hooks/components/Flyout.js";

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

@@ -13,7 +13,7 @@ import "../../IconButton/IconButton.js";
 import "../../Input/Input.js";
 import "../../InputField/InputField.js";
 import "react-router-dom";
-import "../../../TablePlugin-B-Q_UBXj.js";
+import "../../../TablePlugin-CMsi2UDH.js";
 import "../Providers/LanguageProvider.js";
 import "../hooks/components/Flyout.js";
 import "../../SelectListbox/SelectListbox.js";

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

@@ -4,7 +4,7 @@ import { c as f } from "../../../../clsx-OuTLNxxd.js";
 import { A as _, x as p, d as h } from "../../../../Lexical.prod-eo-UKDld.js";
 import { useState as l, useEffect as k } from "react";
 import { Icon as I } from "../../../Icon/Icon.js";
-import { s as a } from "../../../../RteEditor.module-BwAtWRHo.js";
+import { s as a } from "../../../../RteEditor.module-XCAFrP3U.js";
 import { useTranslation as B } from "../../hooks/useTranslation.js";
 const x = {
   bold: "Bold",

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

@@ -16,8 +16,8 @@ import "../../../IconButton/IconButton.js";
 import "../../../Input/Input.js";
 import "../../../InputField/InputField.js";
 import "react-router-dom";
-import "../../../../TablePlugin-B-Q_UBXj.js";
-import { s as r } from "../../../../RteEditor.module-BwAtWRHo.js";
+import "../../../../TablePlugin-CMsi2UDH.js";
+import { s as r } from "../../../../RteEditor.module-XCAFrP3U.js";
 import { useTranslation as g } from "../../hooks/useTranslation.js";
 import "../../hooks/components/Flyout.js";
 import "../../Providers/LanguageProvider.js";

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

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "react";
 import "../../../../helpers-BD3Y_bqE.js";
-import { A as z } from "../../../../TablePlugin-B-Q_UBXj.js";
+import { A as z } from "../../../../TablePlugin-CMsi2UDH.js";
 import "../../../Icon/Icon.js";
 import "../../../Buttons/Button.js";
 import "../../../Buttons/LinkButton.js";

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

@@ -4,7 +4,7 @@ import { c as j } from "../../../../clsx-OuTLNxxd.js";
 import { g as w, m as V, e as z, U as W } from "../../../../helpers-BD3Y_bqE.js";
 import { useRef as p, useState as Y, useEffect as x } from "react";
 import { e as q, A as m, r as B, x as T, _ as G, L as J, l as M, E as Q } from "../../../../Lexical.prod-eo-UKDld.js";
-import { A as X } from "../../../../TablePlugin-B-Q_UBXj.js";
+import { A as X } from "../../../../TablePlugin-CMsi2UDH.js";
 import { useFlyout as Z } from "../../hooks/useFlyout.js";
 import { Icon as $ } from "../../../Icon/Icon.js";
 import "../../../Buttons/Button.js";
@@ -19,7 +19,7 @@ import "../../../IconButton/IconButton.js";
 import "../../../Input/Input.js";
 import "../../../InputField/InputField.js";
 import "react-router-dom";
-import { s as d } from "../../../../RteEditor.module-BwAtWRHo.js";
+import { s as d } from "../../../../RteEditor.module-XCAFrP3U.js";
 import { useTranslation as tt } from "../../hooks/useTranslation.js";
 import "../../Providers/LanguageProvider.js";
 import "../../../SelectListbox/SelectListbox.js";

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

@@ -1,11 +1,11 @@
 import "react/jsx-runtime";
 import "../../../../LexicalComposerContext.prod-Dyvim1tK.js";
-import { L as f } from "../../../../ListPlugin-Bb5eekAl.js";
+import { L as f } from "../../../../ListPlugin-B-2w9EIN.js";
 import "react";
 import "../../../../clsx-OuTLNxxd.js";
 import "../../../../Lexical.prod-eo-UKDld.js";
 import "../../../Icon/Icon.js";
-import "../../../../RteEditor.module-BwAtWRHo.js";
+import "../../../../RteEditor.module-XCAFrP3U.js";
 import "../../hooks/useTranslation.js";
 export {
   f as ListPlugin

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

@@ -1,4 +1,4 @@
-import { L as r } from "../../../../ListPlugin-Bb5eekAl.js";
+import { L as r } from "../../../../ListPlugin-B-2w9EIN.js";
 export {
   r as ListPlugin
 };

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

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { b as v } from "../../../../TablePlugin-B-Q_UBXj.js";
+import { b as v } from "../../../../TablePlugin-CMsi2UDH.js";
 import "../../../Buttons/Button.js";
 import "../../../Buttons/LinkButton.js";
 import "@react-aria/button";

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

@@ -1,52 +1,62 @@
-import { jsxs as g, jsx as e } from "react/jsx-runtime";
-import { useState as _, useRef as d, useEffect as R } from "react";
+import { jsxs as y, jsx as e } from "react/jsx-runtime";
+import { useState as _, useRef as b, useEffect as R } from "react";
 import { c as w } from "../../../../../clsx-OuTLNxxd.js";
-import { u as $ } from "../../../../../LexicalComposerContext.prod-Dyvim1tK.js";
-import { Icon as k } from "../../../../Icon/Icon.js";
+import { u as P } from "../../../../../LexicalComposerContext.prod-Dyvim1tK.js";
+import { Icon as $ } from "../../../../Icon/Icon.js";
 import { useTranslation as H } from "../../../hooks/useTranslation.js";
 import '../../../../../assets/TableCellContextMenu.css';const n = {
-  "context-menu__wrapper": "_context-menu__wrapper_y87hy_1",
-  "context-menu__button": "_context-menu__button_y87hy_10",
-  "context-menu": "_context-menu_y87hy_1",
-  "context-menu--open": "_context-menu--open_y87hy_38",
-  "context-menu__item": "_context-menu__item_y87hy_43",
-  "context-menu__item-divider": "_context-menu__item-divider_y87hy_57",
-  "context-menu__wrapper--hidden": "_context-menu__wrapper--hidden_y87hy_61"
-}, O = 25, N = 10, f = 4, A = 25, M = (u) => {
-  const r = u.cloneNode(!0);
+  "context-menu__wrapper": "_context-menu__wrapper_xbeks_1",
+  "context-menu__button": "_context-menu__button_xbeks_10",
+  "context-menu": "_context-menu_xbeks_1",
+  "context-menu--open": "_context-menu--open_xbeks_38",
+  "context-menu__item": "_context-menu__item_xbeks_43",
+  "context-menu__item-divider": "_context-menu__item-divider_xbeks_57",
+  "context-menu__wrapper--hidden": "_context-menu__wrapper--hidden_xbeks_61"
+}, O = 25, N = 10, f = 4, A = 25, M = (a) => {
+  const r = a.cloneNode(!0);
   r.style.height = "auto", r.style.left = "-3000px", document.body.appendChild(r);
-  const b = r.getBoundingClientRect().height;
-  return document.body.removeChild(r), b;
-}, W = ({ position: u, parentScrollPosition: r, onAction: b }) => {
-  const t = H(), [T, h] = _(!1), [E, x] = _(!1), [c, B] = _({ xPos: 0, yPos: 0, height: 0 }), [m, I] = _(0), y = d(0), i = d(null), s = d(null), l = d(null), [v] = $(), a = (o) => {
-    b(o), h(!1);
-  }, C = () => {
-    const o = i.current ? i.current.getBoundingClientRect().width : 0;
-    s.current && i.current && l.current && (c.xPos < o && s.current ? (s.current.style.left = `${o - c.xPos + N}px`, l.current.style.right = `${o - c.xPos + f + N}px`) : (s.current.style.left = "0px", l.current.style.right = `${f}px`), m || I(M(i.current)), m > document.documentElement.clientHeight - c.yPos ? (s.current.style.top = `-${m + c.height}px`, l.current.style.top = `${m + f}px`, l.current.style.transform = "rotate(180deg)") : (s.current.style.top = "0px", l.current.style.top = `-${A}px`, l.current.style.transform = "none"));
-  }, P = () => (C(), `translate(${((c == null ? void 0 : c.xPos) ?? 0) - (i.current ? i.current.getBoundingClientRect().width : 0)}px, ${c.yPos - (r - y.current)}px)`);
+  const d = r.getBoundingClientRect().height;
+  return document.body.removeChild(r), d;
+}, W = ({ position: a, parentScrollPosition: r, onAction: d }) => {
+  const t = H(), [k, x] = _(!1), [T, p] = _(!1), [s, E] = _({ xPos: 0, yPos: 0, height: 0 }), [m, B] = _(0), C = b(0), c = b(null), i = b(null), o = b(null), [I] = P(), u = (l) => {
+    d(l), x(!1);
+  }, g = () => {
+    const l = c.current ? c.current.getBoundingClientRect().width : 0;
+    i.current && c.current && o.current && (s.xPos < l && i.current ? (i.current.style.left = `${l - s.xPos + N}px`, o.current.style.right = `${l - s.xPos + f + N}px`) : (i.current.style.left = "0px", o.current.style.right = `${f}px`), m || B(M(c.current)), m > document.documentElement.clientHeight - s.yPos ? (i.current.style.top = `-${m + s.height}px`, o.current.style.top = `${m + f}px`, o.current.style.transform = "rotate(180deg)") : (i.current.style.top = "0px", o.current.style.top = `-${A}px`, o.current.style.transform = "none"));
+  }, v = () => (g(), `translate(${((s == null ? void 0 : s.xPos) ?? 0) - (c.current ? c.current.getBoundingClientRect().width : 0)}px, ${s.yPos - (r - C.current)}px)`);
   return R(() => {
-    B(u), u && (y.current = r), h(!1), x(!1);
-  }, [u]), R(() => {
-    if (l.current) {
-      const o = l.current.getBoundingClientRect(), p = v.getRootElement();
-      if (!p) return;
-      o.top - p.getBoundingClientRect().top <= 0 || o.top - p.getBoundingClientRect().bottom + O >= 0 ? x(!0) : x(!1), C();
+    E(a), a && (C.current = r), x(!1), p(!1);
+  }, [a]), R(() => {
+    if (o.current) {
+      const l = o.current.getBoundingClientRect(), h = I.getRootElement();
+      if (!h) return;
+      l.top - h.getBoundingClientRect().top <= 0 || l.top - h.getBoundingClientRect().bottom + O >= 0 ? p(!0) : p(!1), g();
     }
-  }, [r]), /* @__PURE__ */ g(
+  }, [r]), /* @__PURE__ */ y(
     "div",
     {
-      className: w(n["context-menu__wrapper"], [E && n["context-menu__wrapper--hidden"]]),
+      className: w(n["context-menu__wrapper"], [T && n["context-menu__wrapper--hidden"]]),
       style: {
-        transform: `${P()}`
+        transform: `${v()}`
       },
-      ref: s,
+      ref: i,
       children: [
-        /* @__PURE__ */ e("button", { onClick: () => h((o) => !o), className: n["context-menu__button"], ref: l, children: /* @__PURE__ */ e(k, { name: "CheveronDown", size: 16 }) }),
-        /* @__PURE__ */ g("ul", { ref: i, className: w(n["context-menu"], T && n["context-menu--open"]), children: [
+        /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: () => x((l) => !l),
+            className: n["context-menu__button"],
+            ref: o,
+            children: /* @__PURE__ */ e($, { name: "CheveronDown", size: 16 })
+          }
+        ),
+        /* @__PURE__ */ y("ul", { ref: c, className: w(n["context-menu"], k && n["context-menu--open"]), children: [
           /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("insertRowAbove"),
+              type: "button",
+              onClick: () => u("insertRowAbove"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableInsertRowAbove,
               children: t.table.insertRowAbove
@@ -55,7 +65,8 @@ import '../../../../../assets/TableCellContextMenu.css';const n = {
           /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("insertRowBelow"),
+              type: "button",
+              onClick: () => u("insertRowBelow"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableInsertRowBelow,
               children: t.table.insertRowBelow
@@ -64,7 +75,8 @@ import '../../../../../assets/TableCellContextMenu.css';const n = {
           /* @__PURE__ */ e("li", { className: n["context-menu__item-divider"], children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("deleteRow"),
+              type: "button",
+              onClick: () => u("deleteRow"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableDeleteRow,
               children: t.table.deleteRow
@@ -73,7 +85,8 @@ import '../../../../../assets/TableCellContextMenu.css';const n = {
           /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("insertColumnLeft"),
+              type: "button",
+              onClick: () => u("insertColumnLeft"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableInsertColumnLeft,
               children: t.table.insertColumnLeft
@@ -82,7 +95,8 @@ import '../../../../../assets/TableCellContextMenu.css';const n = {
           /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("insertColumnRight"),
+              type: "button",
+              onClick: () => u("insertColumnRight"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableInsertColumnRight,
               children: t.table.insertColumnRight
@@ -91,20 +105,20 @@ import '../../../../../assets/TableCellContextMenu.css';const n = {
           /* @__PURE__ */ e("li", { className: n["context-menu__item-divider"], children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("deleteColumn"),
+              type: "button",
+              onClick: () => u("deleteColumn"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableDeleteColumn,
-              type: "button",
               children: t.table.deleteColumn
             }
           ) }),
           /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => a("deleteTable"),
+              type: "button",
+              onClick: () => u("deleteTable"),
               className: n["context-menu__item"],
               "aria-label": t.aria.labels.tableDeleteTable,
-              type: "button",
               children: t.table.deleteTable
             }
           ) })

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

@@ -1 +1 @@
-{"version":3,"file":"TableCellContextMenu.js","sources":["../../../../../../src/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\n\nimport type { Position } from 'components/RteEditor/Plugins/ToolbarPlugin';\n\nimport styles from './TableCellContextMenu.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nexport type Actions =\n  | 'insertRowAbove'\n  | 'insertRowBelow'\n  | 'deleteRow'\n  | 'deleteTable'\n  | 'insertColumnLeft'\n  | 'insertColumnRight'\n  | 'deleteColumn';\ninterface TableCellContextMenuProps {\n  position: Position;\n  parentScrollPosition: number;\n  onAction: (action: Actions) => void;\n}\n\nconst CONTEXT_MENU_OFFSET = 25;\nconst WHITE_SPACE = 10;\nconst BUTTON_SHIFT = 4;\nconst BUTTON_RESET = 25;\n\nconst mesureElement = (srcElement: HTMLElement) => {\n  const mesureElement = srcElement.cloneNode(true) as HTMLElement;\n  mesureElement.style.height = 'auto';\n  mesureElement.style.left = '-3000px';\n  document.body.appendChild(mesureElement);\n  const height = mesureElement.getBoundingClientRect().height;\n  document.body.removeChild(mesureElement);\n  return height;\n};\n\nexport const TableCellContextMenu = ({ position, parentScrollPosition, onAction }: TableCellContextMenuProps) => {\n  const t = useTranslation();\n  const [isOpen, setIsOpen] = useState(false);\n  const [isHidden, setIsHidden] = useState(false);\n  const [localPosition, setLocalPosition] = useState<Position>({ xPos: 0, yPos: 0, height: 0 });\n  const [menuHeight, setMenuHeight] = useState(0);\n  const startScrollPosition = useRef(0);\n  const menuRef = useRef<HTMLUListElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const [editor] = useLexicalComposerContext();\n\n  const handleAction = (action: Actions) => {\n    onAction(action);\n    setIsOpen(false);\n  };\n\n  const flipMenuIfNotInViewpoort = () => {\n    const menuWidth = menuRef.current ? menuRef.current.getBoundingClientRect().width : 0;\n\n    if (containerRef.current && menuRef.current && buttonRef.current) {\n      if (localPosition.xPos < menuWidth && containerRef.current) {\n        containerRef.current.style.left = `${menuWidth - localPosition.xPos + WHITE_SPACE}px`;\n        buttonRef.current.style.right = `${menuWidth - localPosition.xPos + BUTTON_SHIFT + WHITE_SPACE}px`;\n      } else {\n        containerRef.current.style.left = '0px';\n        buttonRef.current.style.right = `${BUTTON_SHIFT}px`;\n      }\n\n      if (!menuHeight) {\n        setMenuHeight(mesureElement(menuRef.current));\n      }\n\n      if (menuHeight > document.documentElement.clientHeight - localPosition.yPos) {\n        containerRef.current.style.top = `-${menuHeight + localPosition.height}px`;\n        buttonRef.current.style.top = `${menuHeight + BUTTON_SHIFT}px`;\n        buttonRef.current.style.transform = 'rotate(180deg)';\n      } else {\n        containerRef.current.style.top = '0px';\n        buttonRef.current.style.top = `-${BUTTON_RESET}px`;\n        buttonRef.current.style.transform = 'none';\n      }\n    }\n  };\n\n  const setMenuPosition = () => {\n    flipMenuIfNotInViewpoort();\n    return `translate(${(localPosition?.xPos ?? 0) - (menuRef.current ? menuRef.current.getBoundingClientRect().width : 0)}px, ${localPosition.yPos - (parentScrollPosition - startScrollPosition.current)}px)`;\n  };\n\n  useEffect(() => {\n    setLocalPosition(position);\n    if (position) {\n      startScrollPosition.current = parentScrollPosition;\n    }\n    setIsOpen(false);\n    setIsHidden(false);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [position]);\n\n  useEffect(() => {\n    if (buttonRef.current) {\n      const rect = buttonRef.current.getBoundingClientRect();\n      const rootElement = editor.getRootElement();\n      if (!rootElement) return;\n      if (\n        rect.top - rootElement.getBoundingClientRect().top <= 0 ||\n        rect.top - rootElement.getBoundingClientRect().bottom + CONTEXT_MENU_OFFSET >= 0\n      ) {\n        setIsHidden(true);\n      } else {\n        setIsHidden(false);\n      }\n      flipMenuIfNotInViewpoort();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [parentScrollPosition]);\n\n  return (\n    <div\n      className={clsx(styles['context-menu__wrapper'], [isHidden && styles['context-menu__wrapper--hidden']])}\n      style={{\n        transform: `${setMenuPosition()}`,\n      }}\n      ref={containerRef}\n    >\n      <button onClick={() => setIsOpen((prev) => !prev)} className={styles['context-menu__button']} ref={buttonRef}>\n        <Icon name=\"CheveronDown\" size={16} />\n      </button>\n      <ul ref={menuRef} className={clsx(styles['context-menu'], isOpen && styles['context-menu--open'])}>\n        <li>\n          <button\n            onClick={() => handleAction('insertRowAbove')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowAbove}\n          >\n            {t.table.insertRowAbove}\n          </button>\n        </li>\n        <li>\n          <button\n            onClick={() => handleAction('insertRowBelow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowBelow}\n          >\n            {t.table.insertRowBelow}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            onClick={() => handleAction('deleteRow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteRow}\n          >\n            {t.table.deleteRow}\n          </button>\n        </li>\n\n        <li>\n          <button\n            onClick={() => handleAction('insertColumnLeft')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnLeft}\n          >\n            {t.table.insertColumnLeft}\n          </button>\n        </li>\n        <li>\n          <button\n            onClick={() => handleAction('insertColumnRight')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnRight}\n          >\n            {t.table.insertColumnRight}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            onClick={() => handleAction('deleteColumn')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteColumn}\n            type=\"button\"\n          >\n            {t.table.deleteColumn}\n          </button>\n        </li>\n\n        <li>\n          <button\n            onClick={() => handleAction('deleteTable')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteTable}\n            type=\"button\"\n          >\n            {t.table.deleteTable}\n          </button>\n        </li>\n      </ul>\n    </div>\n  );\n};\n"],"names":["CONTEXT_MENU_OFFSET","WHITE_SPACE","BUTTON_SHIFT","BUTTON_RESET","mesureElement","srcElement","height","TableCellContextMenu","position","parentScrollPosition","onAction","useTranslation","isOpen","setIsOpen","useState","isHidden","setIsHidden","localPosition","setLocalPosition","menuHeight","setMenuHeight","startScrollPosition","useRef","menuRef","containerRef","buttonRef","editor","useLexicalComposerContext","handleAction","action","flipMenuIfNotInViewpoort","menuWidth","setMenuPosition","useEffect","rect","rootElement","jsxs","clsx","styles","jsx","prev","Icon"],"mappings":"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"}
+{"version":3,"file":"TableCellContextMenu.js","sources":["../../../../../../src/components/RteEditor/Plugins/TablePlugin/TableCellContextMenu/TableCellContextMenu.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';\n\nimport type { Position } from 'components/RteEditor/Plugins/ToolbarPlugin';\n\nimport styles from './TableCellContextMenu.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\n\nexport type Actions =\n  | 'insertRowAbove'\n  | 'insertRowBelow'\n  | 'deleteRow'\n  | 'deleteTable'\n  | 'insertColumnLeft'\n  | 'insertColumnRight'\n  | 'deleteColumn';\ninterface TableCellContextMenuProps {\n  position: Position;\n  parentScrollPosition: number;\n  onAction: (action: Actions) => void;\n}\n\nconst CONTEXT_MENU_OFFSET = 25;\nconst WHITE_SPACE = 10;\nconst BUTTON_SHIFT = 4;\nconst BUTTON_RESET = 25;\n\nconst mesureElement = (srcElement: HTMLElement) => {\n  const mesureElement = srcElement.cloneNode(true) as HTMLElement;\n  mesureElement.style.height = 'auto';\n  mesureElement.style.left = '-3000px';\n  document.body.appendChild(mesureElement);\n  const height = mesureElement.getBoundingClientRect().height;\n  document.body.removeChild(mesureElement);\n  return height;\n};\n\nexport const TableCellContextMenu = ({ position, parentScrollPosition, onAction }: TableCellContextMenuProps) => {\n  const t = useTranslation();\n  const [isOpen, setIsOpen] = useState(false);\n  const [isHidden, setIsHidden] = useState(false);\n  const [localPosition, setLocalPosition] = useState<Position>({ xPos: 0, yPos: 0, height: 0 });\n  const [menuHeight, setMenuHeight] = useState(0);\n  const startScrollPosition = useRef(0);\n  const menuRef = useRef<HTMLUListElement>(null);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const buttonRef = useRef<HTMLButtonElement>(null);\n  const [editor] = useLexicalComposerContext();\n\n  const handleAction = (action: Actions) => {\n    onAction(action);\n    setIsOpen(false);\n  };\n\n  const flipMenuIfNotInViewpoort = () => {\n    const menuWidth = menuRef.current ? menuRef.current.getBoundingClientRect().width : 0;\n\n    if (containerRef.current && menuRef.current && buttonRef.current) {\n      if (localPosition.xPos < menuWidth && containerRef.current) {\n        containerRef.current.style.left = `${menuWidth - localPosition.xPos + WHITE_SPACE}px`;\n        buttonRef.current.style.right = `${menuWidth - localPosition.xPos + BUTTON_SHIFT + WHITE_SPACE}px`;\n      } else {\n        containerRef.current.style.left = '0px';\n        buttonRef.current.style.right = `${BUTTON_SHIFT}px`;\n      }\n\n      if (!menuHeight) {\n        setMenuHeight(mesureElement(menuRef.current));\n      }\n\n      if (menuHeight > document.documentElement.clientHeight - localPosition.yPos) {\n        containerRef.current.style.top = `-${menuHeight + localPosition.height}px`;\n        buttonRef.current.style.top = `${menuHeight + BUTTON_SHIFT}px`;\n        buttonRef.current.style.transform = 'rotate(180deg)';\n      } else {\n        containerRef.current.style.top = '0px';\n        buttonRef.current.style.top = `-${BUTTON_RESET}px`;\n        buttonRef.current.style.transform = 'none';\n      }\n    }\n  };\n\n  const setMenuPosition = () => {\n    flipMenuIfNotInViewpoort();\n    return `translate(${(localPosition?.xPos ?? 0) - (menuRef.current ? menuRef.current.getBoundingClientRect().width : 0)}px, ${localPosition.yPos - (parentScrollPosition - startScrollPosition.current)}px)`;\n  };\n\n  useEffect(() => {\n    setLocalPosition(position);\n    if (position) {\n      startScrollPosition.current = parentScrollPosition;\n    }\n    setIsOpen(false);\n    setIsHidden(false);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [position]);\n\n  useEffect(() => {\n    if (buttonRef.current) {\n      const rect = buttonRef.current.getBoundingClientRect();\n      const rootElement = editor.getRootElement();\n      if (!rootElement) return;\n      if (\n        rect.top - rootElement.getBoundingClientRect().top <= 0 ||\n        rect.top - rootElement.getBoundingClientRect().bottom + CONTEXT_MENU_OFFSET >= 0\n      ) {\n        setIsHidden(true);\n      } else {\n        setIsHidden(false);\n      }\n      flipMenuIfNotInViewpoort();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [parentScrollPosition]);\n\n  return (\n    <div\n      className={clsx(styles['context-menu__wrapper'], [isHidden && styles['context-menu__wrapper--hidden']])}\n      style={{\n        transform: `${setMenuPosition()}`,\n      }}\n      ref={containerRef}\n    >\n      <button\n        type=\"button\"\n        onClick={() => setIsOpen((prev) => !prev)}\n        className={styles['context-menu__button']}\n        ref={buttonRef}\n      >\n        <Icon name=\"CheveronDown\" size={16} />\n      </button>\n      <ul ref={menuRef} className={clsx(styles['context-menu'], isOpen && styles['context-menu--open'])}>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowAbove')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowAbove}\n          >\n            {t.table.insertRowAbove}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertRowBelow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertRowBelow}\n          >\n            {t.table.insertRowBelow}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteRow')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteRow}\n          >\n            {t.table.deleteRow}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnLeft')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnLeft}\n          >\n            {t.table.insertColumnLeft}\n          </button>\n        </li>\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('insertColumnRight')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableInsertColumnRight}\n          >\n            {t.table.insertColumnRight}\n          </button>\n        </li>\n        <li className={styles['context-menu__item-divider']}>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteColumn')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteColumn}\n          >\n            {t.table.deleteColumn}\n          </button>\n        </li>\n\n        <li>\n          <button\n            type=\"button\"\n            onClick={() => handleAction('deleteTable')}\n            className={styles['context-menu__item']}\n            aria-label={t.aria.labels.tableDeleteTable}\n          >\n            {t.table.deleteTable}\n          </button>\n        </li>\n      </ul>\n    </div>\n  );\n};\n"],"names":["CONTEXT_MENU_OFFSET","WHITE_SPACE","BUTTON_SHIFT","BUTTON_RESET","mesureElement","srcElement","height","TableCellContextMenu","position","parentScrollPosition","onAction","useTranslation","isOpen","setIsOpen","useState","isHidden","setIsHidden","localPosition","setLocalPosition","menuHeight","setMenuHeight","startScrollPosition","useRef","menuRef","containerRef","buttonRef","editor","useLexicalComposerContext","handleAction","action","flipMenuIfNotInViewpoort","menuWidth","setMenuPosition","useEffect","rect","rootElement","jsxs","clsx","styles","jsx","prev","Icon"],"mappings":"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"}

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

@@ -4,7 +4,7 @@ import "../../../../clsx-OuTLNxxd.js";
 import "../../../../helpers-DONVwywj.js";
 import "../../../../Lexical.prod-eo-UKDld.js";
 import "react";
-import { T as B } from "../../../../TablePlugin-B-Q_UBXj.js";
+import { T as B } from "../../../../TablePlugin-CMsi2UDH.js";
 import "../../hooks/useFlyout.js";
 import "../../../Icon/Icon.js";
 import "../../../Buttons/Button.js";
@@ -19,7 +19,7 @@ import "../../../IconButton/IconButton.js";
 import "../../../Input/Input.js";
 import "../../../InputField/InputField.js";
 import "react-router-dom";
-import "../../../../RteEditor.module-BwAtWRHo.js";
+import "../../../../RteEditor.module-XCAFrP3U.js";
 import "../../hooks/useTranslation.js";
 import "../../Providers/LanguageProvider.js";
 import "../../../SelectListbox/SelectListbox.js";