@uva-glass/component-library 3.52.4 → 3.52.6

package/dist/components/SelectListbox/components/SelectButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectButton.js","sources":["../../../../src/components/SelectListbox/components/SelectButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, forwardRef } from 'react';\n\nimport type { KeyboardEvent } from 'react';\nimport type { OptionValue, SelectValue } from 'components/SelectListbox/SelectProvider';\n\nimport styles from 'components/SelectListbox/SelectListbox.module.css';\nimport { Icon } from 'components/Icon';\nimport { useSelect } from 'components/SelectListbox/SelectProvider';\n\nexport interface SelectButtonProps {\n  variant?: 'noborder' | 'pill' | 'pillLeft' | 'pillRight' | 'darkBorder' | 'roundedLeft' | 'roundedRight';\n  size?: 'small' | 'medium' | 'default';\n  onChange?: (option: OptionValue) => void;\n  buttonLabelProp?: string;\n  buttonLabelBold?: boolean;\n  disabled?: boolean;\n  notValid?: boolean;\n}\n\nexport const SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>((props, ref) => {\n  const {\n    variant,\n    size = 'default',\n    onChange,\n    buttonLabelProp = 'label',\n    buttonLabelBold,\n    disabled = false,\n    notValid = false,\n  } = props;\n  const buttonWrapper = useRef<HTMLSpanElement>(null);\n  const { listboxId, isOpen, selectedValue, toggleListbox, setIsOpen, setActiveIndex, options, isDirty } =\n    useSelect() || {};\n\n  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key.length === 1) {\n      const key = event.key.toLocaleLowerCase();\n      const optionIndexStartsWithKey = options.findIndex(\n        (option) => !option.disabled && option.label.toLocaleLowerCase().startsWith(key)\n      );\n      if (optionIndexStartsWithKey !== -1) {\n        setActiveIndex(optionIndexStartsWithKey);\n        if (!isOpen) setIsOpen(true);\n        event.preventDefault();\n        return;\n      }\n    }\n\n    switch (event.key) {\n      case 'Enter':\n        event.preventDefault();\n        if (!isOpen) {\n          setIsOpen(true);\n          return;\n        }\n        break;\n      case 'Escape':\n        if (isOpen) {\n          event.stopPropagation();\n          setActiveIndex(options.findIndex((option) => option.value === selectedValue?.value));\n          setIsOpen(false);\n        }\n        break;\n    }\n  };\n\n  useEffect(() => {\n    if (isOpen) {\n      (buttonWrapper.current?.children[0] as HTMLButtonElement).blur();\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (onChange) {\n      onChange(selectedValue);\n    }\n\n    isDirty && (buttonWrapper.current?.children[0] as HTMLButtonElement).focus();\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [onChange, selectedValue]);\n\n  return (\n    <span ref={buttonWrapper}>\n      <button\n        className={clsx(styles['select-listbox-trigger'], styles[`select-listbox-trigger--${size}`], {\n          [styles[`select-listbox-trigger--${variant}`]]: variant,\n          [styles['select-listbox-trigger--bold']]: buttonLabelBold,\n          [styles['select-listbox-trigger--not-valid']]: notValid,\n        })}\n        type=\"button\"\n        onClick={toggleListbox}\n        onKeyDown={onTriggerKeyDown}\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        aria-label={`${selectedValue.label}`}\n        disabled={disabled}\n        aria-controls={listboxId}\n        {...(ref && { ref: ref })}\n      >\n        <span className={styles['select-listbox-trigger-label']}>\n          {selectedValue[buttonLabelProp as keyof SelectValue]}\n        </span>\n\n        <Icon\n          className={clsx(styles['select-listbox-trigger-icon'], {\n            [styles['select-listbox-trigger-icon--open']]: isOpen,\n          })}\n          name=\"CheveronDown\"\n          size={16}\n        />\n      </button>\n    </span>\n  );\n});\n"],"names":["SelectButton","forwardRef","props","ref","variant","size","onChange","buttonLabelProp","buttonLabelBold","disabled","notValid","buttonWrapper","useRef","listboxId","isOpen","selectedValue","toggleListbox","setIsOpen","setActiveIndex","options","isDirty","useSelect","onTriggerKeyDown","event","key","optionIndexStartsWithKey","option","useEffect","jsx","jsxs","clsx","styles","Icon"],"mappings":";;;;;;AAoBO,MAAMA,IAAeC,EAAiD,CAACC,GAAOC,MAAQ;AAC3F,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC;AAAA,IACA,iBAAAC,IAAkB;AAAA,IAClB,iBAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,EAAA,IACTR,GACES,IAAgBC,EAAwB,IAAI,GAC5C,EAAE,WAAAC,GAAW,QAAAC,GAAQ,eAAAC,GAAe,eAAAC,GAAe,WAAAC,GAAW,gBAAAC,GAAgB,SAAAC,GAAS,SAAAC,MAC3FC,EAAA,KAAe,CAAA,GAEXC,IAAmB,CAACC,MAA4C;AACpE,QAAIA,EAAM,IAAI,WAAW,GAAG;AAC1B,YAAMC,IAAMD,EAAM,IAAI,kBAAA,GAChBE,IAA2BN,EAAQ;AAAA,QACvC,CAACO,MAAW,CAACA,EAAO,YAAYA,EAAO,MAAM,oBAAoB,WAAWF,CAAG;AAAA,MAAA;AAEjF,UAAIC,MAA6B,IAAI;AACnC,QAAAP,EAAeO,CAAwB,GAClCX,KAAQG,EAAU,EAAI,GAC3BM,EAAM,eAAA;AACN;AAAA,MACF;AAAA,IACF;AAEA,YAAQA,EAAM,KAAA;AAAA,MACZ,KAAK;AAEH,YADAA,EAAM,eAAA,GACF,CAACT,GAAQ;AACX,UAAAG,EAAU,EAAI;AACd;AAAA,QACF;AACA;AAAA,MACF,KAAK;AACH,QAAIH,MACFS,EAAM,gBAAA,GACNL,EAAeC,EAAQ,UAAU,CAACO,MAAWA,EAAO,UAAUX,GAAe,KAAK,CAAC,GACnFE,EAAU,EAAK;AAEjB;AAAA,IAAA;AAAA,EAEN;AAEA,SAAAU,EAAU,MAAM;AACd,IAAIb,MACDH,EAAc,SAAS,SAAS,CAAC,GAAwB,KAAA;AAAA,EAE9D,GAAG,CAACG,CAAM,CAAC,GAEXa,EAAU,MAAM;AACd,IAAIrB,KACFA,EAASS,CAAa,GAGxBK,MAAYT,EAAc,SAAS,SAAS,CAAC,GAAwB,MAAA;AAAA,EAGvE,GAAG,CAACL,GAAUS,CAAa,CAAC,GAG1B,gBAAAa,EAAC,QAAA,EAAK,KAAKjB,GACT,UAAA,gBAAAkB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,wBAAwB,GAAGA,EAAO,2BAA2B1B,CAAI,EAAE,GAAG;AAAA,QAC3F,CAAC0B,EAAO,2BAA2B3B,CAAO,EAAE,CAAC,GAAGA;AAAA,QAChD,CAAC2B,EAAO,8BAA8B,CAAC,GAAGvB;AAAA,QAC1C,CAACuB,EAAO,mCAAmC,CAAC,GAAGrB;AAAA,MAAA,CAChD;AAAA,MACD,MAAK;AAAA,MACL,SAASM;AAAA,MACT,WAAWM;AAAA,MACX,iBAAeR;AAAA,MACf,iBAAc;AAAA,MACd,cAAY,GAAGC,EAAc,KAAK;AAAA,MAClC,UAAAN;AAAA,MACA,iBAAeI;AAAA,MACd,GAAIV,KAAO,EAAE,KAAAA,EAAA;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAyB,EAAC,UAAK,WAAWG,EAAO,8BAA8B,GACnD,UAAAhB,EAAcR,CAAoC,GACrD;AAAA,QAEA,gBAAAqB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAWF,EAAKC,EAAO,6BAA6B,GAAG;AAAA,cACrD,CAACA,EAAO,mCAAmC,CAAC,GAAGjB;AAAA,YAAA,CAChD;AAAA,YACD,MAAK;AAAA,YACL,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ,CAAC;"}
+{"version":3,"file":"SelectButton.js","sources":["../../../../src/components/SelectListbox/components/SelectButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, forwardRef } from 'react';\n\nimport type { KeyboardEvent } from 'react';\nimport type { OptionValue, SelectValue } from 'components/SelectListbox/SelectProvider';\n\nimport styles from 'components/SelectListbox/SelectListbox.module.css';\nimport { Icon } from 'components/Icon';\nimport { useSelect } from 'components/SelectListbox/SelectProvider';\n\nexport interface SelectButtonProps {\n  variant?: 'noborder' | 'pill' | 'pillLeft' | 'pillRight' | 'darkBorder' | 'roundedLeft' | 'roundedRight';\n  size?: 'small' | 'medium' | 'default';\n  onChange?: (option: OptionValue) => void;\n  buttonLabelProp?: string;\n  buttonLabelBold?: boolean;\n  disabled?: boolean;\n  notValid?: boolean;\n}\n\nexport const SelectButton = forwardRef<HTMLButtonElement, SelectButtonProps>((props, ref) => {\n  const {\n    variant,\n    size = 'default',\n    onChange,\n    buttonLabelProp = 'label',\n    buttonLabelBold,\n    disabled = false,\n    notValid = false,\n  } = props;\n  const buttonWrapper = useRef<HTMLSpanElement>(null);\n  const { listboxId, isOpen, selectedValue, toggleListbox, setIsOpen, setActiveIndex, options, isDirty } =\n    useSelect() || {};\n\n  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n    if (event.key.length === 1) {\n      const key = event.key.toLocaleLowerCase();\n      const optionIndexStartsWithKey = options.findIndex(\n        (option) => !option.disabled && option.label.toLocaleLowerCase().startsWith(key)\n      );\n      if (optionIndexStartsWithKey !== -1) {\n        setActiveIndex(optionIndexStartsWithKey);\n        if (!isOpen) setIsOpen(true);\n        event.preventDefault();\n        return;\n      }\n    }\n\n    switch (event.key) {\n      case 'Enter':\n        event.preventDefault();\n        if (!isOpen) {\n          setIsOpen(true);\n          return;\n        }\n        break;\n      case 'Escape':\n        if (isOpen) {\n          event.stopPropagation();\n          setActiveIndex(options.findIndex((option) => option.value === selectedValue?.value));\n          setIsOpen(false);\n        }\n        break;\n    }\n  };\n\n  useEffect(() => {\n    if (isOpen) {\n      (buttonWrapper.current?.children[0] as HTMLButtonElement).blur();\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (onChange) {\n      onChange(selectedValue);\n    }\n\n    isDirty && (buttonWrapper.current?.children[0] as HTMLButtonElement).focus();\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [selectedValue]);\n\n  return (\n    <span ref={buttonWrapper}>\n      <button\n        className={clsx(styles['select-listbox-trigger'], styles[`select-listbox-trigger--${size}`], {\n          [styles[`select-listbox-trigger--${variant}`]]: variant,\n          [styles['select-listbox-trigger--bold']]: buttonLabelBold,\n          [styles['select-listbox-trigger--not-valid']]: notValid,\n        })}\n        type=\"button\"\n        onClick={toggleListbox}\n        onKeyDown={onTriggerKeyDown}\n        aria-expanded={isOpen}\n        aria-haspopup=\"listbox\"\n        aria-label={`${selectedValue.label}`}\n        disabled={disabled}\n        aria-controls={listboxId}\n        {...(ref && { ref: ref })}\n      >\n        <span className={styles['select-listbox-trigger-label']}>\n          {selectedValue[buttonLabelProp as keyof SelectValue]}\n        </span>\n\n        <Icon\n          className={clsx(styles['select-listbox-trigger-icon'], {\n            [styles['select-listbox-trigger-icon--open']]: isOpen,\n          })}\n          name=\"CheveronDown\"\n          size={16}\n        />\n      </button>\n    </span>\n  );\n});\n"],"names":["SelectButton","forwardRef","props","ref","variant","size","onChange","buttonLabelProp","buttonLabelBold","disabled","notValid","buttonWrapper","useRef","listboxId","isOpen","selectedValue","toggleListbox","setIsOpen","setActiveIndex","options","isDirty","useSelect","onTriggerKeyDown","event","key","optionIndexStartsWithKey","option","useEffect","jsx","jsxs","clsx","styles","Icon"],"mappings":";;;;;;AAoBO,MAAMA,IAAeC,EAAiD,CAACC,GAAOC,MAAQ;AAC3F,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,UAAAC;AAAA,IACA,iBAAAC,IAAkB;AAAA,IAClB,iBAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,EAAA,IACTR,GACES,IAAgBC,EAAwB,IAAI,GAC5C,EAAE,WAAAC,GAAW,QAAAC,GAAQ,eAAAC,GAAe,eAAAC,GAAe,WAAAC,GAAW,gBAAAC,GAAgB,SAAAC,GAAS,SAAAC,MAC3FC,EAAA,KAAe,CAAA,GAEXC,IAAmB,CAACC,MAA4C;AACpE,QAAIA,EAAM,IAAI,WAAW,GAAG;AAC1B,YAAMC,IAAMD,EAAM,IAAI,kBAAA,GAChBE,IAA2BN,EAAQ;AAAA,QACvC,CAACO,MAAW,CAACA,EAAO,YAAYA,EAAO,MAAM,oBAAoB,WAAWF,CAAG;AAAA,MAAA;AAEjF,UAAIC,MAA6B,IAAI;AACnC,QAAAP,EAAeO,CAAwB,GAClCX,KAAQG,EAAU,EAAI,GAC3BM,EAAM,eAAA;AACN;AAAA,MACF;AAAA,IACF;AAEA,YAAQA,EAAM,KAAA;AAAA,MACZ,KAAK;AAEH,YADAA,EAAM,eAAA,GACF,CAACT,GAAQ;AACX,UAAAG,EAAU,EAAI;AACd;AAAA,QACF;AACA;AAAA,MACF,KAAK;AACH,QAAIH,MACFS,EAAM,gBAAA,GACNL,EAAeC,EAAQ,UAAU,CAACO,MAAWA,EAAO,UAAUX,GAAe,KAAK,CAAC,GACnFE,EAAU,EAAK;AAEjB;AAAA,IAAA;AAAA,EAEN;AAEA,SAAAU,EAAU,MAAM;AACd,IAAIb,MACDH,EAAc,SAAS,SAAS,CAAC,GAAwB,KAAA;AAAA,EAE9D,GAAG,CAACG,CAAM,CAAC,GAEXa,EAAU,MAAM;AACd,IAAIrB,KACFA,EAASS,CAAa,GAGxBK,MAAYT,EAAc,SAAS,SAAS,CAAC,GAAwB,MAAA;AAAA,EAGvE,GAAG,CAACI,CAAa,CAAC,GAGhB,gBAAAa,EAAC,QAAA,EAAK,KAAKjB,GACT,UAAA,gBAAAkB;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,wBAAwB,GAAGA,EAAO,2BAA2B1B,CAAI,EAAE,GAAG;AAAA,QAC3F,CAAC0B,EAAO,2BAA2B3B,CAAO,EAAE,CAAC,GAAGA;AAAA,QAChD,CAAC2B,EAAO,8BAA8B,CAAC,GAAGvB;AAAA,QAC1C,CAACuB,EAAO,mCAAmC,CAAC,GAAGrB;AAAA,MAAA,CAChD;AAAA,MACD,MAAK;AAAA,MACL,SAASM;AAAA,MACT,WAAWM;AAAA,MACX,iBAAeR;AAAA,MACf,iBAAc;AAAA,MACd,cAAY,GAAGC,EAAc,KAAK;AAAA,MAClC,UAAAN;AAAA,MACA,iBAAeI;AAAA,MACd,GAAIV,KAAO,EAAE,KAAAA,EAAA;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAyB,EAAC,UAAK,WAAWG,EAAO,8BAA8B,GACnD,UAAAhB,EAAcR,CAAoC,GACrD;AAAA,QAEA,gBAAAqB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAWF,EAAKC,EAAO,6BAA6B,GAAG;AAAA,cACrD,CAACA,EAAO,mCAAmC,CAAC,GAAGjB;AAAA,YAAA,CAChD;AAAA,YACD,MAAK;AAAA,YACL,MAAM;AAAA,UAAA;AAAA,QAAA;AAAA,MACR;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ,CAAC;"}

package/dist/components/index.js

@@ -37,7 +37,7 @@ import { MenuLink as Co } from "./MenuLink/MenuLink.js";
 import { MetaDataBar as Fo } from "./MetaDataBar/MetaDataBar.js";
 import { MetaDataList as Mo } from "./MetaDataList/MetaDataList.js";
 import { ModalDialog as Lo } from "./ModalDialog/ModalDialog.js";
-import { M as Ro } from "../TablePlugin-BLbsvcuu.js";
+import { M as Ro } from "../TablePlugin-CqCjNBW_.js";
 import { MultiSelectBox as yo } from "./MultiSelectBox/MultiSelectBox.js";
 import { Notification as Do } from "./Notification/Notification.js";
 import { OverlayCloseButton as vo } from "./OverlayCloseButton/OverlayCloseButton.js";

package/dist/index.js

@@ -37,7 +37,7 @@ import { MenuLink as Co } from "./components/MenuLink/MenuLink.js";
 import { MetaDataBar as Fo } from "./components/MetaDataBar/MetaDataBar.js";
 import { MetaDataList as Mo } from "./components/MetaDataList/MetaDataList.js";
 import { ModalDialog as Lo } from "./components/ModalDialog/ModalDialog.js";
-import { M as Ro } from "./TablePlugin-BLbsvcuu.js";
+import { M as Ro } from "./TablePlugin-CqCjNBW_.js";
 import { MultiSelectBox as yo } from "./components/MultiSelectBox/MultiSelectBox.js";
 import { Notification as Do } from "./components/Notification/Notification.js";
 import { OverlayCloseButton as vo } 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.52.4",
+  "version": "3.52.6",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -61,7 +61,7 @@
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.0",
     "@types/jest": "^30.0.0",
-    "@types/node": "^24.9.2",
+    "@types/node": "^24.10.0",
     "@types/react": "^19.2.2",
     "@types/react-dom": "^19.2.2",
     "@uva-glass/eslint-config": "^1.3.11",
@@ -102,11 +102,11 @@
     "@babel/preset-env": "^7.28.5",
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
-    "@lexical/link": "^0.37.0",
-    "@lexical/list": "^0.37.0",
-    "@lexical/react": "^0.37.0",
+    "@lexical/link": "^0.38.2",
+    "@lexical/list": "^0.38.2",
+    "@lexical/react": "^0.38.2",
     "@staartwind.nl/lexical-paste-from-word": "^1.0.2",
-    "lexical": "^0.37.0"
+    "lexical": "^0.38.2"
   },
   "optionalDependencies": {
     "@ast-grep/napi-linux-x64-gnu": "0.39.7",