@douglasneuroinformatics/libui 4.9.0 → 4.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components.js +6 -20
  2. package/dist/components.js.map +1 -1
  3. package/dist/providers.js +1 -1
  4. package/dist/providers.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/components/Form/BooleanField/BooleanFieldRadio.tsx +6 -12
  7. package/src/components/Form/Form.stories.tsx +2 -0
  8. package/src/providers/CoreProvider/DestructiveActionDialog.tsx +1 -1
package/dist/providers.js CHANGED
@@ -68,7 +68,7 @@ var DestructiveActionDialog = () => {
68
68
  deletePendingDestructiveAction(current.id);
69
69
  }
70
70
  };
71
- return /* @__PURE__ */ jsx(Dialog, { open: current !== null, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Content, { onOpenAutoFocus: (event) => event.preventDefault(), children: [
71
+ return /* @__PURE__ */ jsx(Dialog, { open: current !== null, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Content, { "data-testid": "destructive-action-dialog", onOpenAutoFocus: (event) => event.preventDefault(), children: [
72
72
  /* @__PURE__ */ jsxs(Dialog.Header, { children: [
73
73
  /* @__PURE__ */ jsx(Dialog.Title, { children: display.title }),
74
74
  /* @__PURE__ */ jsx(Dialog.Description, { children: display.description })
package/dist/providers.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/providers/CoreProvider/DestructiveActionDialog.tsx","../src/providers/CoreProvider/CoreProvider.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { Button } from '@/components/Button';\nimport { Dialog } from '@/components/Dialog';\nimport { useDestructiveActionStore } from '@/hooks/useDestructiveAction/useDestructiveActionStore';\nimport type { DestructiveActionDef } from '@/hooks/useDestructiveAction/useDestructiveActionStore';\nimport { useTranslation } from '@/hooks/useTranslation';\n\nexport const DestructiveActionDialog = () => {\n const deletePendingDestructiveAction = useDestructiveActionStore((store) => store.deletePendingDestructiveAction);\n const pendingDestructiveActions = useDestructiveActionStore((store) => store.pendingDestructiveActions);\n const { resolvedLanguage, t } = useTranslation();\n\n const current = useMemo<DestructiveActionDef | null>(() => {\n if (pendingDestructiveActions[0]) {\n return pendingDestructiveActions[0];\n }\n return null;\n }, [pendingDestructiveActions]);\n\n const getDisplay = useCallback(\n (def: DestructiveActionDef | null) => {\n const defaultDescription = t({\n en: 'This action cannot be reversed. Please confirm that you would like to continue.',\n fr: 'Cette action ne peut être inversée. Veuillez confirmer que vous souhaitez poursuivre.'\n });\n const defaultTitle = t({\n en: 'Confirm Action',\n fr: \"Confirmer l'action\"\n });\n return {\n description: def?.description ?? defaultDescription,\n title: def?.title ?? defaultTitle\n };\n },\n [resolvedLanguage]\n );\n\n const [display, setDisplay] = useState<{ description: string; title: string }>(getDisplay(current));\n\n useEffect(() => {\n if (current) {\n setDisplay(getDisplay(current));\n }\n }, [current]);\n\n const handleConfirm = async () => {\n if (!current) {\n return;\n }\n try {\n await current.action();\n } finally {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n const handleCancel = () => {\n if (current) {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n const handleOpenChange = (isOpen: boolean) => {\n if (!isOpen && current) {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n return (\n <Dialog open={current !== null} onOpenChange={handleOpenChange}>\n <Dialog.Content onOpenAutoFocus={(event) => event.preventDefault()}>\n <Dialog.Header>\n <Dialog.Title>{display.title}</Dialog.Title>\n <Dialog.Description>{display.description}</Dialog.Description>\n </Dialog.Header>\n <Dialog.Footer>\n <Button className=\"min-w-16\" type=\"button\" variant=\"danger\" onClick={() => void handleConfirm()}>\n {t('libui.yes')}\n </Button>\n <Button className=\"min-w-16\" type=\"button\" variant=\"primary\" onClick={handleCancel}>\n {t('libui.no')}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n};\n","import { DestructiveActionDialog } from './DestructiveActionDialog';\nimport { NotificationHub } from './NotificationHub';\n\nexport const CoreProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n return (\n <>\n <DestructiveActionDialog />\n <NotificationHub />\n {children}\n </>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAwElD,SACE,KADF;AAhED,IAAM,0BAA0B,MAAM;AAC3C,QAAM,iCAAiC,0BAA0B,CAAC,UAAU,MAAM,8BAA8B;AAChH,QAAM,4BAA4B,0BAA0B,CAAC,UAAU,MAAM,yBAAyB;AACtG,QAAM,EAAE,kBAAkB,EAAE,IAAI,eAAe;AAE/C,QAAM,UAAU,QAAqC,MAAM;AACzD,QAAI,0BAA0B,CAAC,GAAG;AAChC,aAAO,0BAA0B,CAAC;AAAA,IACpC;AACA,WAAO;AAAA,EACT,GAAG,CAAC,yBAAyB,CAAC;AAE9B,QAAM,aAAa;AAAA,IACjB,CAAC,QAAqC;AACpC,YAAM,qBAAqB,EAAE;AAAA,QAC3B,IAAI;AAAA,QACJ,IAAI;AAAA,MACN,CAAC;AACD,YAAM,eAAe,EAAE;AAAA,QACrB,IAAI;AAAA,QACJ,IAAI;AAAA,MACN,CAAC;AACD,aAAO;AAAA,QACL,aAAa,KAAK,eAAe;AAAA,QACjC,OAAO,KAAK,SAAS;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiD,WAAW,OAAO,CAAC;AAElG,YAAU,MAAM;AACd,QAAI,SAAS;AACX,iBAAW,WAAW,OAAO,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,gBAAgB,YAAY;AAChC,QAAI,CAAC,SAAS;AACZ;AAAA,IACF;AACA,QAAI;AACF,YAAM,QAAQ,OAAO;AAAA,IACvB,UAAE;AACA,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,QAAM,eAAe,MAAM;AACzB,QAAI,SAAS;AACX,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,QAAI,CAAC,UAAU,SAAS;AACtB,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,SACE,oBAAC,UAAO,MAAM,YAAY,MAAM,cAAc,kBAC5C,+BAAC,OAAO,SAAP,EAAe,iBAAiB,CAAC,UAAU,MAAM,eAAe,GAC/D;AAAA,yBAAC,OAAO,QAAP,EACC;AAAA,0BAAC,OAAO,OAAP,EAAc,kBAAQ,OAAM;AAAA,MAC7B,oBAAC,OAAO,aAAP,EAAoB,kBAAQ,aAAY;AAAA,OAC3C;AAAA,IACA,qBAAC,OAAO,QAAP,EACC;AAAA,0BAAC,UAAO,WAAU,YAAW,MAAK,UAAS,SAAQ,UAAS,SAAS,MAAM,KAAK,cAAc,GAC3F,YAAE,WAAW,GAChB;AAAA,MACA,oBAAC,UAAO,WAAU,YAAW,MAAK,UAAS,SAAQ,WAAU,SAAS,cACnE,YAAE,UAAU,GACf;AAAA,OACF;AAAA,KACF,GACF;AAEJ;;;AClFI,mBACE,OAAAA,MADF,QAAAC,aAAA;AAFG,IAAM,eAAwD,CAAC,EAAE,SAAS,MAAM;AACrF,SACE,gBAAAA,MAAA,YACE;AAAA,oBAAAD,KAAC,2BAAwB;AAAA,IACzB,gBAAAA,KAAC,mBAAgB;AAAA,IAChB;AAAA,KACH;AAEJ;","names":["jsx","jsxs"]}
1
+ {"version":3,"sources":["../src/providers/CoreProvider/DestructiveActionDialog.tsx","../src/providers/CoreProvider/CoreProvider.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { Button } from '@/components/Button';\nimport { Dialog } from '@/components/Dialog';\nimport { useDestructiveActionStore } from '@/hooks/useDestructiveAction/useDestructiveActionStore';\nimport type { DestructiveActionDef } from '@/hooks/useDestructiveAction/useDestructiveActionStore';\nimport { useTranslation } from '@/hooks/useTranslation';\n\nexport const DestructiveActionDialog = () => {\n const deletePendingDestructiveAction = useDestructiveActionStore((store) => store.deletePendingDestructiveAction);\n const pendingDestructiveActions = useDestructiveActionStore((store) => store.pendingDestructiveActions);\n const { resolvedLanguage, t } = useTranslation();\n\n const current = useMemo<DestructiveActionDef | null>(() => {\n if (pendingDestructiveActions[0]) {\n return pendingDestructiveActions[0];\n }\n return null;\n }, [pendingDestructiveActions]);\n\n const getDisplay = useCallback(\n (def: DestructiveActionDef | null) => {\n const defaultDescription = t({\n en: 'This action cannot be reversed. Please confirm that you would like to continue.',\n fr: 'Cette action ne peut être inversée. Veuillez confirmer que vous souhaitez poursuivre.'\n });\n const defaultTitle = t({\n en: 'Confirm Action',\n fr: \"Confirmer l'action\"\n });\n return {\n description: def?.description ?? defaultDescription,\n title: def?.title ?? defaultTitle\n };\n },\n [resolvedLanguage]\n );\n\n const [display, setDisplay] = useState<{ description: string; title: string }>(getDisplay(current));\n\n useEffect(() => {\n if (current) {\n setDisplay(getDisplay(current));\n }\n }, [current]);\n\n const handleConfirm = async () => {\n if (!current) {\n return;\n }\n try {\n await current.action();\n } finally {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n const handleCancel = () => {\n if (current) {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n const handleOpenChange = (isOpen: boolean) => {\n if (!isOpen && current) {\n deletePendingDestructiveAction(current.id);\n }\n };\n\n return (\n <Dialog open={current !== null} onOpenChange={handleOpenChange}>\n <Dialog.Content data-testid=\"destructive-action-dialog\" onOpenAutoFocus={(event) => event.preventDefault()}>\n <Dialog.Header>\n <Dialog.Title>{display.title}</Dialog.Title>\n <Dialog.Description>{display.description}</Dialog.Description>\n </Dialog.Header>\n <Dialog.Footer>\n <Button className=\"min-w-16\" type=\"button\" variant=\"danger\" onClick={() => void handleConfirm()}>\n {t('libui.yes')}\n </Button>\n <Button className=\"min-w-16\" type=\"button\" variant=\"primary\" onClick={handleCancel}>\n {t('libui.no')}\n </Button>\n </Dialog.Footer>\n </Dialog.Content>\n </Dialog>\n );\n};\n","import { DestructiveActionDialog } from './DestructiveActionDialog';\nimport { NotificationHub } from './NotificationHub';\n\nexport const CoreProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n return (\n <>\n <DestructiveActionDialog />\n <NotificationHub />\n {children}\n </>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAwElD,SACE,KADF;AAhED,IAAM,0BAA0B,MAAM;AAC3C,QAAM,iCAAiC,0BAA0B,CAAC,UAAU,MAAM,8BAA8B;AAChH,QAAM,4BAA4B,0BAA0B,CAAC,UAAU,MAAM,yBAAyB;AACtG,QAAM,EAAE,kBAAkB,EAAE,IAAI,eAAe;AAE/C,QAAM,UAAU,QAAqC,MAAM;AACzD,QAAI,0BAA0B,CAAC,GAAG;AAChC,aAAO,0BAA0B,CAAC;AAAA,IACpC;AACA,WAAO;AAAA,EACT,GAAG,CAAC,yBAAyB,CAAC;AAE9B,QAAM,aAAa;AAAA,IACjB,CAAC,QAAqC;AACpC,YAAM,qBAAqB,EAAE;AAAA,QAC3B,IAAI;AAAA,QACJ,IAAI;AAAA,MACN,CAAC;AACD,YAAM,eAAe,EAAE;AAAA,QACrB,IAAI;AAAA,QACJ,IAAI;AAAA,MACN,CAAC;AACD,aAAO;AAAA,QACL,aAAa,KAAK,eAAe;AAAA,QACjC,OAAO,KAAK,SAAS;AAAA,MACvB;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiD,WAAW,OAAO,CAAC;AAElG,YAAU,MAAM;AACd,QAAI,SAAS;AACX,iBAAW,WAAW,OAAO,CAAC;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,gBAAgB,YAAY;AAChC,QAAI,CAAC,SAAS;AACZ;AAAA,IACF;AACA,QAAI;AACF,YAAM,QAAQ,OAAO;AAAA,IACvB,UAAE;AACA,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,QAAM,eAAe,MAAM;AACzB,QAAI,SAAS;AACX,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,QAAI,CAAC,UAAU,SAAS;AACtB,qCAA+B,QAAQ,EAAE;AAAA,IAC3C;AAAA,EACF;AAEA,SACE,oBAAC,UAAO,MAAM,YAAY,MAAM,cAAc,kBAC5C,+BAAC,OAAO,SAAP,EAAe,eAAY,6BAA4B,iBAAiB,CAAC,UAAU,MAAM,eAAe,GACvG;AAAA,yBAAC,OAAO,QAAP,EACC;AAAA,0BAAC,OAAO,OAAP,EAAc,kBAAQ,OAAM;AAAA,MAC7B,oBAAC,OAAO,aAAP,EAAoB,kBAAQ,aAAY;AAAA,OAC3C;AAAA,IACA,qBAAC,OAAO,QAAP,EACC;AAAA,0BAAC,UAAO,WAAU,YAAW,MAAK,UAAS,SAAQ,UAAS,SAAS,MAAM,KAAK,cAAc,GAC3F,YAAE,WAAW,GAChB;AAAA,MACA,oBAAC,UAAO,WAAU,YAAW,MAAK,UAAS,SAAQ,WAAU,SAAS,cACnE,YAAE,UAAU,GACf;AAAA,OACF;AAAA,KACF,GACF;AAEJ;;;AClFI,mBACE,OAAAA,MADF,QAAAC,aAAA;AAFG,IAAM,eAAwD,CAAC,EAAE,SAAS,MAAM;AACrF,SACE,gBAAAA,MAAA,YACE;AAAA,oBAAAD,KAAC,2BAAwB;AAAA,IACzB,gBAAAA,KAAC,mBAAgB;AAAA,IAChB;AAAA,KACH;AAEJ;","names":["jsx","jsxs"]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@douglasneuroinformatics/libui",
3
3
  "type": "module",
4
- "version": "4.9.0",
4
+ "version": "4.9.1",
5
5
  "packageManager": "pnpm@10.7.1",
6
6
  "description": "Generic UI components for DNP projects, built using React and Tailwind CSS",
7
7
  "author": "Joshua Unrau",
package/src/components/Form/BooleanField/BooleanFieldRadio.tsx CHANGED
@@ -49,31 +49,25 @@ export const BooleanFieldRadio = ({
49
49
 
50
50
  return (
51
51
  <FieldGroup name={name}>
52
- <Label>{label}</Label>
52
+ <FieldGroup.Row>
53
+ <Label>{label}</Label>
54
+ <FieldGroup.Description description={description} />
55
+ </FieldGroup.Row>
53
56
  <RadioGroup
54
57
  disabled={disabled || readOnly}
55
58
  name={name}
56
59
  value={stringifyBoolean(value)}
57
60
  onValueChange={handleValueChange}
58
61
  >
59
- <FieldGroup.Description description={description} />
60
62
  <FieldGroup.Row>
61
63
  <RadioGroup.Item id={`${name}-true`} value="true" />
62
- <Label
63
- aria-disabled={disabled || readOnly}
64
- className="text-muted-foreground font-normal"
65
- htmlFor={`${name}-true`}
66
- >
64
+ <Label aria-disabled={disabled || readOnly} className="text-muted-foreground" htmlFor={`${name}-true`}>
67
65
  {options?.true ?? t('form.radioLabels.true')}
68
66
  </Label>
69
67
  </FieldGroup.Row>
70
68
  <FieldGroup.Row>
71
69
  <RadioGroup.Item id={`${name}-false`} value="false" />
72
- <Label
73
- aria-disabled={disabled || readOnly}
74
- className="text-muted-foreground font-normal"
75
- htmlFor={`${name}-false`}
76
- >
70
+ <Label aria-disabled={disabled || readOnly} className="text-muted-foreground" htmlFor={`${name}-false`}>
77
71
  {options?.false ?? t('form.radioLabels.false')}
78
72
  </Label>
79
73
  </FieldGroup.Row>
package/src/components/Form/Form.stories.tsx CHANGED
@@ -59,12 +59,14 @@ type SimpleExampleFormSchemaType = typeof $SimpleExampleFormData;
59
59
 
60
60
  const booleanFields: FormFields<Pick<ExampleFormData, 'booleanCheck' | 'booleanRadio'>> = {
61
61
  booleanRadio: {
62
+ description: 'This is a boolean radio field',
62
63
  disabled: DISABLED,
63
64
  kind: 'boolean',
64
65
  label: 'Radio',
65
66
  variant: 'radio'
66
67
  },
67
68
  booleanCheck: {
69
+ description: 'This is a boolean check field',
68
70
  disabled: DISABLED,
69
71
  kind: 'boolean',
70
72
  label: 'Checkbox',
package/src/providers/CoreProvider/DestructiveActionDialog.tsx CHANGED
@@ -69,7 +69,7 @@ export const DestructiveActionDialog = () => {
69
69
 
70
70
  return (
71
71
  <Dialog open={current !== null} onOpenChange={handleOpenChange}>
72
- <Dialog.Content onOpenAutoFocus={(event) => event.preventDefault()}>
72
+ <Dialog.Content data-testid="destructive-action-dialog" onOpenAutoFocus={(event) => event.preventDefault()}>
73
73
  <Dialog.Header>
74
74
  <Dialog.Title>{display.title}</Dialog.Title>
75
75
  <Dialog.Description>{display.description}</Dialog.Description>