@verbb/plugin-kit-react 1.0.6 → 1.0.8

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 (55) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/dist/components/Command.d.ts +5 -5
  3. package/dist/components/Command.d.ts.map +1 -1
  4. package/dist/components/DatePicker.d.ts.map +1 -1
  5. package/dist/components/DatePicker.js +17 -3
  6. package/dist/components/DatePicker.js.map +1 -1
  7. package/dist/components/Popover.d.ts.map +1 -1
  8. package/dist/components/Popover.js +2 -1
  9. package/dist/components/Popover.js.map +1 -1
  10. package/dist/components/Select.d.ts +1 -1
  11. package/dist/components/Select.d.ts.map +1 -1
  12. package/dist/components/Select.js +3 -1
  13. package/dist/components/Select.js.map +1 -1
  14. package/dist/components/TimePicker.d.ts.map +1 -1
  15. package/dist/components/TimePicker.js +1 -0
  16. package/dist/components/TimePicker.js.map +1 -1
  17. package/dist/forms/Field.d.ts +2 -1
  18. package/dist/forms/Field.d.ts.map +1 -1
  19. package/dist/forms/Field.js +24 -12
  20. package/dist/forms/Field.js.map +1 -1
  21. package/dist/forms/TranslationIcon.d.ts +5 -0
  22. package/dist/forms/TranslationIcon.d.ts.map +1 -0
  23. package/dist/forms/TranslationIcon.js +18 -0
  24. package/dist/forms/TranslationIcon.js.map +1 -0
  25. package/dist/forms/fields/DateTimeField.d.ts.map +1 -1
  26. package/dist/forms/fields/DateTimeField.js +13 -22
  27. package/dist/forms/fields/DateTimeField.js.map +1 -1
  28. package/dist/forms/fields/ListField.d.ts +1 -0
  29. package/dist/forms/fields/ListField.d.ts.map +1 -1
  30. package/dist/forms/fields/ListField.js +1 -0
  31. package/dist/forms/fields/ListField.js.map +1 -1
  32. package/dist/forms/fields/RichTextField.d.ts +1 -0
  33. package/dist/forms/fields/RichTextField.d.ts.map +1 -1
  34. package/dist/forms/fields/RichTextField.js +1 -0
  35. package/dist/forms/fields/RichTextField.js.map +1 -1
  36. package/dist/forms/fields/SelectField.d.ts.map +1 -1
  37. package/dist/forms/fields/SelectField.js +2 -1
  38. package/dist/forms/fields/SelectField.js.map +1 -1
  39. package/dist/forms/fields/TextField.d.ts +1 -0
  40. package/dist/forms/fields/TextField.d.ts.map +1 -1
  41. package/dist/forms/fields/TextField.js +1 -0
  42. package/dist/forms/fields/TextField.js.map +1 -1
  43. package/dist/forms/fields/TextareaField.d.ts +1 -0
  44. package/dist/forms/fields/TextareaField.d.ts.map +1 -1
  45. package/dist/forms/fields/TextareaField.js +1 -0
  46. package/dist/forms/fields/TextareaField.js.map +1 -1
  47. package/dist/utils/datetime.d.ts +10 -0
  48. package/dist/utils/datetime.d.ts.map +1 -0
  49. package/dist/utils/datetime.js +60 -0
  50. package/dist/utils/datetime.js.map +1 -0
  51. package/dist/utils/index.d.ts +1 -0
  52. package/dist/utils/index.d.ts.map +1 -1
  53. package/dist/utils/index.js +7 -1
  54. package/dist/utils/index.js.map +1 -1
  55. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -2,6 +2,36 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
+ ## 1.0.8 - 2026-06-23
6
+
7
+ ### Added
8
+ - Added a translation icon to `FieldLayout` for schema fields marked `translatable`.
9
+ - Added `TranslationIcon` for host apps that need the same translatable-field affordance outside `FieldLayout`.
10
+ - Added `translatable` support to `TextField`, `TextareaField`, and `RichTextField`.
11
+ - Added `className` support to `ListField`.
12
+
13
+ ### Fixed
14
+ - Fixed `SelectField` ignoring the schema `disabled` property and leaving the select interactive when it should be read-only.
15
+
16
+ ## 1.0.7 - 2026-06-18
17
+
18
+ ### Added
19
+ - Added datetime helpers (`parseDateTimeValue`, `parseLocalDate`, `formatDateTimeValue`, `resolveCalendarMonth`, and `startOfMonth`) for wall-clock `Y-m-d H:i:s` values without timezone conversion.
20
+ - Exported the datetime helpers from `@verbb/plugin-kit-react/utils`.
21
+
22
+ ### Changed
23
+ - Changed `DatePicker` to parse values with `parseLocalDate`, keep the visible calendar month in sync with the selected date, and reopen on that month when the popover opens.
24
+ - Changed `DateTimeField` to read and write Craft-style wall-clock datetime strings through the form engine instead of maintaining mirrored local state or emitting ISO UTC values.
25
+ - Changed `PopoverContent` and `SelectContent` to default to `positionMethod="fixed"` when portaling into a Shadow DOM container.
26
+ - Changed `SelectContent` to accept an optional `positionMethod` prop.
27
+ - Changed `TimePicker` to use `alignItemWithTrigger={false}` so its dropdown stays aligned in scrollable embedded CP panes.
28
+
29
+ ### Fixed
30
+ - Fixed `DatePicker` opening on the current month instead of the selected date’s month.
31
+ - Fixed `DateTimeField` shifting dates and times when values were formatted with `toISOString()`.
32
+ - Fixed `DateTimeField` causing a React maximum update depth error while saving forms.
33
+ - Fixed `TimePicker` and other select popovers rendering with a large positional offset inside Shadow DOM apps such as the Formie form builder.
34
+
5
35
  ## 1.0.6 - 2026-06-14
6
36
 
7
37
  ### Added
@@ -9,14 +9,14 @@ declare function CommandDialog({ title, description, children, showCloseButton,
9
9
  }): import("react/jsx-runtime").JSX.Element;
10
10
  declare function CommandInput({ className, ...props }: ComponentProps<typeof CommandPrimitive.Input>): import("react/jsx-runtime").JSX.Element;
11
11
  declare const CommandList: React.ForwardRefExoticComponent<Omit<{
12
- children?: React.ReactNode;
13
- } & Pick<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & {
14
- ref?: React.Ref<HTMLDivElement>;
12
+ children?: import('react').ReactNode;
13
+ } & Pick<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
14
+ ref?: import('react').Ref<HTMLDivElement>;
15
15
  } & {
16
16
  asChild?: boolean;
17
- }, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "asChild"> & {
17
+ }, "key" | "asChild" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
18
18
  label?: string;
19
- } & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
19
+ } & import('react').RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
20
20
  declare function CommandEmpty({ ...props }: ComponentProps<typeof CommandPrimitive.Empty>): import("react/jsx-runtime").JSX.Element;
21
21
  declare function CommandGroup({ className, ...props }: ComponentProps<typeof CommandPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
22
22
  declare function CommandSeparator({ className, ...props }: ComponentProps<typeof CommandPrimitive.Separator>): import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"Command.d.ts","sourceRoot":"","sources":["../../src/components/Command.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAkB,MAAM,OAAO,CAAC;AAG9D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,eAAe,EAAE,MAAM,MAAM,CAAC;AAEpE,OAAO,EACH,MAAM,EACT,MAAM,oCAAoC,CAAC;AAI5C,iBAAS,OAAO,CAAC,EACb,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,2CAkBzC;AAED,iBAAS,aAAa,CAAC,EACnB,KAAyB,EACzB,WAA8C,EAC9C,QAAQ,EACR,eAAsB,EACtB,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,OAAO,CAAA;CAC5B,2CAyBA;AAED,iBAAS,YAAY,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CAyB/C;AAED,QAAA,MAAM,WAAW;;;;;;;;sFAoBf,CAAC;AAEH,iBAAS,YAAY,CAAC,EAClB,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CAc/C;AAED,iBAAS,YAAY,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CA4B/C;AAED,iBAAS,gBAAgB,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,SAAS,CAAC,2CAmBnD;AAED,iBAAS,WAAW,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,2CAmB9C;AAED,iBAAS,eAAe,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,MAAM,CAAC,2CAexB;AAED,OAAO,EACH,OAAO,EACP,aAAa,EACb,eAAe,EACf,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACnB,CAAC"}
1
+ {"version":3,"file":"Command.d.ts","sourceRoot":"","sources":["../../src/components/Command.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAkB,MAAM,OAAO,CAAC;AAG9D,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,eAAe,EAAE,MAAM,MAAM,CAAC;AAEpE,OAAO,EACH,MAAM,EACT,MAAM,oCAAoC,CAAC;AAI5C,iBAAS,OAAO,CAAC,EACb,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,2CAkBzC;AAED,iBAAS,aAAa,CAAC,EACnB,KAAyB,EACzB,WAA8C,EAC9C,QAAQ,EACR,eAAsB,EACtB,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,eAAe,CAAC,EAAE,OAAO,CAAA;CAC5B,2CAyBA;AAED,iBAAS,YAAY,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CAyB/C;AAED,QAAA,MAAM,WAAW;;;;;;;;gGAoBf,CAAC;AAEH,iBAAS,YAAY,CAAC,EAClB,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CAc/C;AAED,iBAAS,YAAY,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,2CA4B/C;AAED,iBAAS,gBAAgB,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,SAAS,CAAC,2CAmBnD;AAED,iBAAS,WAAW,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,2CAmB9C;AAED,iBAAS,eAAe,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,MAAM,CAAC,2CAexB;AAED,OAAO,EACH,OAAO,EACP,aAAa,EACb,eAAe,EACf,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,eAAe,EACf,gBAAgB,GACnB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/components/DatePicker.tsx"],"names":[],"mappings":"AAeA,wBAAgB,UAAU,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,SAAiB,EACjB,GAAG,KAAK,EACX,EAAE;IACC,KAAK,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,2CA8DA"}
1
+ {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/components/DatePicker.tsx"],"names":[],"mappings":"AAoBA,wBAAgB,UAAU,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,SAAiB,EACjB,GAAG,KAAK,EACX,EAAE;IACC,KAAK,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,2CA6EA"}
@@ -1,25 +1,37 @@
1
1
  import { cn } from "../utils/classes.js";
2
2
  import { hostFormatDate } from "../utils/hostBridge.js";
3
+ import { parseLocalDate, resolveCalendarMonth } from "../utils/datetime.js";
3
4
  import "../utils/index.js";
4
5
  import { Calendar } from "./Calendar.js";
5
6
  import { Popover, PopoverContent, PopoverTrigger } from "./Popover.js";
6
7
  import "./index.js";
7
8
  import { Button } from "./Button.js";
8
- import { useState } from "react";
9
+ import { useEffect, useMemo, useState } from "react";
9
10
  import { jsx, jsxs } from "react/jsx-runtime";
10
11
  import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
11
12
  import { faCalendar } from "@fortawesome/pro-solid-svg-icons";
12
13
  //#region src/components/DatePicker.tsx
14
+ var toDate = (value) => {
15
+ return parseLocalDate(value);
16
+ };
13
17
  function DatePicker({ value, onValueChange, placeholder = "", className, disabled = false, isInvalid = false, ...props }) {
14
18
  const [open, setOpen] = useState(false);
15
- const date = value ? new Date(value) : void 0;
19
+ const date = useMemo(() => toDate(value), [value]);
20
+ const [month, setMonth] = useState(() => resolveCalendarMonth(date));
21
+ useEffect(() => {
22
+ if (date) setMonth(resolveCalendarMonth(date));
23
+ }, [date]);
24
+ const handleOpenChange = (nextOpen) => {
25
+ if (nextOpen) setMonth(resolveCalendarMonth(date));
26
+ setOpen(nextOpen);
27
+ };
16
28
  const handleSelect = (selectedDate) => {
17
29
  onValueChange?.(selectedDate);
18
30
  setOpen(false);
19
31
  };
20
32
  return /* @__PURE__ */ jsxs(Popover, {
21
33
  open,
22
- onOpenChange: setOpen,
34
+ onOpenChange: handleOpenChange,
23
35
  children: [/* @__PURE__ */ jsx(PopoverTrigger, { render: /* @__PURE__ */ jsxs(Button, {
24
36
  variant: "outline",
25
37
  className: cn("min-h-[2.125rem] h-[2.125rem]", "w-[130px] px-[10px] !py-0", "!cursor-default", "justify-start text-left font-normal", "bg-transparent border border-slate-400", "hover:bg-slate-50!", "active:bg-slate-150!", "data-[popup-open]:bg-slate-150!", "[&>svg]:size-[14px]", isInvalid && ["border-rose-600!", "focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!"], className),
@@ -34,6 +46,8 @@ function DatePicker({ value, onValueChange, placeholder = "", className, disable
34
46
  children: /* @__PURE__ */ jsx(Calendar, {
35
47
  mode: "single",
36
48
  selected: date,
49
+ month,
50
+ onMonthChange: setMonth,
37
51
  captionLayout: "dropdown",
38
52
  onSelect: handleSelect
39
53
  })
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.js","names":[],"sources":["../../src/components/DatePicker.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCalendar } from '@fortawesome/pro-solid-svg-icons';\n\nimport {\n Button,\n Calendar,\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from '@verbb/plugin-kit-react/components';\n\nimport { cn, hostFormatDate } from '@verbb/plugin-kit-react/utils';\n\nexport function DatePicker({\n value,\n onValueChange,\n placeholder = '',\n className,\n disabled = false,\n isInvalid = false,\n ...props\n}: {\n value: Date | string | null;\n onValueChange?: (value: Date | undefined) => void;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n isInvalid?: boolean;\n}) {\n const [open, setOpen] = useState(false);\n\n // Convert ISO date string to Date object for Calendar\n const date = value ? new Date(value) : undefined;\n\n const handleSelect = (selectedDate?: Date) => {\n onValueChange?.(selectedDate);\n setOpen(false);\n };\n\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger\n render={\n <Button\n variant=\"outline\"\n className={cn(\n 'min-h-[2.125rem] h-[2.125rem]',\n 'w-[130px] px-[10px] !py-0',\n '!cursor-default',\n 'justify-start text-left font-normal',\n 'bg-transparent border border-slate-400',\n 'hover:bg-slate-50!',\n 'active:bg-slate-150!',\n 'data-[popup-open]:bg-slate-150!',\n '[&>svg]:size-[14px]',\n\n isInvalid && [\n 'border-rose-600!',\n 'focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!',\n ],\n className,\n )}\n disabled={disabled}\n {...props}\n >\n <FontAwesomeIcon\n icon={faCalendar}\n className={cn(\n 'mr-1 text-gray-400',\n )}\n />\n {date ? hostFormatDate(date) : placeholder}\n </Button>\n } />\n\n <PopoverContent\n className={cn(\n // Popover width and padding\n 'w-auto p-0!',\n )}\n >\n <Calendar\n mode=\"single\"\n selected={date}\n captionLayout=\"dropdown\"\n onSelect={handleSelect}\n />\n </PopoverContent>\n </Popover >\n );\n}\n"],"mappings":";;;;;;;;;;;;AAeA,SAAgB,WAAW,EACvB,OACA,eACA,cAAc,IACd,WACA,WAAW,OACX,YAAY,OACZ,GAAG,SAQJ;CACC,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CAGvC,MAAM,OAAO,QAAQ,IAAI,KAAK,MAAM,GAAG,KAAA;CAEvC,MAAM,gBAAgB,iBAAwB;AAC1C,kBAAgB,aAAa;AAC7B,UAAQ,MAAM;;AAGlB,QACI,qBAAC,SAAD;EAAe;EAAM,cAAc;YAAnC,CACI,oBAAC,gBAAD,EACI,QACI,qBAAC,QAAD;GACI,SAAQ;GACR,WAAW,GACP,iCACA,6BACA,mBACA,uCACA,0CACA,sBACA,wBACA,mCACA,uBAEA,aAAa,CACT,oBACA,8GACH,EACD,UACH;GACS;GACV,GAAI;aApBR,CAsBI,oBAAC,iBAAD;IACI,MAAM;IACN,WAAW,GACP,qBACH;IACH,CAAA,EACD,OAAO,eAAe,KAAK,GAAG,YAC1B;MACT,CAAA,EAER,oBAAC,gBAAD;GACI,WAAW,GAEP,cACH;aAED,oBAAC,UAAD;IACI,MAAK;IACL,UAAU;IACV,eAAc;IACd,UAAU;IACZ,CAAA;GACW,CAAA,CACV"}
1
+ {"version":3,"file":"DatePicker.js","names":[],"sources":["../../src/components/DatePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCalendar } from '@fortawesome/pro-solid-svg-icons';\n\nimport {\n Button,\n Calendar,\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from '@verbb/plugin-kit-react/components';\n\nimport { cn, hostFormatDate } from '@verbb/plugin-kit-react/utils';\nimport { parseLocalDate, resolveCalendarMonth } from '@verbb/plugin-kit-react/utils/datetime';\n\nconst toDate = (value: Date | string | null | undefined): Date | undefined => {\n return parseLocalDate(value);\n};\n\nexport function DatePicker({\n value,\n onValueChange,\n placeholder = '',\n className,\n disabled = false,\n isInvalid = false,\n ...props\n}: {\n value: Date | string | null;\n onValueChange?: (value: Date | undefined) => void;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n isInvalid?: boolean;\n}) {\n const [open, setOpen] = useState(false);\n const date = useMemo(() => toDate(value), [value]);\n const [month, setMonth] = useState(() => resolveCalendarMonth(date));\n\n useEffect(() => {\n if (date) {\n setMonth(resolveCalendarMonth(date));\n }\n }, [date]);\n\n const handleOpenChange = (nextOpen: boolean) => {\n if (nextOpen) {\n setMonth(resolveCalendarMonth(date));\n }\n\n setOpen(nextOpen);\n };\n\n const handleSelect = (selectedDate?: Date) => {\n onValueChange?.(selectedDate);\n setOpen(false);\n };\n\n return (\n <Popover open={open} onOpenChange={handleOpenChange}>\n <PopoverTrigger\n render={\n <Button\n variant=\"outline\"\n className={cn(\n 'min-h-[2.125rem] h-[2.125rem]',\n 'w-[130px] px-[10px] !py-0',\n '!cursor-default',\n 'justify-start text-left font-normal',\n 'bg-transparent border border-slate-400',\n 'hover:bg-slate-50!',\n 'active:bg-slate-150!',\n 'data-[popup-open]:bg-slate-150!',\n '[&>svg]:size-[14px]',\n\n isInvalid && [\n 'border-rose-600!',\n 'focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!',\n ],\n className,\n )}\n disabled={disabled}\n {...props}\n >\n <FontAwesomeIcon\n icon={faCalendar}\n className={cn(\n 'mr-1 text-gray-400',\n )}\n />\n {date ? hostFormatDate(date) : placeholder}\n </Button>\n } />\n\n <PopoverContent\n className={cn(\n // Popover width and padding\n 'w-auto p-0!',\n )}\n >\n <Calendar\n mode=\"single\"\n selected={date}\n month={month}\n onMonthChange={setMonth}\n captionLayout=\"dropdown\"\n onSelect={handleSelect}\n />\n </PopoverContent>\n </Popover >\n );\n}\n"],"mappings":";;;;;;;;;;;;;AAgBA,IAAM,UAAU,UAA8D;AAC1E,QAAO,eAAe,MAAM;;AAGhC,SAAgB,WAAW,EACvB,OACA,eACA,cAAc,IACd,WACA,WAAW,OACX,YAAY,OACZ,GAAG,SAQJ;CACC,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CACvC,MAAM,OAAO,cAAc,OAAO,MAAM,EAAE,CAAC,MAAM,CAAC;CAClD,MAAM,CAAC,OAAO,YAAY,eAAe,qBAAqB,KAAK,CAAC;AAEpE,iBAAgB;AACZ,MAAI,KACA,UAAS,qBAAqB,KAAK,CAAC;IAEzC,CAAC,KAAK,CAAC;CAEV,MAAM,oBAAoB,aAAsB;AAC5C,MAAI,SACA,UAAS,qBAAqB,KAAK,CAAC;AAGxC,UAAQ,SAAS;;CAGrB,MAAM,gBAAgB,iBAAwB;AAC1C,kBAAgB,aAAa;AAC7B,UAAQ,MAAM;;AAGlB,QACI,qBAAC,SAAD;EAAe;EAAM,cAAc;YAAnC,CACI,oBAAC,gBAAD,EACI,QACI,qBAAC,QAAD;GACI,SAAQ;GACR,WAAW,GACP,iCACA,6BACA,mBACA,uCACA,0CACA,sBACA,wBACA,mCACA,uBAEA,aAAa,CACT,oBACA,8GACH,EACD,UACH;GACS;GACV,GAAI;aApBR,CAsBI,oBAAC,iBAAD;IACI,MAAM;IACN,WAAW,GACP,qBACH;IACH,CAAA,EACD,OAAO,eAAe,KAAK,GAAG,YAC1B;MACT,CAAA,EAER,oBAAC,gBAAD;GACI,WAAW,GAEP,cACH;aAED,oBAAC,UAAD;IACI,MAAK;IACL,UAAU;IACH;IACP,eAAe;IACf,eAAc;IACd,UAAU;IACZ,CAAA;GACW,CAAA,CACV"}
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/components/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAIrE,iBAAS,OAAO,CAAC,EAAE,SAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,2CAEhF;AAED,iBAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,OAAO,CAAC,KAAK,2CAEnE;AAED,iBAAS,cAAc,CAAC,EACpB,SAAS,EACT,KAAgB,EAChB,WAAe,EACf,IAAe,EACf,UAAc,EACd,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAC3B,IAAI,CACA,gBAAgB,CAAC,UAAU,CAAC,KAAK,EAC/B,OAAO,GACP,aAAa,GACb,MAAM,GACN,YAAY,GACZ,gBAAgB,GAChB,mBAAmB,GACnB,kBAAkB,GAClB,QAAQ,GACR,oBAAoB,CACzB,GAAG;IACA,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,IAAI,CAAA;CACpD,2CAoDJ;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAY1E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,2CAY1E;AAED,iBAAS,kBAAkB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,WAAW,CAAC,KAAK,2CAYpC;AAGD,OAAO,EACH,OAAO,EACP,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,cAAc,GACjB,CAAC"}
1
+ {"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/components/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAIrE,iBAAS,OAAO,CAAC,EAAE,SAAqB,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,2CAEhF;AAED,iBAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,OAAO,CAAC,KAAK,2CAEnE;AAED,iBAAS,cAAc,CAAC,EACpB,SAAS,EACT,KAAgB,EAChB,WAAe,EACf,IAAe,EACf,UAAc,EACd,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,MAAM,EACN,kBAAkB,EAClB,eAAe,EACf,eAAe,EACf,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,GAC3B,IAAI,CACA,gBAAgB,CAAC,UAAU,CAAC,KAAK,EAC/B,OAAO,GACP,aAAa,GACb,MAAM,GACN,YAAY,GACZ,gBAAgB,GAChB,mBAAmB,GACnB,kBAAkB,GAClB,QAAQ,GACR,oBAAoB,CACzB,GAAG;IACA,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,eAAe,CAAC,EAAE,WAAW,GAAG,UAAU,GAAG,IAAI,CAAA;CACpD,2CAuDJ;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAY1E;AAED,iBAAS,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,CAAC,KAAK,CAAC,KAAK,2CAY1E;AAED,iBAAS,kBAAkB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,gBAAgB,CAAC,WAAW,CAAC,KAAK,2CAYpC;AAGD,OAAO,EACH,OAAO,EACP,cAAc,EACd,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,cAAc,GACjB,CAAC"}
@@ -20,6 +20,7 @@ function PopoverTrigger({ ...props }) {
20
20
  function PopoverContent({ className, align = "center", alignOffset = 0, side = "bottom", sideOffset = 4, positionMethod, collisionBoundary, collisionPadding, sticky, collisionAvoidance, portalClassName, portalContainer, ...props }) {
21
21
  const resolvedPortalClassName = getPortalClassName(portalClassName);
22
22
  const resolvedPortalContainer = getPortalContainer(portalContainer);
23
+ const resolvedPositionMethod = positionMethod ?? (resolvedPortalContainer instanceof ShadowRoot ? "fixed" : void 0);
23
24
  return /* @__PURE__ */ jsx(Popover$1.Portal, {
24
25
  "data-slot": "popover-portal",
25
26
  className: resolvedPortalClassName,
@@ -29,7 +30,7 @@ function PopoverContent({ className, align = "center", alignOffset = 0, side = "
29
30
  alignOffset,
30
31
  side,
31
32
  sideOffset,
32
- positionMethod,
33
+ positionMethod: resolvedPositionMethod,
33
34
  collisionBoundary,
34
35
  collisionPadding,
35
36
  sticky,
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.js","names":[],"sources":["../../src/components/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nfunction Popover({ ariaLabel = 'Popover', ...props }: PopoverPrimitive.Root.Props) {\n return <PopoverPrimitive.Root data-slot=\"popover\" ariaLabel={ariaLabel} {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: PopoverPrimitive.Trigger.Props) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n className,\n align = 'center',\n alignOffset = 0,\n side = 'bottom',\n sideOffset = 4,\n positionMethod,\n collisionBoundary,\n collisionPadding,\n sticky,\n collisionAvoidance,\n portalClassName,\n portalContainer,\n ...props\n}: PopoverPrimitive.Popup.Props &\n Pick<\n PopoverPrimitive.Positioner.Props,\n | 'align'\n | 'alignOffset'\n | 'side'\n | 'sideOffset'\n | 'positionMethod'\n | 'collisionBoundary'\n | 'collisionPadding'\n | 'sticky'\n | 'collisionAvoidance'\n > & {\n portalClassName?: string\n portalContainer?: HTMLElement | ShadowRoot | null\n }) {\n const resolvedPortalClassName = getPortalClassName(portalClassName);\n const resolvedPortalContainer = getPortalContainer(portalContainer);\n\n return (\n <PopoverPrimitive.Portal\n data-slot=\"popover-portal\"\n className={resolvedPortalClassName}\n container={resolvedPortalContainer}\n >\n <PopoverPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n positionMethod={positionMethod}\n collisionBoundary={collisionBoundary}\n collisionPadding={collisionPadding}\n sticky={sticky}\n collisionAvoidance={collisionAvoidance}\n className=\"isolate z-50\"\n >\n <PopoverPrimitive.Popup\n data-slot=\"popover-content\"\n className={cn(\n // Reset and base styles\n 'z-50 w-72 rounded-md outline-hidden will-change-[transform,opacity]',\n\n // Themed styles (backgrounds, colors, shadows, spacing)\n 'bg-white p-4',\n 'shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n 'focus:shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n\n // Animation classes for open/closed states\n 'data-[state=open]:animate-in data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n\n // Animation classes for side-based slide-ins\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n\n // Additional custom classes passed in as props\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Positioner>\n </PopoverPrimitive.Portal>\n );\n}\n\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"popover-header\"\n className={cn(\n 'flex flex-col gap-0.5 text-sm',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction PopoverTitle({ className, ...props }: PopoverPrimitive.Title.Props) {\n return (\n <PopoverPrimitive.Title\n data-slot=\"popover-title\"\n className={cn(\n 'font-medium text-sm',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction PopoverDescription({\n className,\n ...props\n}: PopoverPrimitive.Description.Props) {\n return (\n <PopoverPrimitive.Description\n data-slot=\"popover-description\"\n className={cn(\n 'text-gray-500',\n\n className,\n )}\n {...props}\n />\n );\n}\n\n\nexport {\n Popover,\n PopoverContent,\n PopoverDescription,\n PopoverHeader,\n PopoverTitle,\n PopoverTrigger,\n};\n"],"mappings":";;;;;;AAIA,SAAS,QAAQ,EAAE,YAAY,WAAW,GAAG,SAAsC;AAC/E,QAAO,oBAAC,UAAiB,MAAlB;EAAuB,aAAU;EAAqB;EAAW,GAAI;EAAS,CAAA;;AAGzF,SAAS,eAAe,EAAE,GAAG,SAAyC;AAClE,QAAO,oBAAC,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;EAAS,CAAA;;AAG9E,SAAS,eAAe,EACpB,WACA,QAAQ,UACR,cAAc,GACd,OAAO,UACP,aAAa,GACb,gBACA,mBACA,kBACA,QACA,oBACA,iBACA,iBACA,GAAG,SAgBA;CACH,MAAM,0BAA0B,mBAAmB,gBAAgB;CACnE,MAAM,0BAA0B,mBAAmB,gBAAgB;AAEnE,QACI,oBAAC,UAAiB,QAAlB;EACI,aAAU;EACV,WAAW;EACX,WAAW;YAEX,oBAAC,UAAiB,YAAlB;GACW;GACM;GACP;GACM;GACI;GACG;GACD;GACV;GACY;GACpB,WAAU;aAEV,oBAAC,UAAiB,OAAlB;IACI,aAAU;IACV,WAAW,GAEP,uEAGA,gBACA,yFACA,+FAGA,gEACA,8DACA,gEAGA,0CACA,0CACA,0CACA,0CAGA,UACH;IACD,GAAI;IACN,CAAA;GACwB,CAAA;EACR,CAAA;;AAIlC,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AACzE,QACI,oBAAC,OAAD;EACI,aAAU;EACV,WAAW,GACP,iCAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,aAAa,EAAE,WAAW,GAAG,SAAuC;AACzE,QACI,oBAAC,UAAiB,OAAlB;EACI,aAAU;EACV,WAAW,GACP,uBAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,mBAAmB,EACxB,WACA,GAAG,SACgC;AACnC,QACI,oBAAC,UAAiB,aAAlB;EACI,aAAU;EACV,WAAW,GACP,iBAEA,UACH;EACD,GAAI;EACN,CAAA"}
1
+ {"version":3,"file":"Popover.js","names":[],"sources":["../../src/components/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react/popover';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nfunction Popover({ ariaLabel = 'Popover', ...props }: PopoverPrimitive.Root.Props) {\n return <PopoverPrimitive.Root data-slot=\"popover\" ariaLabel={ariaLabel} {...props} />;\n}\n\nfunction PopoverTrigger({ ...props }: PopoverPrimitive.Trigger.Props) {\n return <PopoverPrimitive.Trigger data-slot=\"popover-trigger\" {...props} />;\n}\n\nfunction PopoverContent({\n className,\n align = 'center',\n alignOffset = 0,\n side = 'bottom',\n sideOffset = 4,\n positionMethod,\n collisionBoundary,\n collisionPadding,\n sticky,\n collisionAvoidance,\n portalClassName,\n portalContainer,\n ...props\n}: PopoverPrimitive.Popup.Props &\n Pick<\n PopoverPrimitive.Positioner.Props,\n | 'align'\n | 'alignOffset'\n | 'side'\n | 'sideOffset'\n | 'positionMethod'\n | 'collisionBoundary'\n | 'collisionPadding'\n | 'sticky'\n | 'collisionAvoidance'\n > & {\n portalClassName?: string\n portalContainer?: HTMLElement | ShadowRoot | null\n }) {\n const resolvedPortalClassName = getPortalClassName(portalClassName);\n const resolvedPortalContainer = getPortalContainer(portalContainer);\n const resolvedPositionMethod = positionMethod ?? (\n resolvedPortalContainer instanceof ShadowRoot ? 'fixed' : undefined\n );\n\n return (\n <PopoverPrimitive.Portal\n data-slot=\"popover-portal\"\n className={resolvedPortalClassName}\n container={resolvedPortalContainer}\n >\n <PopoverPrimitive.Positioner\n align={align}\n alignOffset={alignOffset}\n side={side}\n sideOffset={sideOffset}\n positionMethod={resolvedPositionMethod}\n collisionBoundary={collisionBoundary}\n collisionPadding={collisionPadding}\n sticky={sticky}\n collisionAvoidance={collisionAvoidance}\n className=\"isolate z-50\"\n >\n <PopoverPrimitive.Popup\n data-slot=\"popover-content\"\n className={cn(\n // Reset and base styles\n 'z-50 w-72 rounded-md outline-hidden will-change-[transform,opacity]',\n\n // Themed styles (backgrounds, colors, shadows, spacing)\n 'bg-white p-4',\n 'shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n 'focus:shadow-[0_10px_38px_-10px_hsla(206,22%,7%,.35),0_10px_20px_-15px_hsla(206,22%,7%,.2)]',\n\n // Animation classes for open/closed states\n 'data-[state=open]:animate-in data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n\n // Animation classes for side-based slide-ins\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n\n // Additional custom classes passed in as props\n className,\n )}\n {...props}\n />\n </PopoverPrimitive.Positioner>\n </PopoverPrimitive.Portal>\n );\n}\n\nfunction PopoverHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"popover-header\"\n className={cn(\n 'flex flex-col gap-0.5 text-sm',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction PopoverTitle({ className, ...props }: PopoverPrimitive.Title.Props) {\n return (\n <PopoverPrimitive.Title\n data-slot=\"popover-title\"\n className={cn(\n 'font-medium text-sm',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction PopoverDescription({\n className,\n ...props\n}: PopoverPrimitive.Description.Props) {\n return (\n <PopoverPrimitive.Description\n data-slot=\"popover-description\"\n className={cn(\n 'text-gray-500',\n\n className,\n )}\n {...props}\n />\n );\n}\n\n\nexport {\n Popover,\n PopoverContent,\n PopoverDescription,\n PopoverHeader,\n PopoverTitle,\n PopoverTrigger,\n};\n"],"mappings":";;;;;;AAIA,SAAS,QAAQ,EAAE,YAAY,WAAW,GAAG,SAAsC;AAC/E,QAAO,oBAAC,UAAiB,MAAlB;EAAuB,aAAU;EAAqB;EAAW,GAAI;EAAS,CAAA;;AAGzF,SAAS,eAAe,EAAE,GAAG,SAAyC;AAClE,QAAO,oBAAC,UAAiB,SAAlB;EAA0B,aAAU;EAAkB,GAAI;EAAS,CAAA;;AAG9E,SAAS,eAAe,EACpB,WACA,QAAQ,UACR,cAAc,GACd,OAAO,UACP,aAAa,GACb,gBACA,mBACA,kBACA,QACA,oBACA,iBACA,iBACA,GAAG,SAgBA;CACH,MAAM,0BAA0B,mBAAmB,gBAAgB;CACnE,MAAM,0BAA0B,mBAAmB,gBAAgB;CACnE,MAAM,yBAAyB,mBAC3B,mCAAmC,aAAa,UAAU,KAAA;AAG9D,QACI,oBAAC,UAAiB,QAAlB;EACI,aAAU;EACV,WAAW;EACX,WAAW;YAEX,oBAAC,UAAiB,YAAlB;GACW;GACM;GACP;GACM;GACZ,gBAAgB;GACG;GACD;GACV;GACY;GACpB,WAAU;aAEV,oBAAC,UAAiB,OAAlB;IACI,aAAU;IACV,WAAW,GAEP,uEAGA,gBACA,yFACA,+FAGA,gEACA,8DACA,gEAGA,0CACA,0CACA,0CACA,0CAGA,UACH;IACD,GAAI;IACN,CAAA;GACwB,CAAA;EACR,CAAA;;AAIlC,SAAS,cAAc,EAAE,WAAW,GAAG,SAAsC;AACzE,QACI,oBAAC,OAAD;EACI,aAAU;EACV,WAAW,GACP,iCAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,aAAa,EAAE,WAAW,GAAG,SAAuC;AACzE,QACI,oBAAC,UAAiB,OAAlB;EACI,aAAU;EACV,WAAW,GACP,uBAEA,UACH;EACD,GAAI;EACN,CAAA;;AAIV,SAAS,mBAAmB,EACxB,WACA,GAAG,SACgC;AACnC,QACI,oBAAC,UAAiB,aAAlB;EACI,aAAU;EACV,WAAW,GACP,iBAEA,UACH;EACD,GAAI;EACN,CAAA"}
@@ -13,7 +13,7 @@ declare function SelectValue({ className, ...props }: SelectPrimitive.Value.Prop
13
13
  declare function SelectTrigger({ className, size, children, ...props }: SelectPrimitive.Trigger.Props & {
14
14
  size?: SelectSize;
15
15
  }): import("react/jsx-runtime").JSX.Element;
16
- declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, ...props }: SelectPrimitive.Popup.Props & Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'>): import("react/jsx-runtime").JSX.Element;
16
+ declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, positionMethod, ...props }: SelectPrimitive.Popup.Props & Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger' | 'positionMethod'>): import("react/jsx-runtime").JSX.Element;
17
17
  declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element;
18
18
  declare function SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props): import("react/jsx-runtime").JSX.Element;
19
19
  declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAA6B,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAOlE,QAAA,MAAM,qBAAqB;;8EAazB,CAAC;AAsFH,KAAK,UAAU,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;AAIrE,iBAAS,MAAM,CAAC,EACZ,IAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,UAAU,CAAA;CAAE,2CAQrE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAUxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAaxE;AAED,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,GAAG;IAC/B,IAAI,CAAC,EAAE,UAAU,CAAC;CACrB,2CA0DA;AAGD,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,IAAe,EACf,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,oBAA2B,EAC3B,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,GAC1B,IAAI,CACA,eAAe,CAAC,UAAU,CAAC,KAAK,EAChC,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,sBAAsB,CAC3E,2CAsDJ;AAED,iBAAS,WAAW,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,UAAU,CAAC,KAAK,2CAkBlC;AAED,iBAAS,UAAU,CAAC,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,2CAqD5B;AAED,iBAAS,eAAe,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,SAAS,CAAC,KAAK,2CAmBjC;AAED,iBAAS,oBAAoB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,aAAa,CAAC,2CAsBtD;AAED,iBAAS,sBAAsB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,eAAe,CAAC,2CAsBxD;AAGD,OAAO,EACH,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACd,CAAC"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAA6B,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAOlE,QAAA,MAAM,qBAAqB;;8EAazB,CAAC;AAsFH,KAAK,UAAU,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;AAIrE,iBAAS,MAAM,CAAC,EACZ,IAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,UAAU,CAAA;CAAE,2CAQrE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAUxE;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,2CAaxE;AAED,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,GAAG;IAC/B,IAAI,CAAC,EAAE,UAAU,CAAC;CACrB,2CA0DA;AAGD,iBAAS,aAAa,CAAC,EACnB,SAAS,EACT,QAAQ,EACR,IAAe,EACf,UAAc,EACd,KAAgB,EAChB,WAAe,EACf,oBAA2B,EAC3B,cAAc,EACd,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,GAC1B,IAAI,CACA,eAAe,CAAC,UAAU,CAAC,KAAK,EAChC,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,sBAAsB,GAAG,gBAAgB,CAC9F,2CA0DJ;AAED,iBAAS,WAAW,CAAC,EACjB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,UAAU,CAAC,KAAK,2CAkBlC;AAED,iBAAS,UAAU,CAAC,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,2CAqD5B;AAED,iBAAS,eAAe,CAAC,EACrB,SAAS,EACT,GAAG,KAAK,EACX,EAAE,eAAe,CAAC,SAAS,CAAC,KAAK,2CAmBjC;AAED,iBAAS,oBAAoB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,aAAa,CAAC,2CAsBtD;AAED,iBAAS,sBAAsB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACX,EAAE,cAAc,CAAC,OAAO,eAAe,CAAC,eAAe,CAAC,2CAsBxD;AAGD,OAAO,EACH,MAAM,EACN,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,sBAAsB,EACtB,oBAAoB,EACpB,eAAe,EACf,aAAa,EACb,WAAW,GACd,CAAC"}
@@ -117,9 +117,10 @@ function SelectTrigger({ className, size, children, ...props }) {
117
117
  }) })]
118
118
  });
119
119
  }
120
- function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, ...props }) {
120
+ function SelectContent({ className, children, side = "bottom", sideOffset = 4, align = "center", alignOffset = 0, alignItemWithTrigger = true, positionMethod, ...props }) {
121
121
  const resolvedPortalClassName = getPortalClassName();
122
122
  const resolvedPortalContainer = getPortalContainer();
123
+ const resolvedPositionMethod = positionMethod ?? (resolvedPortalContainer instanceof ShadowRoot ? "fixed" : void 0);
123
124
  return /* @__PURE__ */ jsx(Select$1.Portal, {
124
125
  className: resolvedPortalClassName,
125
126
  container: resolvedPortalContainer,
@@ -129,6 +130,7 @@ function SelectContent({ className, children, side = "bottom", sideOffset = 4, a
129
130
  align,
130
131
  alignOffset,
131
132
  alignItemWithTrigger,
133
+ positionMethod: resolvedPositionMethod,
132
134
  className: "isolate z-50",
133
135
  children: /* @__PURE__ */ jsxs(Select$1.Popup, {
134
136
  "data-slot": "select-content",
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","names":[],"sources":["../../src/components/Select.tsx"],"sourcesContent":["import { ComponentProps, createContext, useContext } from 'react';\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCheck, faChevronDown, faChevronUp } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nconst selectTriggerVariants = cva('', {\n variants: {\n size: {\n xs: 'px-2 py-1 text-[11px] rounded-sm [&_svg:not([class*=\"size-\"])]:size-3',\n sm: 'px-2.5 py-1.5 text-[12px] rounded-md [&_svg:not([class*=\"size-\"])]:size-3',\n default: 'px-[10px] py-[6px] text-[14px] rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n lg: 'px-3 py-2 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n xl: 'px-3.5 py-2.5 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectTriggerIconVariants = cva('', {\n variants: {\n size: {\n xs: 'size-[10px]',\n sm: 'size-[11px]',\n default: 'size-3',\n lg: 'size-3',\n xl: 'size-3.5',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectItemIndicatorVariants = cva('', {\n variants: {\n size: {\n xs: 'right-2 size-3',\n sm: 'right-2.5 size-3',\n default: 'right-2 size-3',\n lg: 'right-3 size-3',\n xl: 'right-3.5 size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\nconst selectItemIndicatorIconVariants = cva('', {\n variants: {\n size: {\n xs: 'size-3',\n sm: 'size-3',\n default: 'size-3',\n lg: 'size-3',\n xl: 'size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectLabelVariants = cva([\n // Theme\n 'text-slate-700',\n], {\n variants: {\n size: {\n xs: 'px-2 pt-1 text-[11px]',\n sm: 'px-2.5 pt-1 text-[12px]',\n default: 'px-2.5 pt-1 text-xs',\n lg: 'px-3 pt-1 text-sm',\n xl: 'px-3.5 pt-1 text-base',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectItemVariants = cva('', {\n variants: {\n size: {\n xs: 'px-2 py-1 pr-7 text-[11px] [&_svg:not([class*=\"size-\"])]:size-3',\n sm: 'px-2.5 py-1.5 pr-7 text-[12px] [&_svg:not([class*=\"size-\"])]:size-3',\n default: 'px-[10px] py-[6px] pr-8 text-[14px] [&_svg:not([class*=\"size-\"])]:size-3',\n lg: 'px-3 py-2 pr-8 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n xl: 'px-3.5 py-2.5 pr-9 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n\n\n },\n variant: {\n default: '',\n destructive: 'text-error',\n },\n },\n defaultVariants: {\n size: 'default',\n variant: 'default',\n },\n});\n\ntype SelectSize = VariantProps<typeof selectTriggerVariants>['size'];\n\nconst SelectContext = createContext<{ size: SelectSize }>({ size: 'default' });\n\nfunction Select({\n size = 'default',\n children,\n ...props\n}: ComponentProps<typeof SelectPrimitive.Root> & { size?: SelectSize }) {\n return (\n <SelectContext.Provider value={{ size }}>\n <SelectPrimitive.Root data-slot=\"select\" data-size={size} {...props}>\n {children}\n </SelectPrimitive.Root>\n </SelectContext.Provider>\n );\n}\n\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n return (\n <SelectPrimitive.Group\n data-slot=\"select-group\"\n className={cn(\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n return (\n <SelectPrimitive.Value\n data-slot=\"select-value\"\n className={cn(\n // Layout\n 'min-w-0 flex-1 basis-0 overflow-hidden text-left truncate',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectTrigger({\n className,\n size,\n children,\n ...props\n}: SelectPrimitive.Trigger.Props & {\n size?: SelectSize;\n}) {\n const context = useContext(SelectContext);\n const finalSize = size || context.size || 'default';\n\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={finalSize}\n className={cn(\n // Reset\n 'flex w-fit items-center justify-between whitespace-nowrap outline-none select-none transition-none',\n\n // Layout\n 'gap-3',\n\n // Theme\n 'bg-slate-250',\n 'border border-transparent',\n\n // Hover\n 'hover:not-disabled:bg-slate-300',\n\n // Value\n '*:data-[slot=select-value]:flex',\n '*:data-[slot=select-value]:items-center',\n '*:data-[slot=select-value]:gap-1.5',\n '*:data-[slot=select-value]:line-clamp-1',\n\n // Focus\n 'focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]',\n 'aria-invalid:border-rose-600! aria-invalid:focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!',\n\n // Disabled\n 'disabled:cursor-not-allowed disabled:opacity-50',\n\n // Icons\n '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n selectTriggerVariants({ size: finalSize }),\n\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon\n render={\n <FontAwesomeIcon\n icon={faChevronDown}\n className={cn(\n 'pointer-events-none',\n selectTriggerIconVariants({ size: finalSize }),\n )}\n />\n }\n />\n </SelectPrimitive.Trigger>\n );\n}\n\n/* eslint-disable no-use-before-define */\nfunction SelectContent({\n className,\n children,\n side = 'bottom',\n sideOffset = 4,\n align = 'center',\n alignOffset = 0,\n alignItemWithTrigger = true,\n ...props\n}: SelectPrimitive.Popup.Props &\n Pick<\n SelectPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'\n >) {\n const resolvedPortalClassName = getPortalClassName();\n const resolvedPortalContainer = getPortalContainer();\n\n return (\n <SelectPrimitive.Portal className={resolvedPortalClassName} container={resolvedPortalContainer}>\n <SelectPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n // Reset\n 'relative isolate z-50 overflow-x-hidden overflow-y-auto',\n\n // Layout\n 'min-w-(--anchor-width)',\n 'max-w-[min(36rem,calc(100vw-2rem))]',\n\n // Theme\n 'rounded-md bg-white',\n 'shadow-[0_0_0_1px_rgba(31,41,51,0.1),0_5px_20px_rgba(31,41,51,0.25)]',\n\n // Animation\n 'duration-100',\n 'data-open:animate-in data-closed:animate-out',\n 'data-open:fade-in-0 data-closed:fade-out-0',\n 'data-open:zoom-in-95 data-closed:zoom-out-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=inline-start]:slide-in-from-right-2',\n 'data-[side=inline-end]:slide-in-from-left-2',\n 'data-[align-trigger=true]:animate-none',\n 'origin-(--transform-origin)',\n\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.List>{children}</SelectPrimitive.List>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPrimitive.Positioner>\n </SelectPrimitive.Portal>\n );\n}\n\nfunction SelectLabel({\n className,\n ...props\n}: SelectPrimitive.GroupLabel.Props) {\n const { size } = useContext(SelectContext);\n\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn(\n // Theme\n 'text-slate-700',\n\n // Size\n selectLabelVariants({ size }),\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectItem({\n className,\n children,\n ...props\n}: SelectPrimitive.Item.Props) {\n const { size } = useContext(SelectContext);\n\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n // Reset\n 'relative flex w-full cursor-default items-center outline-hidden select-none',\n\n // Layout\n 'gap-1.5',\n '*:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',\n\n // Focus\n 'focus:bg-slate-100 data-[highlighted]:bg-slate-100',\n\n // Disabled\n 'data-disabled:pointer-events-none data-disabled:opacity-50',\n\n // Icons\n '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n selectItemVariants({ size }),\n\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText className=\"flex min-w-0 items-center flex-1 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span\n className={cn(\n 'pointer-events-none absolute flex items-center justify-center',\n\n selectItemIndicatorVariants({ size }),\n )}\n >\n <FontAwesomeIcon\n icon={faCheck}\n className={cn(\n 'pointer-events-none',\n selectItemIndicatorIconVariants({ size }),\n )}\n />\n </span>\n }\n />\n </SelectPrimitive.Item>\n );\n}\n\nfunction SelectSeparator({\n className,\n ...props\n}: SelectPrimitive.Separator.Props) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn(\n // Reset\n 'pointer-events-none',\n\n // Layout\n '-mx-1 my-1 h-px',\n\n // Theme\n 'bg-slate-200',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectScrollUpButton({\n className,\n ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n // Layout\n 'top-0 w-full flex items-center justify-center',\n 'cursor-default',\n\n // Theme\n 'bg-white py-1',\n\n // Icons\n \"[&_svg:not([class*='size-'])]:size-3\",\n\n className,\n )}\n {...props}\n >\n <FontAwesomeIcon icon={faChevronUp} className=\"size-3 pointer-events-none\" />\n </SelectPrimitive.ScrollUpArrow>\n );\n}\n\nfunction SelectScrollDownButton({\n className,\n ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n // Layout\n 'bottom-0 w-full flex items-center justify-center',\n 'cursor-default',\n\n // Theme\n 'bg-white py-1',\n\n // Icons\n \"[&_svg:not([class*='size-'])]:size-3\",\n\n className,\n )}\n {...props}\n >\n <FontAwesomeIcon icon={faChevronDown} className=\"size-3 pointer-events-none\" />\n </SelectPrimitive.ScrollDownArrow>\n );\n}\n/* eslint-enable no-use-before-define */\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Select.js","names":[],"sources":["../../src/components/Select.tsx"],"sourcesContent":["import { ComponentProps, createContext, useContext } from 'react';\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faCheck, faChevronDown, faChevronUp } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn, getPortalClassName, getPortalContainer } from '@verbb/plugin-kit-react/utils';\n\nconst selectTriggerVariants = cva('', {\n variants: {\n size: {\n xs: 'px-2 py-1 text-[11px] rounded-sm [&_svg:not([class*=\"size-\"])]:size-3',\n sm: 'px-2.5 py-1.5 text-[12px] rounded-md [&_svg:not([class*=\"size-\"])]:size-3',\n default: 'px-[10px] py-[6px] text-[14px] rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n lg: 'px-3 py-2 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n xl: 'px-3.5 py-2.5 text-sm rounded-lg [&_svg:not([class*=\"size-\"])]:size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectTriggerIconVariants = cva('', {\n variants: {\n size: {\n xs: 'size-[10px]',\n sm: 'size-[11px]',\n default: 'size-3',\n lg: 'size-3',\n xl: 'size-3.5',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectItemIndicatorVariants = cva('', {\n variants: {\n size: {\n xs: 'right-2 size-3',\n sm: 'right-2.5 size-3',\n default: 'right-2 size-3',\n lg: 'right-3 size-3',\n xl: 'right-3.5 size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\nconst selectItemIndicatorIconVariants = cva('', {\n variants: {\n size: {\n xs: 'size-3',\n sm: 'size-3',\n default: 'size-3',\n lg: 'size-3',\n xl: 'size-3',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectLabelVariants = cva([\n // Theme\n 'text-slate-700',\n], {\n variants: {\n size: {\n xs: 'px-2 pt-1 text-[11px]',\n sm: 'px-2.5 pt-1 text-[12px]',\n default: 'px-2.5 pt-1 text-xs',\n lg: 'px-3 pt-1 text-sm',\n xl: 'px-3.5 pt-1 text-base',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n});\n\nconst selectItemVariants = cva('', {\n variants: {\n size: {\n xs: 'px-2 py-1 pr-7 text-[11px] [&_svg:not([class*=\"size-\"])]:size-3',\n sm: 'px-2.5 py-1.5 pr-7 text-[12px] [&_svg:not([class*=\"size-\"])]:size-3',\n default: 'px-[10px] py-[6px] pr-8 text-[14px] [&_svg:not([class*=\"size-\"])]:size-3',\n lg: 'px-3 py-2 pr-8 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n xl: 'px-3.5 py-2.5 pr-9 text-sm [&_svg:not([class*=\"size-\"])]:size-3',\n\n\n },\n variant: {\n default: '',\n destructive: 'text-error',\n },\n },\n defaultVariants: {\n size: 'default',\n variant: 'default',\n },\n});\n\ntype SelectSize = VariantProps<typeof selectTriggerVariants>['size'];\n\nconst SelectContext = createContext<{ size: SelectSize }>({ size: 'default' });\n\nfunction Select({\n size = 'default',\n children,\n ...props\n}: ComponentProps<typeof SelectPrimitive.Root> & { size?: SelectSize }) {\n return (\n <SelectContext.Provider value={{ size }}>\n <SelectPrimitive.Root data-slot=\"select\" data-size={size} {...props}>\n {children}\n </SelectPrimitive.Root>\n </SelectContext.Provider>\n );\n}\n\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n return (\n <SelectPrimitive.Group\n data-slot=\"select-group\"\n className={cn(\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n return (\n <SelectPrimitive.Value\n data-slot=\"select-value\"\n className={cn(\n // Layout\n 'min-w-0 flex-1 basis-0 overflow-hidden text-left truncate',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectTrigger({\n className,\n size,\n children,\n ...props\n}: SelectPrimitive.Trigger.Props & {\n size?: SelectSize;\n}) {\n const context = useContext(SelectContext);\n const finalSize = size || context.size || 'default';\n\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={finalSize}\n className={cn(\n // Reset\n 'flex w-fit items-center justify-between whitespace-nowrap outline-none select-none transition-none',\n\n // Layout\n 'gap-3',\n\n // Theme\n 'bg-slate-250',\n 'border border-transparent',\n\n // Hover\n 'hover:not-disabled:bg-slate-300',\n\n // Value\n '*:data-[slot=select-value]:flex',\n '*:data-[slot=select-value]:items-center',\n '*:data-[slot=select-value]:gap-1.5',\n '*:data-[slot=select-value]:line-clamp-1',\n\n // Focus\n 'focus-visible:border-sky-600 focus-visible:shadow-[0_0_0_1px_var(--color-sky-600),0_0_4px_0_hsl(from_var(--color-sky-600)_h_s_l/0.7)]',\n 'aria-invalid:border-rose-600! aria-invalid:focus-visible:shadow-[0_0_0_1px_var(--color-rose-600),0_0_4px_0_hsl(from_var(--color-rose-600)_h_s_l/0.7)]!',\n\n // Disabled\n 'disabled:cursor-not-allowed disabled:opacity-50',\n\n // Icons\n '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n selectTriggerVariants({ size: finalSize }),\n\n className,\n )}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon\n render={\n <FontAwesomeIcon\n icon={faChevronDown}\n className={cn(\n 'pointer-events-none',\n selectTriggerIconVariants({ size: finalSize }),\n )}\n />\n }\n />\n </SelectPrimitive.Trigger>\n );\n}\n\n/* eslint-disable no-use-before-define */\nfunction SelectContent({\n className,\n children,\n side = 'bottom',\n sideOffset = 4,\n align = 'center',\n alignOffset = 0,\n alignItemWithTrigger = true,\n positionMethod,\n ...props\n}: SelectPrimitive.Popup.Props &\n Pick<\n SelectPrimitive.Positioner.Props,\n 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger' | 'positionMethod'\n >) {\n const resolvedPortalClassName = getPortalClassName();\n const resolvedPortalContainer = getPortalContainer();\n const resolvedPositionMethod = positionMethod ?? (\n resolvedPortalContainer instanceof ShadowRoot ? 'fixed' : undefined\n );\n\n return (\n <SelectPrimitive.Portal className={resolvedPortalClassName} container={resolvedPortalContainer}>\n <SelectPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n positionMethod={resolvedPositionMethod}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n // Reset\n 'relative isolate z-50 overflow-x-hidden overflow-y-auto',\n\n // Layout\n 'min-w-(--anchor-width)',\n 'max-w-[min(36rem,calc(100vw-2rem))]',\n\n // Theme\n 'rounded-md bg-white',\n 'shadow-[0_0_0_1px_rgba(31,41,51,0.1),0_5px_20px_rgba(31,41,51,0.25)]',\n\n // Animation\n 'duration-100',\n 'data-open:animate-in data-closed:animate-out',\n 'data-open:fade-in-0 data-closed:fade-out-0',\n 'data-open:zoom-in-95 data-closed:zoom-out-95',\n 'data-[side=bottom]:slide-in-from-top-2',\n 'data-[side=top]:slide-in-from-bottom-2',\n 'data-[side=left]:slide-in-from-right-2',\n 'data-[side=right]:slide-in-from-left-2',\n 'data-[side=inline-start]:slide-in-from-right-2',\n 'data-[side=inline-end]:slide-in-from-left-2',\n 'data-[align-trigger=true]:animate-none',\n 'origin-(--transform-origin)',\n\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.List>{children}</SelectPrimitive.List>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPrimitive.Positioner>\n </SelectPrimitive.Portal>\n );\n}\n\nfunction SelectLabel({\n className,\n ...props\n}: SelectPrimitive.GroupLabel.Props) {\n const { size } = useContext(SelectContext);\n\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn(\n // Theme\n 'text-slate-700',\n\n // Size\n selectLabelVariants({ size }),\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectItem({\n className,\n children,\n ...props\n}: SelectPrimitive.Item.Props) {\n const { size } = useContext(SelectContext);\n\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n // Reset\n 'relative flex w-full cursor-default items-center outline-hidden select-none',\n\n // Layout\n 'gap-1.5',\n '*:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',\n\n // Focus\n 'focus:bg-slate-100 data-[highlighted]:bg-slate-100',\n\n // Disabled\n 'data-disabled:pointer-events-none data-disabled:opacity-50',\n\n // Icons\n '[&_svg]:pointer-events-none [&_svg]:shrink-0',\n\n selectItemVariants({ size }),\n\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText className=\"flex min-w-0 items-center flex-1 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span\n className={cn(\n 'pointer-events-none absolute flex items-center justify-center',\n\n selectItemIndicatorVariants({ size }),\n )}\n >\n <FontAwesomeIcon\n icon={faCheck}\n className={cn(\n 'pointer-events-none',\n selectItemIndicatorIconVariants({ size }),\n )}\n />\n </span>\n }\n />\n </SelectPrimitive.Item>\n );\n}\n\nfunction SelectSeparator({\n className,\n ...props\n}: SelectPrimitive.Separator.Props) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn(\n // Reset\n 'pointer-events-none',\n\n // Layout\n '-mx-1 my-1 h-px',\n\n // Theme\n 'bg-slate-200',\n\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction SelectScrollUpButton({\n className,\n ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n // Layout\n 'top-0 w-full flex items-center justify-center',\n 'cursor-default',\n\n // Theme\n 'bg-white py-1',\n\n // Icons\n \"[&_svg:not([class*='size-'])]:size-3\",\n\n className,\n )}\n {...props}\n >\n <FontAwesomeIcon icon={faChevronUp} className=\"size-3 pointer-events-none\" />\n </SelectPrimitive.ScrollUpArrow>\n );\n}\n\nfunction SelectScrollDownButton({\n className,\n ...props\n}: ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n // Layout\n 'bottom-0 w-full flex items-center justify-center',\n 'cursor-default',\n\n // Theme\n 'bg-white py-1',\n\n // Icons\n \"[&_svg:not([class*='size-'])]:size-3\",\n\n className,\n )}\n {...props}\n >\n <FontAwesomeIcon icon={faChevronDown} className=\"size-3 pointer-events-none\" />\n </SelectPrimitive.ScrollDownArrow>\n );\n}\n/* eslint-enable no-use-before-define */\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n SelectValue,\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../src/components/TimePicker.tsx"],"names":[],"mappings":"AAaA,wBAAgB,UAAU,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,SAAiB,EACjB,GAAG,KAAK,EACX,EAAE;IACC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgDA"}
1
+ {"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../src/components/TimePicker.tsx"],"names":[],"mappings":"AAaA,wBAAgB,UAAU,CAAC,EACvB,KAAK,EACL,aAAa,EACb,WAAgB,EAChB,SAAS,EACT,QAAgB,EAChB,SAAiB,EACjB,GAAG,KAAK,EACX,EAAE;IACC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,2CAiDA"}
@@ -24,6 +24,7 @@ function TimePicker({ value, onValueChange, placeholder = "", className, disable
24
24
  className: cn("mr-1 text-gray-400")
25
25
  }), /* @__PURE__ */ jsx(SelectValue, { placeholder })]
26
26
  }), /* @__PURE__ */ jsx(SelectContent, {
27
+ alignItemWithTrigger: false,
27
28
  className: cn("max-h-[15rem] min-w-[8rem]"),
28
29
  children: timeOptions.map((option) => {
29
30
  return /* @__PURE__ */ jsx(SelectItem, {
@@ -1 +1 @@
1
- {"version":3,"file":"TimePicker.js","names":[],"sources":["../../src/components/TimePicker.tsx"],"sourcesContent":["import {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from '@verbb/plugin-kit-react/components';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faClock } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn, generateTimeOptions } from '@verbb/plugin-kit-react/utils';\n\nexport function TimePicker({\n value,\n onValueChange,\n placeholder = '',\n className,\n disabled = false,\n isInvalid = false,\n ...props\n}: {\n value: string;\n onValueChange?: (value: string) => void;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n isInvalid?: boolean;\n}) {\n // Use cached time options instead of generating on every render\n const timeOptions = generateTimeOptions();\n\n return (\n <Select\n value={value}\n onValueChange={(nextValue) => { onValueChange?.(String(nextValue ?? '')); }}\n disabled={disabled}\n {...props}\n >\n <SelectTrigger\n aria-invalid={isInvalid}\n className={cn(\n 'min-w-[7rem] min-h-[2.125rem]! h-[2.125rem]!',\n 'w-[130px] justify-start text-left font-normal',\n 'bg-transparent border border-slate-400!',\n 'hover:bg-slate-50!',\n 'active:bg-slate-150!',\n 'data-[popup-open]:bg-slate-150!',\n className,\n )}>\n <FontAwesomeIcon\n icon={faClock}\n className={cn(\n 'mr-1 text-gray-400',\n )}\n />\n <SelectValue placeholder={placeholder} />\n </SelectTrigger>\n <SelectContent\n className={cn(\n 'max-h-[15rem] min-w-[8rem]',\n )}\n >\n {timeOptions.map((option) => {\n return (\n <SelectItem\n key={option.value}\n value={option.value}\n >\n {option.label}\n </SelectItem>\n );\n })}\n </SelectContent>\n </Select>\n );\n}\n"],"mappings":";;;;;;;;;AAaA,SAAgB,WAAW,EACvB,OACA,eACA,cAAc,IACd,WACA,WAAW,OACX,YAAY,OACZ,GAAG,SAQJ;CAEC,MAAM,cAAc,qBAAqB;AAEzC,QACI,qBAAC,QAAD;EACW;EACP,gBAAgB,cAAc;AAAE,mBAAgB,OAAO,aAAa,GAAG,CAAC;;EAC9D;EACV,GAAI;YAJR,CAMI,qBAAC,eAAD;GACI,gBAAc;GACd,WAAW,GACP,gDACA,iDACA,2CACA,sBACA,wBACA,mCACA,UACH;aAVL,CAWI,oBAAC,iBAAD;IACI,MAAM;IACN,WAAW,GACP,qBACH;IACH,CAAA,EACF,oBAAC,aAAD,EAA0B,aAAe,CAAA,CAC7B;MAChB,oBAAC,eAAD;GACI,WAAW,GACP,6BACH;aAEA,YAAY,KAAK,WAAW;AACzB,WACI,oBAAC,YAAD;KAEI,OAAO,OAAO;eAEb,OAAO;KACC,EAJJ,OAAO,MAIH;KAEnB;GACU,CAAA,CACX"}
1
+ {"version":3,"file":"TimePicker.js","names":[],"sources":["../../src/components/TimePicker.tsx"],"sourcesContent":["import {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from '@verbb/plugin-kit-react/components';\n\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faClock } from '@fortawesome/pro-solid-svg-icons';\n\nimport { cn, generateTimeOptions } from '@verbb/plugin-kit-react/utils';\n\nexport function TimePicker({\n value,\n onValueChange,\n placeholder = '',\n className,\n disabled = false,\n isInvalid = false,\n ...props\n}: {\n value: string;\n onValueChange?: (value: string) => void;\n placeholder?: string;\n className?: string;\n disabled?: boolean;\n isInvalid?: boolean;\n}) {\n // Use cached time options instead of generating on every render\n const timeOptions = generateTimeOptions();\n\n return (\n <Select\n value={value}\n onValueChange={(nextValue) => { onValueChange?.(String(nextValue ?? '')); }}\n disabled={disabled}\n {...props}\n >\n <SelectTrigger\n aria-invalid={isInvalid}\n className={cn(\n 'min-w-[7rem] min-h-[2.125rem]! h-[2.125rem]!',\n 'w-[130px] justify-start text-left font-normal',\n 'bg-transparent border border-slate-400!',\n 'hover:bg-slate-50!',\n 'active:bg-slate-150!',\n 'data-[popup-open]:bg-slate-150!',\n className,\n )}>\n <FontAwesomeIcon\n icon={faClock}\n className={cn(\n 'mr-1 text-gray-400',\n )}\n />\n <SelectValue placeholder={placeholder} />\n </SelectTrigger>\n <SelectContent\n alignItemWithTrigger={false}\n className={cn(\n 'max-h-[15rem] min-w-[8rem]',\n )}\n >\n {timeOptions.map((option) => {\n return (\n <SelectItem\n key={option.value}\n value={option.value}\n >\n {option.label}\n </SelectItem>\n );\n })}\n </SelectContent>\n </Select>\n );\n}\n"],"mappings":";;;;;;;;;AAaA,SAAgB,WAAW,EACvB,OACA,eACA,cAAc,IACd,WACA,WAAW,OACX,YAAY,OACZ,GAAG,SAQJ;CAEC,MAAM,cAAc,qBAAqB;AAEzC,QACI,qBAAC,QAAD;EACW;EACP,gBAAgB,cAAc;AAAE,mBAAgB,OAAO,aAAa,GAAG,CAAC;;EAC9D;EACV,GAAI;YAJR,CAMI,qBAAC,eAAD;GACI,gBAAc;GACd,WAAW,GACP,gDACA,iDACA,2CACA,sBACA,wBACA,mCACA,UACH;aAVL,CAWI,oBAAC,iBAAD;IACI,MAAM;IACN,WAAW,GACP,qBACH;IACH,CAAA,EACF,oBAAC,aAAD,EAA0B,aAAe,CAAA,CAC7B;MAChB,oBAAC,eAAD;GACI,sBAAsB;GACtB,WAAW,GACP,6BACH;aAEA,YAAY,KAAK,WAAW;AACzB,WACI,oBAAC,YAAD;KAEI,OAAO,OAAO;eAEb,OAAO;KACC,EAJJ,OAAO,MAIH;KAEnB;GACU,CAAA,CACX"}
@@ -31,7 +31,8 @@ type FieldLayoutProps = ComponentProps<'div'> & {
31
31
  errors?: string[];
32
32
  withControl?: boolean;
33
33
  showInlineErrors?: boolean;
34
+ translatable?: boolean;
34
35
  };
35
- declare const FieldLayout: ({ name, label, instructions, headerEnd, required, warning, errors, withControl, showInlineErrors, className, children, ...props }: FieldLayoutProps) => import("react/jsx-runtime").JSX.Element;
36
+ declare const FieldLayout: ({ name, label, instructions, headerEnd, required, warning, errors, withControl, showInlineErrors, translatable, className, children, ...props }: FieldLayoutProps) => import("react/jsx-runtime").JSX.Element;
36
37
  export { FieldRoot, FieldHeader, FieldLabel, FieldInstructions, FieldControl, FieldErrors, FieldLayout, InlineFieldErrorVisibilityContext, useFieldContext, };
37
38
  //# sourceMappingURL=Field.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/forms/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAC+B,KAAK,cAAc,EAAE,KAAK,SAAS,EACxE,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,EAAY,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,yCAAyC,CAAC;AAM/D,KAAK,iBAAiB,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;CACpB,CAAC;AAGF,QAAA,MAAM,iCAAiC,kCAA+B,CAAC;AAEvE,QAAA,MAAM,eAAe,yBAMpB,CAAC;AAEF,KAAK,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,QAAA,MAAM,SAAS,GAAI,uCAEhB,cAAc,4CAWhB,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,yBAAyB,cAAc,CAAC,KAAK,CAAC,4CAIlE,CAAC;AAEF,QAAA,MAAM,UAAU,GAAI,yBAAyB,cAAc,CAAC,OAAO,KAAK,CAAC,4CAWxE,CAAC;AAEF,QAAA,MAAM,iBAAiB,GAAI,mCAAmC,cAAc,CAAC,GAAG,CAAC,4CA0BhF,CAAC;AAEF,KAAK,iBAAiB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,WAAW,CAAC,GAAG;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,4CAe/D,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,yBAAyB,cAAc,CAAC,IAAI,CAAC,mDAsBjE,CAAC;AAEF,KAAK,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC5C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,mIAalB,gBAAgB,4CA4DlB,CAAC;AAEF,OAAO,EACH,SAAS,EACT,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,WAAW,EACX,WAAW,EACX,iCAAiC,EACjC,eAAe,GAClB,CAAC"}
1
+ {"version":3,"file":"Field.d.ts","sourceRoot":"","sources":["../../src/forms/Field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAC+B,KAAK,cAAc,EAAE,KAAK,SAAS,EACxE,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,KAAK,EAAY,MAAM,oCAAoC,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,yCAAyC,CAAC;AAQ/D,KAAK,iBAAiB,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,EAAE,CAAC;CACpB,CAAC;AAGF,QAAA,MAAM,iCAAiC,kCAA+B,CAAC;AAEvE,QAAA,MAAM,eAAe,yBAMpB,CAAC;AAEF,KAAK,cAAc,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,QAAA,MAAM,SAAS,GAAI,uCAEhB,cAAc,4CAWhB,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,yBAAyB,cAAc,CAAC,KAAK,CAAC,4CAIlE,CAAC;AAEF,QAAA,MAAM,UAAU,GAAI,yBAAyB,cAAc,CAAC,OAAO,KAAK,CAAC,4CAWxE,CAAC;AAEF,QAAA,MAAM,iBAAiB,GAAI,mCAAmC,cAAc,CAAC,GAAG,CAAC,4CA0BhF,CAAC;AAEF,KAAK,iBAAiB,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,WAAW,CAAC,GAAG;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,QAAA,MAAM,YAAY,GAAI,yBAAyB,iBAAiB,4CAe/D,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,yBAAyB,cAAc,CAAC,IAAI,CAAC,mDAsBjE,CAAC;AAEF,KAAK,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC5C,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEF,QAAA,MAAM,WAAW,GAAI,iJAclB,gBAAgB,4CAqElB,CAAC;AAEF,OAAO,EACH,SAAS,EACT,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,YAAY,EACZ,WAAW,EACX,WAAW,EACX,iCAAiC,EACjC,eAAe,GAClB,CAAC"}
@@ -6,6 +6,7 @@ import { Label } from "../components/Label.js";
6
6
  import { Markdown } from "../components/Markdown.js";
7
7
  import "../components/index.js";
8
8
  import { Slot } from "../components/Slot.js";
9
+ import { TranslationIcon } from "./TranslationIcon.js";
9
10
  import { createContext, useContext, useId } from "react";
10
11
  import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
11
12
  import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -103,7 +104,7 @@ var FieldErrors = ({ className, ...props }) => {
103
104
  })
104
105
  });
105
106
  };
106
- var FieldLayout = ({ name, label, instructions, headerEnd, required, warning, errors = [], withControl = true, showInlineErrors, className, children, ...props }) => {
107
+ var FieldLayout = ({ name, label, instructions, headerEnd, required, warning, errors = [], withControl = true, showInlineErrors, translatable = false, className, children, ...props }) => {
107
108
  const t = useTranslation();
108
109
  const contextShowInlineErrors = useContext(InlineFieldErrorVisibilityContext);
109
110
  const shouldShowInlineErrors = showInlineErrors ?? contextShowInlineErrors;
@@ -119,17 +120,28 @@ var FieldLayout = ({ name, label, instructions, headerEnd, required, warning, er
119
120
  className: "min-w-0 space-y-0.5",
120
121
  children: [label && /* @__PURE__ */ jsxs(FieldLabel, {
121
122
  className: "flex items-center gap-1",
122
- children: [label, required && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
123
- className: "sr-only",
124
- children: t("Required")
125
- }), /* @__PURE__ */ jsx("span", {
126
- className: "text-rose-600",
127
- "aria-hidden": "true",
128
- children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
129
- icon: faAsterisk,
130
- className: "size-[10px]"
131
- })
132
- })] })]
123
+ children: [
124
+ label,
125
+ required && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
126
+ className: "sr-only",
127
+ children: t("Required")
128
+ }), /* @__PURE__ */ jsx("span", {
129
+ className: "text-rose-600",
130
+ "aria-hidden": "true",
131
+ children: /* @__PURE__ */ jsx(FontAwesomeIcon, {
132
+ icon: faAsterisk,
133
+ className: "size-[10px]"
134
+ })
135
+ })] }),
136
+ translatable ? /* @__PURE__ */ jsxs("span", {
137
+ className: "inline-flex",
138
+ title: t("Translatable"),
139
+ children: [/* @__PURE__ */ jsx(TranslationIcon, {}), /* @__PURE__ */ jsx("span", {
140
+ className: "sr-only",
141
+ children: t("Translatable")
142
+ })]
143
+ }) : null
144
+ ]
133
145
  }), instructions && /* @__PURE__ */ jsx(FieldInstructions, { children: instructions })]
134
146
  }), headerEnd && /* @__PURE__ */ jsx("div", {
135
147
  className: "shrink-0",
@@ -1 +1 @@
1
- {"version":3,"file":"Field.js","names":[],"sources":["../../src/forms/Field.tsx"],"sourcesContent":["import {\n createContext, useContext, useId, type ComponentProps, type ReactNode,\n} from 'react';\nimport { Label, Markdown } from '@verbb/plugin-kit-react/components';\nimport { Slot } from '@verbb/plugin-kit-react/components/Slot';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faAsterisk, faTriangleExclamation } from '@fortawesome/pro-solid-svg-icons';\nimport { useTranslation } from '@verbb/plugin-kit-react/hooks';\n\ntype FieldContextValue = {\n id: string;\n name: string;\n errors: string[];\n};\n\nconst FieldContext = createContext<FieldContextValue | null>(null);\nconst InlineFieldErrorVisibilityContext = createContext<boolean>(true);\n\nconst useFieldContext = () => {\n const context = useContext(FieldContext);\n if (!context) {\n throw new Error('Field components must be used within <FieldRoot>.');\n }\n return context;\n};\n\ntype FieldRootProps = ComponentProps<'div'> & {\n name: string;\n errors?: string[];\n};\n\nconst FieldRoot = ({\n name, errors = [], className, ...props\n}: FieldRootProps) => {\n const id = useId();\n return (\n <FieldContext.Provider value={{ id, name, errors }}>\n <div\n data-slot=\"field\"\n className={cn('space-y-1.5', className)}\n {...props}\n />\n </FieldContext.Provider>\n );\n};\n\nconst FieldHeader = ({ className, ...props }: ComponentProps<'div'>) => {\n return (\n <div data-slot=\"field-header\" className={cn(className)} {...props} />\n );\n};\n\nconst FieldLabel = ({ className, ...props }: ComponentProps<typeof Label>) => {\n const { id, errors } = useFieldContext();\n return (\n <Label\n data-slot=\"field-label\"\n htmlFor={`${id}-control`}\n data-error={errors.length > 0}\n className={cn('text-sm font-bold', className)}\n {...props}\n />\n );\n};\n\nconst FieldInstructions = ({ className, children, ...props }: ComponentProps<'p'>) => {\n const { id } = useFieldContext();\n const content = typeof children === 'string' ? children : null;\n\n const baseProps = {\n 'data-slot': 'field-instructions',\n id: `${id}-description`,\n className: cn('text-sm text-gray-500', className),\n };\n\n if (content !== null) {\n return (\n <Markdown\n content={content}\n inline\n as=\"p\"\n {...baseProps}\n />\n );\n }\n\n return (\n <p {...baseProps} {...props}>\n {children}\n </p>\n );\n};\n\ntype FieldControlProps = Omit<ComponentProps<typeof Slot>, 'className'> & {\n className?: string;\n};\n\nconst FieldControl = ({ className, ...props }: FieldControlProps) => {\n const { id, errors } = useFieldContext();\n const isInvalid = errors.length > 0;\n\n return (\n <Slot\n data-slot=\"field-control\"\n id={`${id}-control`}\n aria-invalid={isInvalid}\n aria-describedby={`${id}-description ${id}-errors`}\n aria-errormessage={isInvalid ? `${id}-errors` : undefined}\n className={cn(className)}\n {...props}\n />\n );\n};\n\nconst FieldErrors = ({ className, ...props }: ComponentProps<'ul'>) => {\n const { id, errors } = useFieldContext();\n if (!errors.length) {\n return null;\n }\n return (\n <ul\n data-slot=\"field-errors\"\n id={`${id}-errors`}\n className={cn('list-[square] text-error', className)}\n style={{ marginBlockStart: '5px', paddingInlineStart: '20px' }}\n {...props}\n >\n {errors.map((message, index) => {\n return (\n <li key={index}>\n <Markdown content={message} inline />\n </li>\n );\n })}\n </ul>\n );\n};\n\ntype FieldLayoutProps = ComponentProps<'div'> & {\n name: string;\n label?: string;\n instructions?: string;\n headerEnd?: ReactNode;\n required?: boolean;\n warning?: string;\n errors?: string[];\n withControl?: boolean;\n showInlineErrors?: boolean;\n};\n\nconst FieldLayout = ({\n name,\n label,\n instructions,\n headerEnd,\n required,\n warning,\n errors = [],\n withControl = true,\n showInlineErrors,\n className,\n children,\n ...props\n}: FieldLayoutProps) => {\n const t = useTranslation();\n const contextShowInlineErrors = useContext(InlineFieldErrorVisibilityContext);\n const shouldShowInlineErrors = showInlineErrors ?? contextShowInlineErrors;\n\n return (\n <FieldRoot name={name} errors={errors} className={className} {...props}>\n {(label || instructions || headerEnd) ? (\n <FieldHeader className={cn(\n headerEnd ? 'flex items-start justify-between gap-3' : 'space-y-0.5',\n )}>\n <div className=\"min-w-0 space-y-0.5\">\n {label && (\n <FieldLabel className=\"flex items-center gap-1\">\n {label}\n {required && (\n <>\n <span className=\"sr-only\">{t('Required')}</span>\n <span className=\"text-rose-600\" aria-hidden=\"true\">\n <FontAwesomeIcon icon={faAsterisk} className=\"size-[10px]\" />\n </span>\n </>\n )}\n </FieldLabel>\n )}\n {instructions && (\n <FieldInstructions>{instructions}</FieldInstructions>\n )}\n </div>\n\n {headerEnd && (\n <div className=\"shrink-0\">\n {headerEnd}\n </div>\n )}\n </FieldHeader>\n ) : null}\n\n {withControl ? (\n <FieldControl>{children}</FieldControl>\n ) : (\n children\n )}\n\n {shouldShowInlineErrors && <FieldErrors />}\n\n {warning && (\n <div className=\"flex min-w-0 items-start gap-1 text-sm text-warning\">\n <FontAwesomeIcon icon={faTriangleExclamation} className=\"mt-[0.3em] size-3 shrink-0\" />\n\n <Markdown\n className=\"min-w-0\"\n content={warning}\n inline\n as=\"p\"\n />\n </div>\n )}\n </FieldRoot>\n );\n};\n\nexport {\n FieldRoot,\n FieldHeader,\n FieldLabel,\n FieldInstructions,\n FieldControl,\n FieldErrors,\n FieldLayout,\n InlineFieldErrorVisibilityContext,\n useFieldContext,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"Field.js","names":[],"sources":["../../src/forms/Field.tsx"],"sourcesContent":["import {\n createContext, useContext, useId, type ComponentProps, type ReactNode,\n} from 'react';\nimport { Label, Markdown } from '@verbb/plugin-kit-react/components';\nimport { Slot } from '@verbb/plugin-kit-react/components/Slot';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faAsterisk, faTriangleExclamation } from '@fortawesome/pro-solid-svg-icons';\nimport { useTranslation } from '@verbb/plugin-kit-react/hooks';\n\nimport { TranslationIcon } from './TranslationIcon';\n\ntype FieldContextValue = {\n id: string;\n name: string;\n errors: string[];\n};\n\nconst FieldContext = createContext<FieldContextValue | null>(null);\nconst InlineFieldErrorVisibilityContext = createContext<boolean>(true);\n\nconst useFieldContext = () => {\n const context = useContext(FieldContext);\n if (!context) {\n throw new Error('Field components must be used within <FieldRoot>.');\n }\n return context;\n};\n\ntype FieldRootProps = ComponentProps<'div'> & {\n name: string;\n errors?: string[];\n};\n\nconst FieldRoot = ({\n name, errors = [], className, ...props\n}: FieldRootProps) => {\n const id = useId();\n return (\n <FieldContext.Provider value={{ id, name, errors }}>\n <div\n data-slot=\"field\"\n className={cn('space-y-1.5', className)}\n {...props}\n />\n </FieldContext.Provider>\n );\n};\n\nconst FieldHeader = ({ className, ...props }: ComponentProps<'div'>) => {\n return (\n <div data-slot=\"field-header\" className={cn(className)} {...props} />\n );\n};\n\nconst FieldLabel = ({ className, ...props }: ComponentProps<typeof Label>) => {\n const { id, errors } = useFieldContext();\n return (\n <Label\n data-slot=\"field-label\"\n htmlFor={`${id}-control`}\n data-error={errors.length > 0}\n className={cn('text-sm font-bold', className)}\n {...props}\n />\n );\n};\n\nconst FieldInstructions = ({ className, children, ...props }: ComponentProps<'p'>) => {\n const { id } = useFieldContext();\n const content = typeof children === 'string' ? children : null;\n\n const baseProps = {\n 'data-slot': 'field-instructions',\n id: `${id}-description`,\n className: cn('text-sm text-gray-500', className),\n };\n\n if (content !== null) {\n return (\n <Markdown\n content={content}\n inline\n as=\"p\"\n {...baseProps}\n />\n );\n }\n\n return (\n <p {...baseProps} {...props}>\n {children}\n </p>\n );\n};\n\ntype FieldControlProps = Omit<ComponentProps<typeof Slot>, 'className'> & {\n className?: string;\n};\n\nconst FieldControl = ({ className, ...props }: FieldControlProps) => {\n const { id, errors } = useFieldContext();\n const isInvalid = errors.length > 0;\n\n return (\n <Slot\n data-slot=\"field-control\"\n id={`${id}-control`}\n aria-invalid={isInvalid}\n aria-describedby={`${id}-description ${id}-errors`}\n aria-errormessage={isInvalid ? `${id}-errors` : undefined}\n className={cn(className)}\n {...props}\n />\n );\n};\n\nconst FieldErrors = ({ className, ...props }: ComponentProps<'ul'>) => {\n const { id, errors } = useFieldContext();\n if (!errors.length) {\n return null;\n }\n return (\n <ul\n data-slot=\"field-errors\"\n id={`${id}-errors`}\n className={cn('list-[square] text-error', className)}\n style={{ marginBlockStart: '5px', paddingInlineStart: '20px' }}\n {...props}\n >\n {errors.map((message, index) => {\n return (\n <li key={index}>\n <Markdown content={message} inline />\n </li>\n );\n })}\n </ul>\n );\n};\n\ntype FieldLayoutProps = ComponentProps<'div'> & {\n name: string;\n label?: string;\n instructions?: string;\n headerEnd?: ReactNode;\n required?: boolean;\n warning?: string;\n errors?: string[];\n withControl?: boolean;\n showInlineErrors?: boolean;\n translatable?: boolean;\n};\n\nconst FieldLayout = ({\n name,\n label,\n instructions,\n headerEnd,\n required,\n warning,\n errors = [],\n withControl = true,\n showInlineErrors,\n translatable = false,\n className,\n children,\n ...props\n}: FieldLayoutProps) => {\n const t = useTranslation();\n const contextShowInlineErrors = useContext(InlineFieldErrorVisibilityContext);\n const shouldShowInlineErrors = showInlineErrors ?? contextShowInlineErrors;\n\n return (\n <FieldRoot name={name} errors={errors} className={className} {...props}>\n {(label || instructions || headerEnd) ? (\n <FieldHeader className={cn(\n headerEnd ? 'flex items-start justify-between gap-3' : 'space-y-0.5',\n )}>\n <div className=\"min-w-0 space-y-0.5\">\n {label && (\n <FieldLabel className=\"flex items-center gap-1\">\n {label}\n {required && (\n <>\n <span className=\"sr-only\">{t('Required')}</span>\n <span className=\"text-rose-600\" aria-hidden=\"true\">\n <FontAwesomeIcon icon={faAsterisk} className=\"size-[10px]\" />\n </span>\n </>\n )}\n {translatable ? (\n <span\n className=\"inline-flex\"\n title={t('Translatable')}\n >\n <TranslationIcon />\n <span className=\"sr-only\">{t('Translatable')}</span>\n </span>\n ) : null}\n </FieldLabel>\n )}\n {instructions && (\n <FieldInstructions>{instructions}</FieldInstructions>\n )}\n </div>\n\n {headerEnd && (\n <div className=\"shrink-0\">\n {headerEnd}\n </div>\n )}\n </FieldHeader>\n ) : null}\n\n {withControl ? (\n <FieldControl>{children}</FieldControl>\n ) : (\n children\n )}\n\n {shouldShowInlineErrors && <FieldErrors />}\n\n {warning && (\n <div className=\"flex min-w-0 items-start gap-1 text-sm text-warning\">\n <FontAwesomeIcon icon={faTriangleExclamation} className=\"mt-[0.3em] size-3 shrink-0\" />\n\n <Markdown\n className=\"min-w-0\"\n content={warning}\n inline\n as=\"p\"\n />\n </div>\n )}\n </FieldRoot>\n );\n};\n\nexport {\n FieldRoot,\n FieldHeader,\n FieldLabel,\n FieldInstructions,\n FieldControl,\n FieldErrors,\n FieldLayout,\n InlineFieldErrorVisibilityContext,\n useFieldContext,\n};\n"],"mappings":"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"}
@@ -0,0 +1,5 @@
1
+ import { ComponentProps } from 'react';
2
+ type TranslationIconProps = ComponentProps<'svg'>;
3
+ declare const TranslationIcon: ({ className, ...props }: TranslationIconProps) => import("react/jsx-runtime").JSX.Element;
4
+ export { TranslationIcon };
5
+ //# sourceMappingURL=TranslationIcon.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TranslationIcon.d.ts","sourceRoot":"","sources":["../../src/forms/TranslationIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAI5C,KAAK,oBAAoB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAElD,QAAA,MAAM,eAAe,GAAI,yBAAyB,oBAAoB,4CAerE,CAAC;AAEF,OAAO,EAAE,eAAe,EAAE,CAAC"}
@@ -0,0 +1,18 @@
1
+ import { cn } from "../utils/classes.js";
2
+ import "../utils/index.js";
3
+ import { jsx } from "react/jsx-runtime";
4
+ //#region src/forms/TranslationIcon.tsx
5
+ var TranslationIcon = ({ className, ...props }) => {
6
+ return /* @__PURE__ */ jsx("svg", {
7
+ "aria-hidden": "true",
8
+ xmlns: "http://www.w3.org/2000/svg",
9
+ viewBox: "0 0 640 512",
10
+ className: cn("size-4 fill-current text-gray-550", className),
11
+ ...props,
12
+ children: /* @__PURE__ */ jsx("path", { d: "M64 64C28.7 64 0 92.7 0 128L0 384c0 35.3 28.7 64 64 64l208 0 32 0 16 0 256 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64L320 64l-16 0-32 0L64 64zm512 48c8.8 0 16 7.2 16 16l0 256c0 8.8-7.2 16-16 16l-256 0 0-288 256 0zM178.3 175.9l64 144c4.5 10.1-.1 21.9-10.2 26.4s-21.9-.1-26.4-10.2L196.8 316l-73.6 0-8.9 20.1c-4.5 10.1-16.3 14.6-26.4 10.2s-14.6-16.3-10.2-26.4l64-144c3.2-7.2 10.4-11.9 18.3-11.9s15.1 4.7 18.3 11.9zM179 276l-19-42.8L141 276l38 0zM456 164c-11 0-20 9-20 20l0 4-52 0c-11 0-20 9-20 20s9 20 20 20l72 0 35.1 0c-7.3 16.7-17.4 31.9-29.8 45l-.5-.5-14.6-14.6c-7.8-7.8-20.5-7.8-28.3 0s-7.8 20.5 0 28.3L430 298.3c-5.9 3.6-12.1 6.9-18.5 9.8l-3.6 1.6c-10.1 4.5-14.6 16.3-10.2 26.4s16.3 14.6 26.4 10.2l3.6-1.6c12-5.3 23.4-11.8 34-19.4c4.3 3 8.6 5.8 13.1 8.5l18.9 11.3c9.5 5.7 21.8 2.6 27.4-6.9s2.6-21.8-6.9-27.4l-18.9-11.3c-.9-.5-1.8-1.1-2.7-1.6c17.2-18.8 30.7-40.9 39.6-65.4L534 228l2 0c11 0 20-9 20-20s-9-20-20-20l-16 0-44 0 0-4c0-11-9-20-20-20z" })
13
+ });
14
+ };
15
+ //#endregion
16
+ export { TranslationIcon };
17
+
18
+ //# sourceMappingURL=TranslationIcon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TranslationIcon.js","names":[],"sources":["../../src/forms/TranslationIcon.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '@verbb/plugin-kit-react/utils';\n\ntype TranslationIconProps = ComponentProps<'svg'>;\n\nconst TranslationIcon = ({ className, ...props }: TranslationIconProps) => {\n return (\n <svg\n aria-hidden=\"true\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 640 512\"\n className={cn(\n 'size-4 fill-current text-gray-550',\n className,\n )}\n {...props}\n >\n <path d=\"M64 64C28.7 64 0 92.7 0 128L0 384c0 35.3 28.7 64 64 64l208 0 32 0 16 0 256 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64L320 64l-16 0-32 0L64 64zm512 48c8.8 0 16 7.2 16 16l0 256c0 8.8-7.2 16-16 16l-256 0 0-288 256 0zM178.3 175.9l64 144c4.5 10.1-.1 21.9-10.2 26.4s-21.9-.1-26.4-10.2L196.8 316l-73.6 0-8.9 20.1c-4.5 10.1-16.3 14.6-26.4 10.2s-14.6-16.3-10.2-26.4l64-144c3.2-7.2 10.4-11.9 18.3-11.9s15.1 4.7 18.3 11.9zM179 276l-19-42.8L141 276l38 0zM456 164c-11 0-20 9-20 20l0 4-52 0c-11 0-20 9-20 20s9 20 20 20l72 0 35.1 0c-7.3 16.7-17.4 31.9-29.8 45l-.5-.5-14.6-14.6c-7.8-7.8-20.5-7.8-28.3 0s-7.8 20.5 0 28.3L430 298.3c-5.9 3.6-12.1 6.9-18.5 9.8l-3.6 1.6c-10.1 4.5-14.6 16.3-10.2 26.4s16.3 14.6 26.4 10.2l3.6-1.6c12-5.3 23.4-11.8 34-19.4c4.3 3 8.6 5.8 13.1 8.5l18.9 11.3c9.5 5.7 21.8 2.6 27.4-6.9s2.6-21.8-6.9-27.4l-18.9-11.3c-.9-.5-1.8-1.1-2.7-1.6c17.2-18.8 30.7-40.9 39.6-65.4L534 228l2 0c11 0 20-9 20-20s-9-20-20-20l-16 0-44 0 0-4c0-11-9-20-20-20z\" />\n </svg>\n );\n};\n\nexport { TranslationIcon };\n"],"mappings":";;;;AAMA,IAAM,mBAAmB,EAAE,WAAW,GAAG,YAAkC;AACvE,QACI,oBAAC,OAAD;EACI,eAAY;EACZ,OAAM;EACN,SAAQ;EACR,WAAW,GACP,qCACA,UACH;EACD,GAAI;YAEJ,oBAAC,QAAD,EAAM,GAAE,47BAA67B,CAAA;EACn8B,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimeField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/DateTimeField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAgDhE,CAAC"}
1
+ {"version":3,"file":"DateTimeField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/DateTimeField.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAoChE,CAAC"}
@@ -1,28 +1,21 @@
1
+ import { formatDateTimeValue, parseDateTimeValue } from "../../utils/datetime.js";
1
2
  import { DatePicker } from "../../components/DatePicker.js";
2
3
  import { TimePicker } from "../../components/TimePicker.js";
3
4
  import "../../components/index.js";
4
5
  import { FieldLayout } from "../Field.js";
5
6
  import { useEngineField } from "../useEngineField.js";
6
- import { useEffect, useState } from "react";
7
+ import { useMemo } from "react";
7
8
  import { jsx, jsxs } from "react/jsx-runtime";
8
9
  //#region src/forms/fields/DateTimeField.tsx
9
10
  var DateTimeField = ({ form, field }) => {
10
11
  const { value, setValue, errors } = useEngineField(form, field.name);
11
- const initialDate = value ? new Date(String(value)) : null;
12
- const initialTime = initialDate ? initialDate.toTimeString().slice(0, 5) : "";
13
- const [dateValue, setDateValue] = useState(initialDate);
14
- const [timeValue, setTimeValue] = useState(initialTime);
15
- useEffect(() => {
16
- let nextValue = "";
17
- if (dateValue && timeValue) nextValue = (/* @__PURE__ */ new Date(`${dateValue.toISOString().split("T")[0]}T${timeValue}`)).toISOString();
18
- else if (dateValue) nextValue = (/* @__PURE__ */ new Date(`${dateValue.toISOString().split("T")[0]}T00:00:00`)).toISOString();
19
- if (String(value ?? "") !== nextValue) setValue(nextValue);
20
- }, [
21
- dateValue,
22
- timeValue,
23
- setValue,
24
- value
25
- ]);
12
+ const parsedValue = useMemo(() => parseDateTimeValue(value), [value]);
13
+ const handleDateChange = (nextValue) => {
14
+ setValue(formatDateTimeValue(nextValue ?? null, parsedValue.time));
15
+ };
16
+ const handleTimeChange = (nextTime) => {
17
+ setValue(formatDateTimeValue(parsedValue.date, nextTime));
18
+ };
26
19
  return /* @__PURE__ */ jsx(FieldLayout, {
27
20
  name: field.name,
28
21
  label: field.label,
@@ -34,14 +27,12 @@ var DateTimeField = ({ form, field }) => {
34
27
  children: /* @__PURE__ */ jsxs("div", {
35
28
  className: "flex gap-2",
36
29
  children: [/* @__PURE__ */ jsx(DatePicker, {
37
- value: dateValue,
38
- onValueChange: (nextValue) => {
39
- setDateValue(nextValue ?? null);
40
- },
30
+ value: parsedValue.date,
31
+ onValueChange: handleDateChange,
41
32
  isInvalid: errors.length > 0
42
33
  }), /* @__PURE__ */ jsx(TimePicker, {
43
- value: timeValue,
44
- onValueChange: setTimeValue,
34
+ value: parsedValue.time,
35
+ onValueChange: handleTimeChange,
45
36
  isInvalid: errors.length > 0
46
37
  })]
47
38
  })
@@ -1 +1 @@
1
- {"version":3,"file":"DateTimeField.js","names":[],"sources":["../../../src/forms/fields/DateTimeField.tsx"],"sourcesContent":["import { DatePicker, TimePicker } from '@verbb/plugin-kit-react/components';\nimport { useEffect, useState } from 'react';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype DateTimeFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n required?: boolean;\n };\n};\n\nexport const DateTimeField = ({ form, field }: DateTimeFieldProps) => {\n const { value, setValue, errors } = useEngineField(form, field.name);\n const initialDate = value ? new Date(String(value)) : null;\n const initialTime = initialDate ? initialDate.toTimeString().slice(0, 5) : '';\n\n const [dateValue, setDateValue] = useState<Date | null>(initialDate);\n const [timeValue, setTimeValue] = useState<string>(initialTime);\n\n useEffect(() => {\n let nextValue = '';\n\n if (dateValue && timeValue) {\n const combinedDateTime = new Date(`${dateValue.toISOString().split('T')[0]}T${timeValue}`);\n nextValue = combinedDateTime.toISOString();\n } else if (dateValue) {\n const dateOnly = new Date(`${dateValue.toISOString().split('T')[0]}T00:00:00`);\n nextValue = dateOnly.toISOString();\n }\n\n if (String(value ?? '') !== nextValue) {\n setValue(nextValue);\n }\n }, [dateValue, timeValue, setValue, value]);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n withControl={false}\n >\n <div className=\"flex gap-2\">\n <DatePicker\n value={dateValue}\n onValueChange={(nextValue) => { setDateValue(nextValue ?? null); }}\n isInvalid={errors.length > 0}\n />\n <TimePicker\n value={timeValue}\n onValueChange={setTimeValue}\n isInvalid={errors.length > 0}\n />\n </div>\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;AAiBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EAAE,OAAO,UAAU,WAAW,eAAe,MAAM,MAAM,KAAK;CACpE,MAAM,cAAc,QAAQ,IAAI,KAAK,OAAO,MAAM,CAAC,GAAG;CACtD,MAAM,cAAc,cAAc,YAAY,cAAc,CAAC,MAAM,GAAG,EAAE,GAAG;CAE3E,MAAM,CAAC,WAAW,gBAAgB,SAAsB,YAAY;CACpE,MAAM,CAAC,WAAW,gBAAgB,SAAiB,YAAY;AAE/D,iBAAgB;EACZ,IAAI,YAAY;AAEhB,MAAI,aAAa,UAEb,8BAAY,IADiB,KAAK,GAAG,UAAU,aAAa,CAAC,MAAM,IAAI,CAAC,GAAG,GAAG,YAClE,EAAiB,aAAa;WACnC,UAEP,8BAAY,IADS,KAAK,GAAG,UAAU,aAAa,CAAC,MAAM,IAAI,CAAC,GAAG,WACvD,EAAS,aAAa;AAGtC,MAAI,OAAO,SAAS,GAAG,KAAK,UACxB,UAAS,UAAU;IAExB;EAAC;EAAW;EAAW;EAAU;EAAM,CAAC;AAE3C,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;EACR,aAAa;YAEb,qBAAC,OAAD;GAAK,WAAU;aAAf,CACI,oBAAC,YAAD;IACI,OAAO;IACP,gBAAgB,cAAc;AAAE,kBAAa,aAAa,KAAK;;IAC/D,WAAW,OAAO,SAAS;IAC7B,CAAA,EACF,oBAAC,YAAD;IACI,OAAO;IACP,eAAe;IACf,WAAW,OAAO,SAAS;IAC7B,CAAA,CACA;;EACI,CAAA"}
1
+ {"version":3,"file":"DateTimeField.js","names":[],"sources":["../../../src/forms/fields/DateTimeField.tsx"],"sourcesContent":["import { DatePicker, TimePicker } from '@verbb/plugin-kit-react/components';\nimport { formatDateTimeValue, parseDateTimeValue } from '@verbb/plugin-kit-react/utils/datetime';\nimport { useMemo } from 'react';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype DateTimeFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n required?: boolean;\n };\n};\n\nexport const DateTimeField = ({ form, field }: DateTimeFieldProps) => {\n const { value, setValue, errors } = useEngineField(form, field.name);\n const parsedValue = useMemo(() => parseDateTimeValue(value), [value]);\n\n const handleDateChange = (nextValue?: Date) => {\n setValue(formatDateTimeValue(nextValue ?? null, parsedValue.time));\n };\n\n const handleTimeChange = (nextTime: string) => {\n setValue(formatDateTimeValue(parsedValue.date, nextTime));\n };\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n withControl={false}\n >\n <div className=\"flex gap-2\">\n <DatePicker\n value={parsedValue.date}\n onValueChange={handleDateChange}\n isInvalid={errors.length > 0}\n />\n <TimePicker\n value={parsedValue.time}\n onValueChange={handleTimeChange}\n isInvalid={errors.length > 0}\n />\n </div>\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;;AAkBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EAAE,OAAO,UAAU,WAAW,eAAe,MAAM,MAAM,KAAK;CACpE,MAAM,cAAc,cAAc,mBAAmB,MAAM,EAAE,CAAC,MAAM,CAAC;CAErE,MAAM,oBAAoB,cAAqB;AAC3C,WAAS,oBAAoB,aAAa,MAAM,YAAY,KAAK,CAAC;;CAGtE,MAAM,oBAAoB,aAAqB;AAC3C,WAAS,oBAAoB,YAAY,MAAM,SAAS,CAAC;;AAG7D,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;EACR,aAAa;YAEb,qBAAC,OAAD;GAAK,WAAU;aAAf,CACI,oBAAC,YAAD;IACI,OAAO,YAAY;IACnB,eAAe;IACf,WAAW,OAAO,SAAS;IAC7B,CAAA,EACF,oBAAC,YAAD;IACI,OAAO,YAAY;IACnB,eAAe;IACf,WAAW,OAAO,SAAS;IAC7B,CAAA,CACA;;EACI,CAAA"}
@@ -10,6 +10,7 @@ type ListFieldProps = {
10
10
  required?: boolean;
11
11
  schema?: SchemaRenderable;
12
12
  showGroupedErrors?: boolean;
13
+ className?: string;
13
14
  };
14
15
  };
15
16
  export declare const ListField: ({ form, field }: ListFieldProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -1 +1 @@
1
- {"version":3,"file":"ListField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/ListField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAc,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE1E,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,gBAAgB,CAAC;QAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;KAC/B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,mDA4ExD,CAAC"}
1
+ {"version":3,"file":"ListField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/ListField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAc,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAE1E,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,MAAM,CAAC,EAAE,gBAAgB,CAAC;QAC1B,iBAAiB,CAAC,EAAE,OAAO,CAAC;QAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,mDA6ExD,CAAC"}
@@ -15,6 +15,7 @@ var ListField = ({ form, field }) => {
15
15
  required: field.required,
16
16
  errors,
17
17
  withControl: false,
18
+ className: field.className,
18
19
  children: items.map((item, index) => {
19
20
  const modifyChildren = (children) => {
20
21
  let normalizedChildren = [];
@@ -1 +1 @@
1
- {"version":3,"file":"ListField.js","names":[],"sources":["../../../src/forms/fields/ListField.tsx"],"sourcesContent":["import { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode, SchemaRenderable } from '../engine/SchemaIndex';\n\ntype ListFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n required?: boolean;\n schema?: SchemaRenderable;\n showGroupedErrors?: boolean;\n };\n};\n\nexport const ListField = ({ form, field }: ListFieldProps) => {\n const Renderer = form?.SchemaRenderer;\n const shouldShowGroupedErrors = field.showGroupedErrors !== false;\n const errors = shouldShowGroupedErrors\n ? (form?.getGroupedErrorsForPath?.(field.name)\n ?? form?.getErrorMapFields?.()[field.name]\n ?? [])\n : [];\n\n if (!Renderer) {\n return null;\n }\n\n const items = Array.isArray(form.getFieldValue(field.name)) ? form.getFieldValue(field.name) : [];\n const itemSchema = field.schema;\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n withControl={false}\n >\n {items.map((item, index) => {\n const modifyChildren = (children: SchemaRenderable | undefined): SchemaRenderable[] => {\n let normalizedChildren: SchemaRenderable[] = [];\n if (Array.isArray(children)) {\n normalizedChildren = children;\n } else if (children) {\n normalizedChildren = [children];\n }\n\n return normalizedChildren.map((child) => {\n if (!child || typeof child !== 'object' || Array.isArray(child)) {\n return child;\n }\n\n const childNode = child as SchemaNode;\n const shouldMapChildren = Boolean(childNode.children) && typeof childNode.children === 'object';\n const resolvedChildren = shouldMapChildren ? modifyChildren(childNode.children) : childNode.children;\n\n const childWithContext = {\n ...childNode,\n _data: {\n $item: item,\n $key: index,\n },\n children: resolvedChildren,\n };\n\n if (childNode.$field && typeof childNode.name === 'string') {\n return {\n ...childWithContext,\n name: `${field.name}.${index}.${childNode.name}`,\n };\n }\n\n return childWithContext;\n });\n };\n\n const modifiedChildren = modifyChildren(itemSchema);\n const key = item?._uid || item?.id || `${field.name}-${index}`;\n\n return (\n <Renderer\n key={key}\n schema={modifiedChildren}\n />\n );\n })}\n </FieldLayout>\n );\n};\n"],"mappings":";;;AAiBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,WAAW,MAAM;CAEvB,MAAM,SAD0B,MAAM,sBAAsB,QAErD,MAAM,0BAA0B,MAAM,KAAK,IACvC,MAAM,qBAAqB,CAAC,MAAM,SAClC,EAAE,GACP,EAAE;AAER,KAAI,CAAC,SACD,QAAO;CAGX,MAAM,QAAQ,MAAM,QAAQ,KAAK,cAAc,MAAM,KAAK,CAAC,GAAG,KAAK,cAAc,MAAM,KAAK,GAAG,EAAE;CACjG,MAAM,aAAa,MAAM;AAEzB,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;EACR,aAAa;YAEZ,MAAM,KAAK,MAAM,UAAU;GACxB,MAAM,kBAAkB,aAA+D;IACnF,IAAI,qBAAyC,EAAE;AAC/C,QAAI,MAAM,QAAQ,SAAS,CACvB,sBAAqB;aACd,SACP,sBAAqB,CAAC,SAAS;AAGnC,WAAO,mBAAmB,KAAK,UAAU;AACrC,SAAI,CAAC,SAAS,OAAO,UAAU,YAAY,MAAM,QAAQ,MAAM,CAC3D,QAAO;KAGX,MAAM,YAAY;KAElB,MAAM,mBADoB,QAAQ,UAAU,SAAS,IAAI,OAAO,UAAU,aAAa,WAC1C,eAAe,UAAU,SAAS,GAAG,UAAU;KAE5F,MAAM,mBAAmB;MACrB,GAAG;MACH,OAAO;OACH,OAAO;OACP,MAAM;OACT;MACD,UAAU;MACb;AAED,SAAI,UAAU,UAAU,OAAO,UAAU,SAAS,SAC9C,QAAO;MACH,GAAG;MACH,MAAM,GAAG,MAAM,KAAK,GAAG,MAAM,GAAG,UAAU;MAC7C;AAGL,YAAO;MACT;;GAGN,MAAM,mBAAmB,eAAe,WAAW;GACnD,MAAM,MAAM,MAAM,QAAQ,MAAM,MAAM,GAAG,MAAM,KAAK,GAAG;AAEvD,UACI,oBAAC,UAAD,EAEI,QAAQ,kBACV,EAFO,IAEP;IAER;EACQ,CAAA"}
1
+ {"version":3,"file":"ListField.js","names":[],"sources":["../../../src/forms/fields/ListField.tsx"],"sourcesContent":["import { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode, SchemaRenderable } from '../engine/SchemaIndex';\n\ntype ListFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n required?: boolean;\n schema?: SchemaRenderable;\n showGroupedErrors?: boolean;\n className?: string;\n };\n};\n\nexport const ListField = ({ form, field }: ListFieldProps) => {\n const Renderer = form?.SchemaRenderer;\n const shouldShowGroupedErrors = field.showGroupedErrors !== false;\n const errors = shouldShowGroupedErrors\n ? (form?.getGroupedErrorsForPath?.(field.name)\n ?? form?.getErrorMapFields?.()[field.name]\n ?? [])\n : [];\n\n if (!Renderer) {\n return null;\n }\n\n const items = Array.isArray(form.getFieldValue(field.name)) ? form.getFieldValue(field.name) : [];\n const itemSchema = field.schema;\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n withControl={false}\n className={field.className}\n >\n {items.map((item, index) => {\n const modifyChildren = (children: SchemaRenderable | undefined): SchemaRenderable[] => {\n let normalizedChildren: SchemaRenderable[] = [];\n if (Array.isArray(children)) {\n normalizedChildren = children;\n } else if (children) {\n normalizedChildren = [children];\n }\n\n return normalizedChildren.map((child) => {\n if (!child || typeof child !== 'object' || Array.isArray(child)) {\n return child;\n }\n\n const childNode = child as SchemaNode;\n const shouldMapChildren = Boolean(childNode.children) && typeof childNode.children === 'object';\n const resolvedChildren = shouldMapChildren ? modifyChildren(childNode.children) : childNode.children;\n\n const childWithContext = {\n ...childNode,\n _data: {\n $item: item,\n $key: index,\n },\n children: resolvedChildren,\n };\n\n if (childNode.$field && typeof childNode.name === 'string') {\n return {\n ...childWithContext,\n name: `${field.name}.${index}.${childNode.name}`,\n };\n }\n\n return childWithContext;\n });\n };\n\n const modifiedChildren = modifyChildren(itemSchema);\n const key = item?._uid || item?.id || `${field.name}-${index}`;\n\n return (\n <Renderer\n key={key}\n schema={modifiedChildren}\n />\n );\n })}\n </FieldLayout>\n );\n};\n"],"mappings":";;;AAkBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,WAAW,MAAM;CAEvB,MAAM,SAD0B,MAAM,sBAAsB,QAErD,MAAM,0BAA0B,MAAM,KAAK,IACvC,MAAM,qBAAqB,CAAC,MAAM,SAClC,EAAE,GACP,EAAE;AAER,KAAI,CAAC,SACD,QAAO;CAGX,MAAM,QAAQ,MAAM,QAAQ,KAAK,cAAc,MAAM,KAAK,CAAC,GAAG,KAAK,cAAc,MAAM,KAAK,GAAG,EAAE;CACjG,MAAM,aAAa,MAAM;AAEzB,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;EACR,aAAa;EACb,WAAW,MAAM;YAEhB,MAAM,KAAK,MAAM,UAAU;GACxB,MAAM,kBAAkB,aAA+D;IACnF,IAAI,qBAAyC,EAAE;AAC/C,QAAI,MAAM,QAAQ,SAAS,CACvB,sBAAqB;aACd,SACP,sBAAqB,CAAC,SAAS;AAGnC,WAAO,mBAAmB,KAAK,UAAU;AACrC,SAAI,CAAC,SAAS,OAAO,UAAU,YAAY,MAAM,QAAQ,MAAM,CAC3D,QAAO;KAGX,MAAM,YAAY;KAElB,MAAM,mBADoB,QAAQ,UAAU,SAAS,IAAI,OAAO,UAAU,aAAa,WAC1C,eAAe,UAAU,SAAS,GAAG,UAAU;KAE5F,MAAM,mBAAmB;MACrB,GAAG;MACH,OAAO;OACH,OAAO;OACP,MAAM;OACT;MACD,UAAU;MACb;AAED,SAAI,UAAU,UAAU,OAAO,UAAU,SAAS,SAC9C,QAAO;MACH,GAAG;MACH,MAAM,GAAG,MAAM,KAAK,GAAG,MAAM,GAAG,UAAU;MAC7C;AAGL,YAAO;MACT;;GAGN,MAAM,mBAAmB,eAAe,WAAW;GACnD,MAAM,MAAM,MAAM,QAAQ,MAAM,MAAM,GAAG,MAAM,KAAK,GAAG;AAEvD,UACI,oBAAC,UAAD,EAEI,QAAQ,kBACV,EAFO,IAEP;IAER;EACQ,CAAA"}
@@ -16,6 +16,7 @@ type RichTextFieldProps = {
16
16
  rows?: number;
17
17
  linkOptions?: LinkOptionsInput;
18
18
  linkSelectorStorageKeyPrefix?: string;
19
+ translatable?: boolean;
19
20
  };
20
21
  };
21
22
  export declare const RichTextField: ({ form, field }: RichTextFieldProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"RichTextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/RichTextField.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAgB,MAAM,oCAAoC,CAAC;AAEpF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAI5E,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;QACnB,cAAc,CAAC,EAAE,cAAc,CAAC;QAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,WAAW,CAAC,EAAE,gBAAgB,CAAC;QAC/B,4BAA4B,CAAC,EAAE,MAAM,CAAC;KACzC,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAiDhE,CAAC"}
1
+ {"version":3,"file":"RichTextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/RichTextField.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAgB,MAAM,oCAAoC,CAAC;AAEpF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAI5E,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;QACnB,cAAc,CAAC,EAAE,cAAc,CAAC;QAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,WAAW,CAAC,EAAE,gBAAgB,CAAC;QAC/B,4BAA4B,CAAC,EAAE,MAAM,CAAC;QACtC,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAkDhE,CAAC"}
@@ -25,6 +25,7 @@ var RichTextField = ({ form, field }) => {
25
25
  instructions: field.instructions,
26
26
  warning: field.warning,
27
27
  required: field.required,
28
+ translatable: field.translatable,
28
29
  errors,
29
30
  withControl: false,
30
31
  children: /* @__PURE__ */ jsx(TiptapEditor, {
@@ -1 +1 @@
1
- {"version":3,"file":"RichTextField.js","names":[],"sources":["../../../src/forms/fields/RichTextField.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { LinkOptionsInput, TiptapEditor } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { VariableConfig } from '../contexts/VariableCategoriesContext';\nimport { useEngineField } from '../useEngineField';\nimport { useVariableCategoriesContext } from '../contexts/VariableCategoriesContext';\n\ntype RichTextFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n buttons?: string[];\n variableConfig?: VariableConfig;\n required?: boolean;\n disabled?: boolean;\n rows?: number;\n linkOptions?: LinkOptionsInput;\n linkSelectorStorageKeyPrefix?: string;\n };\n};\n\nexport const RichTextField = ({ form, field }: RichTextFieldProps) => {\n const { value, setValue, errors } = useEngineField(form, field.name);\n const buttons = field.buttons ?? ['bold', 'italic'];\n const {\n getVariableCategories,\n variableCategoryLabels,\n variableCategoryOrder,\n variableTransformerRegistry,\n renderVariableConfigureSection,\n resolveVariableTagLabel,\n } = useVariableCategoriesContext();\n const { variableConfig } = field;\n\n const variableCategories = useMemo(() => {\n if (!variableConfig || !getVariableCategories) {\n return undefined;\n }\n return getVariableCategories(variableConfig, { form });\n }, [variableConfig, form, getVariableCategories]);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n withControl={false}\n >\n <TiptapEditor\n value={value ?? ''}\n onChange={setValue}\n placeholder={field.placeholder}\n rows={field.rows}\n buttons={buttons}\n {...(variableCategories && { variableCategories })}\n {...(variableCategoryLabels && { variableCategoryLabels })}\n {...(variableCategoryOrder && { variableCategoryOrder })}\n {...(variableTransformerRegistry && { variableTransformerRegistry })}\n {...(renderVariableConfigureSection && { renderVariableConfigureSection })}\n {...(resolveVariableTagLabel && { resolveVariableTagLabel })}\n {...(field.linkOptions && { linkOptions: field.linkOptions })}\n {...(field.linkSelectorStorageKeyPrefix && { linkSelectorStorageKeyPrefix: field.linkSelectorStorageKeyPrefix })}\n disabled={field.disabled}\n isInvalid={errors.length > 0}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;AA0BA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EAAE,OAAO,UAAU,WAAW,eAAe,MAAM,MAAM,KAAK;CACpE,MAAM,UAAU,MAAM,WAAW,CAAC,QAAQ,SAAS;CACnD,MAAM,EACF,uBACA,wBACA,uBACA,6BACA,gCACA,4BACA,8BAA8B;CAClC,MAAM,EAAE,mBAAmB;CAE3B,MAAM,qBAAqB,cAAc;AACrC,MAAI,CAAC,kBAAkB,CAAC,sBACpB;AAEJ,SAAO,sBAAsB,gBAAgB,EAAE,MAAM,CAAC;IACvD;EAAC;EAAgB;EAAM;EAAsB,CAAC;AAEjD,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;EACR,aAAa;YAEb,oBAAC,cAAD;GACI,OAAO,SAAS;GAChB,UAAU;GACV,aAAa,MAAM;GACnB,MAAM,MAAM;GACH;GACT,GAAK,sBAAsB,EAAE,oBAAoB;GACjD,GAAK,0BAA0B,EAAE,wBAAwB;GACzD,GAAK,yBAAyB,EAAE,uBAAuB;GACvD,GAAK,+BAA+B,EAAE,6BAA6B;GACnE,GAAK,kCAAkC,EAAE,gCAAgC;GACzE,GAAK,2BAA2B,EAAE,yBAAyB;GAC3D,GAAK,MAAM,eAAe,EAAE,aAAa,MAAM,aAAa;GAC5D,GAAK,MAAM,gCAAgC,EAAE,8BAA8B,MAAM,8BAA8B;GAC/G,UAAU,MAAM;GAChB,WAAW,OAAO,SAAS;GAC7B,CAAA;EACQ,CAAA"}
1
+ {"version":3,"file":"RichTextField.js","names":[],"sources":["../../../src/forms/fields/RichTextField.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { LinkOptionsInput, TiptapEditor } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { VariableConfig } from '../contexts/VariableCategoriesContext';\nimport { useEngineField } from '../useEngineField';\nimport { useVariableCategoriesContext } from '../contexts/VariableCategoriesContext';\n\ntype RichTextFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n buttons?: string[];\n variableConfig?: VariableConfig;\n required?: boolean;\n disabled?: boolean;\n rows?: number;\n linkOptions?: LinkOptionsInput;\n linkSelectorStorageKeyPrefix?: string;\n translatable?: boolean;\n };\n};\n\nexport const RichTextField = ({ form, field }: RichTextFieldProps) => {\n const { value, setValue, errors } = useEngineField(form, field.name);\n const buttons = field.buttons ?? ['bold', 'italic'];\n const {\n getVariableCategories,\n variableCategoryLabels,\n variableCategoryOrder,\n variableTransformerRegistry,\n renderVariableConfigureSection,\n resolveVariableTagLabel,\n } = useVariableCategoriesContext();\n const { variableConfig } = field;\n\n const variableCategories = useMemo(() => {\n if (!variableConfig || !getVariableCategories) {\n return undefined;\n }\n return getVariableCategories(variableConfig, { form });\n }, [variableConfig, form, getVariableCategories]);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n translatable={field.translatable}\n errors={errors}\n withControl={false}\n >\n <TiptapEditor\n value={value ?? ''}\n onChange={setValue}\n placeholder={field.placeholder}\n rows={field.rows}\n buttons={buttons}\n {...(variableCategories && { variableCategories })}\n {...(variableCategoryLabels && { variableCategoryLabels })}\n {...(variableCategoryOrder && { variableCategoryOrder })}\n {...(variableTransformerRegistry && { variableTransformerRegistry })}\n {...(renderVariableConfigureSection && { renderVariableConfigureSection })}\n {...(resolveVariableTagLabel && { resolveVariableTagLabel })}\n {...(field.linkOptions && { linkOptions: field.linkOptions })}\n {...(field.linkSelectorStorageKeyPrefix && { linkSelectorStorageKeyPrefix: field.linkSelectorStorageKeyPrefix })}\n disabled={field.disabled}\n isInvalid={errors.length > 0}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;AA2BA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EAAE,OAAO,UAAU,WAAW,eAAe,MAAM,MAAM,KAAK;CACpE,MAAM,UAAU,MAAM,WAAW,CAAC,QAAQ,SAAS;CACnD,MAAM,EACF,uBACA,wBACA,uBACA,6BACA,gCACA,4BACA,8BAA8B;CAClC,MAAM,EAAE,mBAAmB;CAE3B,MAAM,qBAAqB,cAAc;AACrC,MAAI,CAAC,kBAAkB,CAAC,sBACpB;AAEJ,SAAO,sBAAsB,gBAAgB,EAAE,MAAM,CAAC;IACvD;EAAC;EAAgB;EAAM;EAAsB,CAAC;AAEjD,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;EACR,aAAa;YAEb,oBAAC,cAAD;GACI,OAAO,SAAS;GAChB,UAAU;GACV,aAAa,MAAM;GACnB,MAAM,MAAM;GACH;GACT,GAAK,sBAAsB,EAAE,oBAAoB;GACjD,GAAK,0BAA0B,EAAE,wBAAwB;GACzD,GAAK,yBAAyB,EAAE,uBAAuB;GACvD,GAAK,+BAA+B,EAAE,6BAA6B;GACnE,GAAK,kCAAkC,EAAE,gCAAgC;GACzE,GAAK,2BAA2B,EAAE,yBAAyB;GAC3D,GAAK,MAAM,eAAe,EAAE,aAAa,MAAM,aAAa;GAC5D,GAAK,MAAM,gCAAgC,EAAE,8BAA8B,MAAM,8BAA8B;GAC/G,UAAU,MAAM;GAChB,WAAW,OAAO,SAAS;GAC7B,CAAA;EACQ,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/SelectField.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGxD,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACpB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,iBAAiB,gBAAgB,4CA0E5D,CAAC"}
1
+ {"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/SelectField.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGxD,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACpB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,iBAAiB,gBAAgB,4CA2E5D,CAAC"}
@@ -63,7 +63,8 @@ var SelectField = ({ form, field }) => {
63
63
  return setValue(nextValue);
64
64
  },
65
65
  isInvalid,
66
- onBlur: setTouched
66
+ onBlur: setTouched,
67
+ disabled: field.disabled
67
68
  })
68
69
  });
69
70
  };
@@ -1 +1 @@
1
- {"version":3,"file":"SelectField.js","names":[],"sources":["../../../src/forms/fields/SelectField.tsx"],"sourcesContent":["import type React from 'react';\nimport { SelectInput } from '@verbb/plugin-kit-react/components';\nimport { evaluateCondition } from '@verbb/plugin-kit-react/utils/schema';\nimport { useEffect, useMemo, useSyncExternalStore } from 'react';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode } from '../engine/SchemaIndex';\nimport { useEngineField } from '../useEngineField';\n\ntype SelectFieldOption = {\n value: unknown;\n label: string;\n disabled?: boolean;\n if?: string;\n [key: string]: unknown;\n};\n\ntype SelectFieldProps = {\n form: SchemaFormEngineApi;\n field: SchemaNode & {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n options?: SelectFieldOption[];\n required?: boolean;\n disabled?: boolean;\n };\n};\n\ntype SelectInputProps = React.ComponentProps<typeof SelectInput>;\n\nexport const SelectField = ({ form, field }: SelectFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n const values = useSyncExternalStore(\n form.store.subscribe.bind(form.store),\n () => { return form.store.state.values; },\n () => { return form.store.state.values; },\n );\n\n const conditionData = useMemo(() => {\n const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n return {\n ...(values || {}),\n ...scopedObject,\n ...fieldData,\n };\n }, [field, form, values]);\n\n const filteredOptions = useMemo(() => {\n const options = Array.isArray(field.options) ? field.options : [];\n\n return options.filter((option) => {\n if (!option?.if) {\n return true;\n }\n\n return evaluateCondition(option.if, conditionData);\n });\n }, [conditionData, field.options]);\n\n useEffect(() => {\n if (value === undefined || value === null || value === '') {\n return;\n }\n\n const hasCurrentValue = filteredOptions.some((option) => {\n return String(option?.value) === String(value);\n });\n\n if (hasCurrentValue) {\n return;\n }\n\n const fallback = filteredOptions.find((option) => {\n return option?.value !== undefined && option?.disabled !== true;\n });\n\n setValue(fallback ? fallback.value : '');\n }, [filteredOptions, setValue, value]);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n >\n <SelectInput\n options={filteredOptions}\n placeholder={field.placeholder}\n value={value ?? ''}\n onChange={(nextValue) => { return setValue(nextValue); }}\n isInvalid={isInvalid}\n onBlur={setTouched as SelectInputProps['onBlur']}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;AAiCA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;AAElC,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,aAAD;GACI,SAAS;GACT,aAAa,MAAM;GACnB,OAAO,SAAS;GAChB,WAAW,cAAc;AAAE,WAAO,SAAS,UAAU;;GAC1C;GACX,QAAQ;GACV,CAAA;EACQ,CAAA"}
1
+ {"version":3,"file":"SelectField.js","names":[],"sources":["../../../src/forms/fields/SelectField.tsx"],"sourcesContent":["import type React from 'react';\nimport { SelectInput } from '@verbb/plugin-kit-react/components';\nimport { evaluateCondition } from '@verbb/plugin-kit-react/utils/schema';\nimport { useEffect, useMemo, useSyncExternalStore } from 'react';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode } from '../engine/SchemaIndex';\nimport { useEngineField } from '../useEngineField';\n\ntype SelectFieldOption = {\n value: unknown;\n label: string;\n disabled?: boolean;\n if?: string;\n [key: string]: unknown;\n};\n\ntype SelectFieldProps = {\n form: SchemaFormEngineApi;\n field: SchemaNode & {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n options?: SelectFieldOption[];\n required?: boolean;\n disabled?: boolean;\n };\n};\n\ntype SelectInputProps = React.ComponentProps<typeof SelectInput>;\n\nexport const SelectField = ({ form, field }: SelectFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n const values = useSyncExternalStore(\n form.store.subscribe.bind(form.store),\n () => { return form.store.state.values; },\n () => { return form.store.state.values; },\n );\n\n const conditionData = useMemo(() => {\n const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n return {\n ...(values || {}),\n ...scopedObject,\n ...fieldData,\n };\n }, [field, form, values]);\n\n const filteredOptions = useMemo(() => {\n const options = Array.isArray(field.options) ? field.options : [];\n\n return options.filter((option) => {\n if (!option?.if) {\n return true;\n }\n\n return evaluateCondition(option.if, conditionData);\n });\n }, [conditionData, field.options]);\n\n useEffect(() => {\n if (value === undefined || value === null || value === '') {\n return;\n }\n\n const hasCurrentValue = filteredOptions.some((option) => {\n return String(option?.value) === String(value);\n });\n\n if (hasCurrentValue) {\n return;\n }\n\n const fallback = filteredOptions.find((option) => {\n return option?.value !== undefined && option?.disabled !== true;\n });\n\n setValue(fallback ? fallback.value : '');\n }, [filteredOptions, setValue, value]);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n >\n <SelectInput\n options={filteredOptions}\n placeholder={field.placeholder}\n value={value ?? ''}\n onChange={(nextValue) => { return setValue(nextValue); }}\n isInvalid={isInvalid}\n onBlur={setTouched as SelectInputProps['onBlur']}\n disabled={field.disabled}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;;;AAiCA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;AAElC,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,aAAD;GACI,SAAS;GACT,aAAa,MAAM;GACnB,OAAO,SAAS;GAChB,WAAW,cAAc;AAAE,WAAO,SAAS,UAAU;;GAC1C;GACX,QAAQ;GACR,UAAU,MAAM;GAClB,CAAA;EACQ,CAAA"}
@@ -9,6 +9,7 @@ type TextFieldProps = {
9
9
  placeholder?: string;
10
10
  required?: boolean;
11
11
  disabled?: boolean;
12
+ translatable?: boolean;
12
13
  };
13
14
  };
14
15
  export declare const TextField: ({ form, field }: TextFieldProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,4CAwBxD,CAAC"}
1
+ {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,4CAyBxD,CAAC"}
@@ -12,6 +12,7 @@ var TextField = ({ form, field }) => {
12
12
  instructions: field.instructions,
13
13
  warning: field.warning,
14
14
  required: field.required,
15
+ translatable: field.translatable,
15
16
  errors,
16
17
  children: /* @__PURE__ */ jsx(Input, {
17
18
  value: String(value ?? ""),
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.js","names":[],"sources":["../../../src/forms/fields/TextField.tsx"],"sourcesContent":["import { Input } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n };\n};\n\nexport const TextField = ({ form, field }: TextFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n >\n <Input\n value={String(value ?? '')}\n onChange={(event) => { return setValue(event.target.value); }}\n onBlur={setTouched}\n placeholder={field.placeholder}\n disabled={field.disabled}\n aria-invalid={isInvalid}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;AAkBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,OAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,gBAAc;GAChB,CAAA;EACQ,CAAA"}
1
+ {"version":3,"file":"TextField.js","names":[],"sources":["../../../src/forms/fields/TextField.tsx"],"sourcesContent":["import { Input } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n translatable?: boolean;\n };\n};\n\nexport const TextField = ({ form, field }: TextFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n translatable={field.translatable}\n errors={errors}\n >\n <Input\n value={String(value ?? '')}\n onChange={(event) => { return setValue(event.target.value); }}\n onBlur={setTouched}\n placeholder={field.placeholder}\n disabled={field.disabled}\n aria-invalid={isInvalid}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;AAmBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,OAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,gBAAc;GAChB,CAAA;EACQ,CAAA"}
@@ -10,6 +10,7 @@ type TextareaFieldProps = {
10
10
  rows?: number;
11
11
  required?: boolean;
12
12
  disabled?: boolean;
13
+ translatable?: boolean;
13
14
  };
14
15
  };
15
16
  export declare const TextareaField: ({ form, field }: TextareaFieldProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- {"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextareaField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAyBhE,CAAC"}
1
+ {"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextareaField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CA0BhE,CAAC"}
@@ -12,6 +12,7 @@ var TextareaField = ({ form, field }) => {
12
12
  instructions: field.instructions,
13
13
  warning: field.warning,
14
14
  required: field.required,
15
+ translatable: field.translatable,
15
16
  errors,
16
17
  children: /* @__PURE__ */ jsx(Textarea, {
17
18
  value: String(value ?? ""),
@@ -1 +1 @@
1
- {"version":3,"file":"TextareaField.js","names":[],"sources":["../../../src/forms/fields/TextareaField.tsx"],"sourcesContent":["import { Textarea } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextareaFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n rows?: number;\n required?: boolean;\n disabled?: boolean;\n };\n};\n\nexport const TextareaField = ({ form, field }: TextareaFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n errors={errors}\n >\n <Textarea\n value={String(value ?? '')}\n onChange={(event) => { return setValue(event.target.value); }}\n onBlur={setTouched}\n placeholder={field.placeholder}\n disabled={field.disabled}\n rows={field.rows}\n aria-invalid={isInvalid}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;AAmBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,UAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,MAAM,MAAM;GACZ,gBAAc;GAChB,CAAA;EACQ,CAAA"}
1
+ {"version":3,"file":"TextareaField.js","names":[],"sources":["../../../src/forms/fields/TextareaField.tsx"],"sourcesContent":["import { Textarea } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextareaFieldProps = {\n form: SchemaFormEngineApi;\n field: {\n name: string;\n label?: string;\n instructions?: string;\n warning?: string;\n placeholder?: string;\n rows?: number;\n required?: boolean;\n disabled?: boolean;\n translatable?: boolean;\n };\n};\n\nexport const TextareaField = ({ form, field }: TextareaFieldProps) => {\n const {\n value, setValue, setTouched, errors, isInvalid,\n } = useEngineField(form, field.name);\n\n return (\n <FieldLayout\n name={field.name}\n label={field.label}\n instructions={field.instructions}\n warning={field.warning}\n required={field.required}\n translatable={field.translatable}\n errors={errors}\n >\n <Textarea\n value={String(value ?? '')}\n onChange={(event) => { return setValue(event.target.value); }}\n onBlur={setTouched}\n placeholder={field.placeholder}\n disabled={field.disabled}\n rows={field.rows}\n aria-invalid={isInvalid}\n />\n </FieldLayout>\n );\n};\n"],"mappings":";;;;;;AAoBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,UAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,MAAM,MAAM;GACZ,gBAAc;GAChB,CAAA;EACQ,CAAA"}
@@ -0,0 +1,10 @@
1
+ export type ParsedDateTimeValue = {
2
+ date: Date | null;
3
+ time: string;
4
+ };
5
+ export declare const parseLocalDate: (value: unknown) => Date | undefined;
6
+ export declare const parseDateTimeValue: (value: unknown) => ParsedDateTimeValue;
7
+ export declare const startOfMonth: (value: Date) => Date;
8
+ export declare const resolveCalendarMonth: (selected?: Date) => Date;
9
+ export declare const formatDateTimeValue: (date: Date | null, time: string) => string;
10
+ //# sourceMappingURL=datetime.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"datetime.d.ts","sourceRoot":"","sources":["../../src/utils/datetime.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,OAAO,KAAG,IAAI,GAAG,SAEtD,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,OAAO,OAAO,KAAG,mBA2CnD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,IAAI,KAAG,IAE1C,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,WAAW,IAAI,KAAG,IAEtD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,MAAM,IAAI,GAAG,IAAI,EAAE,MAAM,MAAM,KAAG,MAQrE,CAAC"}
@@ -0,0 +1,60 @@
1
+ //#region src/utils/datetime.ts
2
+ var pad2 = (value) => {
3
+ return String(value).padStart(2, "0");
4
+ };
5
+ var parseLocalDate = (value) => {
6
+ return parseDateTimeValue(value).date ?? void 0;
7
+ };
8
+ var parseDateTimeValue = (value) => {
9
+ if (value === null || value === void 0 || value === "") return {
10
+ date: null,
11
+ time: ""
12
+ };
13
+ if (value instanceof Date) {
14
+ if (Number.isNaN(value.getTime())) return {
15
+ date: null,
16
+ time: ""
17
+ };
18
+ return {
19
+ date: new Date(value.getFullYear(), value.getMonth(), value.getDate()),
20
+ time: `${pad2(value.getHours())}:${pad2(value.getMinutes())}`
21
+ };
22
+ }
23
+ const stringValue = String(value).trim();
24
+ if (!stringValue) return {
25
+ date: null,
26
+ time: ""
27
+ };
28
+ const localMatch = stringValue.match(/^(\d{4})-(\d{2})-(\d{2})(?:[ T](\d{2}):(\d{2})(?::(\d{2}))?)?/);
29
+ if (localMatch && !/[zZ]$/.test(stringValue) && !/[+-]\d{2}:?\d{2}$/.test(stringValue)) {
30
+ const [, year, month, day, hour = "00", minute = "00"] = localMatch;
31
+ return {
32
+ date: new Date(Number(year), Number(month) - 1, Number(day)),
33
+ time: `${hour}:${minute}`
34
+ };
35
+ }
36
+ const parsed = new Date(stringValue);
37
+ if (Number.isNaN(parsed.getTime())) return {
38
+ date: null,
39
+ time: ""
40
+ };
41
+ return {
42
+ date: new Date(parsed.getFullYear(), parsed.getMonth(), parsed.getDate()),
43
+ time: `${pad2(parsed.getHours())}:${pad2(parsed.getMinutes())}`
44
+ };
45
+ };
46
+ var startOfMonth = (value) => {
47
+ return new Date(value.getFullYear(), value.getMonth(), 1);
48
+ };
49
+ var resolveCalendarMonth = (selected) => {
50
+ return startOfMonth(selected ?? /* @__PURE__ */ new Date());
51
+ };
52
+ var formatDateTimeValue = (date, time) => {
53
+ if (!date) return "";
54
+ const [hour = "00", minute = "00"] = (time || "00:00").split(":");
55
+ return `${date.getFullYear()}-${pad2(date.getMonth() + 1)}-${pad2(date.getDate())} ${pad2(Number(hour))}:${pad2(Number(minute))}:00`;
56
+ };
57
+ //#endregion
58
+ export { formatDateTimeValue, parseDateTimeValue, parseLocalDate, resolveCalendarMonth, startOfMonth };
59
+
60
+ //# sourceMappingURL=datetime.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"datetime.js","names":[],"sources":["../../src/utils/datetime.ts"],"sourcesContent":["const pad2 = (value: number): string => {\n return String(value).padStart(2, '0');\n};\n\nexport type ParsedDateTimeValue = {\n date: Date | null;\n time: string;\n};\n\nexport const parseLocalDate = (value: unknown): Date | undefined => {\n return parseDateTimeValue(value).date ?? undefined;\n};\n\nexport const parseDateTimeValue = (value: unknown): ParsedDateTimeValue => {\n if (value === null || value === undefined || value === '') {\n return { date: null, time: '' };\n }\n\n if (value instanceof Date) {\n if (Number.isNaN(value.getTime())) {\n return { date: null, time: '' };\n }\n\n return {\n date: new Date(value.getFullYear(), value.getMonth(), value.getDate()),\n time: `${pad2(value.getHours())}:${pad2(value.getMinutes())}`,\n };\n }\n\n const stringValue = String(value).trim();\n\n if (!stringValue) {\n return { date: null, time: '' };\n }\n\n const localMatch = stringValue.match(/^(\\d{4})-(\\d{2})-(\\d{2})(?:[ T](\\d{2}):(\\d{2})(?::(\\d{2}))?)?/);\n\n if (localMatch && !/[zZ]$/.test(stringValue) && !/[+-]\\d{2}:?\\d{2}$/.test(stringValue)) {\n const [, year, month, day, hour = '00', minute = '00'] = localMatch;\n\n return {\n date: new Date(Number(year), Number(month) - 1, Number(day)),\n time: `${hour}:${minute}`,\n };\n }\n\n const parsed = new Date(stringValue);\n\n if (Number.isNaN(parsed.getTime())) {\n return { date: null, time: '' };\n }\n\n return {\n date: new Date(parsed.getFullYear(), parsed.getMonth(), parsed.getDate()),\n time: `${pad2(parsed.getHours())}:${pad2(parsed.getMinutes())}`,\n };\n};\n\nexport const startOfMonth = (value: Date): Date => {\n return new Date(value.getFullYear(), value.getMonth(), 1);\n};\n\nexport const resolveCalendarMonth = (selected?: Date): Date => {\n return startOfMonth(selected ?? new Date());\n};\n\nexport const formatDateTimeValue = (date: Date | null, time: string): string => {\n if (!date) {\n return '';\n }\n\n const [hour = '00', minute = '00'] = (time || '00:00').split(':');\n\n return `${date.getFullYear()}-${pad2(date.getMonth() + 1)}-${pad2(date.getDate())} ${pad2(Number(hour))}:${pad2(Number(minute))}:00`;\n};\n"],"mappings":";AAAA,IAAM,QAAQ,UAA0B;AACpC,QAAO,OAAO,MAAM,CAAC,SAAS,GAAG,IAAI;;AAQzC,IAAa,kBAAkB,UAAqC;AAChE,QAAO,mBAAmB,MAAM,CAAC,QAAQ,KAAA;;AAG7C,IAAa,sBAAsB,UAAwC;AACvE,KAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,GACnD,QAAO;EAAE,MAAM;EAAM,MAAM;EAAI;AAGnC,KAAI,iBAAiB,MAAM;AACvB,MAAI,OAAO,MAAM,MAAM,SAAS,CAAC,CAC7B,QAAO;GAAE,MAAM;GAAM,MAAM;GAAI;AAGnC,SAAO;GACH,MAAM,IAAI,KAAK,MAAM,aAAa,EAAE,MAAM,UAAU,EAAE,MAAM,SAAS,CAAC;GACtE,MAAM,GAAG,KAAK,MAAM,UAAU,CAAC,CAAC,GAAG,KAAK,MAAM,YAAY,CAAC;GAC9D;;CAGL,MAAM,cAAc,OAAO,MAAM,CAAC,MAAM;AAExC,KAAI,CAAC,YACD,QAAO;EAAE,MAAM;EAAM,MAAM;EAAI;CAGnC,MAAM,aAAa,YAAY,MAAM,gEAAgE;AAErG,KAAI,cAAc,CAAC,QAAQ,KAAK,YAAY,IAAI,CAAC,oBAAoB,KAAK,YAAY,EAAE;EACpF,MAAM,GAAG,MAAM,OAAO,KAAK,OAAO,MAAM,SAAS,QAAQ;AAEzD,SAAO;GACH,MAAM,IAAI,KAAK,OAAO,KAAK,EAAE,OAAO,MAAM,GAAG,GAAG,OAAO,IAAI,CAAC;GAC5D,MAAM,GAAG,KAAK,GAAG;GACpB;;CAGL,MAAM,SAAS,IAAI,KAAK,YAAY;AAEpC,KAAI,OAAO,MAAM,OAAO,SAAS,CAAC,CAC9B,QAAO;EAAE,MAAM;EAAM,MAAM;EAAI;AAGnC,QAAO;EACH,MAAM,IAAI,KAAK,OAAO,aAAa,EAAE,OAAO,UAAU,EAAE,OAAO,SAAS,CAAC;EACzE,MAAM,GAAG,KAAK,OAAO,UAAU,CAAC,CAAC,GAAG,KAAK,OAAO,YAAY,CAAC;EAChE;;AAGL,IAAa,gBAAgB,UAAsB;AAC/C,QAAO,IAAI,KAAK,MAAM,aAAa,EAAE,MAAM,UAAU,EAAE,EAAE;;AAG7D,IAAa,wBAAwB,aAA0B;AAC3D,QAAO,aAAa,4BAAY,IAAI,MAAM,CAAC;;AAG/C,IAAa,uBAAuB,MAAmB,SAAyB;AAC5E,KAAI,CAAC,KACD,QAAO;CAGX,MAAM,CAAC,OAAO,MAAM,SAAS,SAAS,QAAQ,SAAS,MAAM,IAAI;AAEjE,QAAO,GAAG,KAAK,aAAa,CAAC,GAAG,KAAK,KAAK,UAAU,GAAG,EAAE,CAAC,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,GAAG,KAAK,OAAO,KAAK,CAAC,CAAC,GAAG,KAAK,OAAO,OAAO,CAAC,CAAC"}
@@ -1,6 +1,7 @@
1
1
  export * from '@verbb/plugin-kit';
2
2
  export * from './classes';
3
3
  export * from './config';
4
+ export * from './datetime';
4
5
  export * from './documentScrollStability';
5
6
  export * from './craftHostBridge';
6
7
  export * from './handle';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAC;AAGlC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAC;AAGlC,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC"}
@@ -5,6 +5,7 @@ import { setTranslateFunction, setTranslationCategory, translate } from "./trans
5
5
  import { getHostBridge, hostFormatDate, hostGetLocale, hostGetTimepickerOptions, hostOpenElementSelector, hostRequest, setHostBridge } from "./hostBridge.js";
6
6
  import { ensureDocumentScrollStability } from "./documentScrollStability.js";
7
7
  import { configurePluginKitReact } from "./config.js";
8
+ import { formatDateTimeValue, parseDateTimeValue, parseLocalDate, resolveCalendarMonth, startOfMonth } from "./datetime.js";
8
9
  import { createCraftHostBridge } from "./craftHostBridge.js";
9
10
  import { buildUniqueHandleFromSource, getDynamicReservedHandles } from "./handle.js";
10
11
  import { evaluateCondition, extractFieldNames, extractFields, normalizeAttrs, traverseSchema } from "./schema.js";
@@ -29,6 +30,7 @@ var utils_exports = /* @__PURE__ */ __exportAll({
29
30
  evaluateCondition: () => evaluateCondition,
30
31
  extractFieldNames: () => extractFieldNames,
31
32
  extractFields: () => extractFields,
33
+ formatDateTimeValue: () => formatDateTimeValue,
32
34
  generateTimeOptions: () => generateTimeOptions,
33
35
  getDynamicReservedHandles: () => getDynamicReservedHandles,
34
36
  getHostBridge: () => getHostBridge,
@@ -49,12 +51,16 @@ var utils_exports = /* @__PURE__ */ __exportAll({
49
51
  hostRequest: () => hostRequest,
50
52
  normalizeAttrs: () => normalizeAttrs,
51
53
  normalizeSchemaNode: () => normalizeSchemaNode,
54
+ parseDateTimeValue: () => parseDateTimeValue,
55
+ parseLocalDate: () => parseLocalDate,
56
+ resolveCalendarMonth: () => resolveCalendarMonth,
52
57
  setHostBridge: () => setHostBridge,
53
58
  setPortalClassName: () => setPortalClassName,
54
59
  setPortalContainer: () => setPortalContainer,
55
60
  setShadowRootSelectors: () => setShadowRootSelectors,
56
61
  setTranslateFunction: () => setTranslateFunction,
57
62
  setTranslationCategory: () => setTranslationCategory,
63
+ startOfMonth: () => startOfMonth,
58
64
  translate: () => translate,
59
65
  traverseSchema: () => traverseSchema,
60
66
  validateFormValues: () => validateFormValues,
@@ -63,6 +69,6 @@ var utils_exports = /* @__PURE__ */ __exportAll({
63
69
  import * as import__verbb_plugin_kit from "@verbb/plugin-kit";
64
70
  __reExport(utils_exports, import__verbb_plugin_kit);
65
71
  //#endregion
66
- export { buildUniqueHandleFromSource, clearTimeOptionsCache, cn, configurePluginKitReact, createCraftHostBridge, createSchemaFieldIndex, ensureDocumentScrollStability, evaluateCondition, extractFieldNames, extractFields, generateTimeOptions, getDynamicReservedHandles, getHostBridge, getPortalClassName, getPortalContainer, getPortalTargetForAppend, getRichTextHtml, getRichTextText, getSchemaFieldIndex, getSchemaFieldNames, getShadowRootSelectors, hasSchemaErrors, hasSchemaErrorsCached, hostFormatDate, hostGetLocale, hostGetTimepickerOptions, hostOpenElementSelector, hostRequest, normalizeAttrs, normalizeSchemaNode, setHostBridge, setPortalClassName, setPortalContainer, setShadowRootSelectors, setTranslateFunction, setTranslationCategory, translate, traverseSchema, utils_exports, validateFormValues, zustandHmrFix };
72
+ export { buildUniqueHandleFromSource, clearTimeOptionsCache, cn, configurePluginKitReact, createCraftHostBridge, createSchemaFieldIndex, ensureDocumentScrollStability, evaluateCondition, extractFieldNames, extractFields, formatDateTimeValue, generateTimeOptions, getDynamicReservedHandles, getHostBridge, getPortalClassName, getPortalContainer, getPortalTargetForAppend, getRichTextHtml, getRichTextText, getSchemaFieldIndex, getSchemaFieldNames, getShadowRootSelectors, hasSchemaErrors, hasSchemaErrorsCached, hostFormatDate, hostGetLocale, hostGetTimepickerOptions, hostOpenElementSelector, hostRequest, normalizeAttrs, normalizeSchemaNode, parseDateTimeValue, parseLocalDate, resolveCalendarMonth, setHostBridge, setPortalClassName, setPortalContainer, setShadowRootSelectors, setTranslateFunction, setTranslationCategory, startOfMonth, translate, traverseSchema, utils_exports, validateFormValues, zustandHmrFix };
67
73
 
68
74
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":[],"sources":["../../src/utils/index.ts"],"sourcesContent":["// Re-export all utilities from the base plugin-kit package\nexport * from '@verbb/plugin-kit';\n\n// Export local utilities\nexport * from './classes';\nexport * from './config';\nexport * from './documentScrollStability';\nexport * from './craftHostBridge';\nexport * from './handle';\nexport * from './hostBridge';\nexport * from './portal';\nexport * from './schema';\nexport * from './schemaFieldNames';\nexport * from './schemaIndex';\nexport * from './schemaIndexCache';\nexport * from './schemaNormalize';\nexport * from './store';\nexport * from './timeOptions';\nexport * from './tiptap';\nexport * from './translation';\nexport * from './validation';\n"],"mappings":""}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/utils/index.ts"],"sourcesContent":["// Re-export all utilities from the base plugin-kit package\nexport * from '@verbb/plugin-kit';\n\n// Export local utilities\nexport * from './classes';\nexport * from './config';\nexport * from './datetime';\nexport * from './documentScrollStability';\nexport * from './craftHostBridge';\nexport * from './handle';\nexport * from './hostBridge';\nexport * from './portal';\nexport * from './schema';\nexport * from './schemaFieldNames';\nexport * from './schemaIndex';\nexport * from './schemaIndexCache';\nexport * from './schemaNormalize';\nexport * from './store';\nexport * from './timeOptions';\nexport * from './tiptap';\nexport * from './translation';\nexport * from './validation';\n"],"mappings":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@verbb/plugin-kit-react",
3
- "version": "1.0.6",
3
+ "version": "1.0.8",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -154,7 +154,7 @@
154
154
  "@tiptap/react": "^3.22.4",
155
155
  "@types/prismjs": "^1.26.6",
156
156
  "@uiw/react-codemirror": "^4.25.10",
157
- "@verbb/plugin-kit": "1.0.6",
157
+ "@verbb/plugin-kit": "1.0.8",
158
158
  "class-variance-authority": "^0.7.1",
159
159
  "clsx": "^2.1.1",
160
160
  "cmdk": "^1.1.1",