@postenbring/hedwig-react 2.2.1 → 3.0.0

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 (69) hide show
  1. package/dist/{chunk-ITLZQ47H.mjs → chunk-3VKESN3T.mjs} +4 -4
  2. package/dist/chunk-3VKESN3T.mjs.map +1 -0
  3. package/dist/{chunk-XZ43OSZ5.mjs → chunk-6OJINZ37.mjs} +4 -4
  4. package/dist/chunk-6OJINZ37.mjs.map +1 -0
  5. package/dist/{chunk-23IZCRJA.mjs → chunk-J35DWEJX.mjs} +5 -5
  6. package/dist/chunk-J35DWEJX.mjs.map +1 -0
  7. package/dist/{chunk-JEAGKB4V.mjs → chunk-N4W3OMA2.mjs} +4 -4
  8. package/dist/chunk-N4W3OMA2.mjs.map +1 -0
  9. package/dist/{chunk-AXEAIXG7.mjs → chunk-NBEGX26X.mjs} +4 -4
  10. package/dist/chunk-NBEGX26X.mjs.map +1 -0
  11. package/dist/form/date-picker/date-picker.d.ts +2 -2
  12. package/dist/form/date-picker/date-picker.d.ts.map +1 -1
  13. package/dist/form/date-picker/date-picker.js +6 -6
  14. package/dist/form/date-picker/date-picker.js.map +1 -1
  15. package/dist/form/date-picker/date-picker.mjs +2 -2
  16. package/dist/form/date-picker/index.js +6 -6
  17. package/dist/form/date-picker/index.js.map +1 -1
  18. package/dist/form/date-picker/index.mjs +2 -2
  19. package/dist/form/index.js +12 -12
  20. package/dist/form/index.js.map +1 -1
  21. package/dist/form/index.mjs +5 -5
  22. package/dist/form/input/index.js +5 -5
  23. package/dist/form/input/index.js.map +1 -1
  24. package/dist/form/input/index.mjs +2 -2
  25. package/dist/form/input/input.d.ts +8 -1
  26. package/dist/form/input/input.d.ts.map +1 -1
  27. package/dist/form/input/input.js +5 -5
  28. package/dist/form/input/input.js.map +1 -1
  29. package/dist/form/input/input.mjs +2 -2
  30. package/dist/form/input-group/index.js +3 -3
  31. package/dist/form/input-group/index.js.map +1 -1
  32. package/dist/form/input-group/index.mjs +1 -1
  33. package/dist/form/input-group/input-group.d.ts +1 -1
  34. package/dist/form/input-group/input-group.d.ts.map +1 -1
  35. package/dist/form/input-group/input-group.js +3 -3
  36. package/dist/form/input-group/input-group.js.map +1 -1
  37. package/dist/form/input-group/input-group.mjs +1 -1
  38. package/dist/form/select/index.js +5 -5
  39. package/dist/form/select/index.js.map +1 -1
  40. package/dist/form/select/index.mjs +2 -2
  41. package/dist/form/select/select.d.ts +2 -2
  42. package/dist/form/select/select.d.ts.map +1 -1
  43. package/dist/form/select/select.js +5 -5
  44. package/dist/form/select/select.js.map +1 -1
  45. package/dist/form/select/select.mjs +2 -2
  46. package/dist/form/textarea/index.js +5 -5
  47. package/dist/form/textarea/index.js.map +1 -1
  48. package/dist/form/textarea/index.mjs +2 -2
  49. package/dist/form/textarea/textarea.js +5 -5
  50. package/dist/form/textarea/textarea.js.map +1 -1
  51. package/dist/form/textarea/textarea.mjs +2 -2
  52. package/dist/index.js +12 -12
  53. package/dist/index.js.map +1 -1
  54. package/dist/index.mjs +5 -5
  55. package/package.json +2 -2
  56. package/src/form/date-picker/date-picker.stories.tsx +2 -2
  57. package/src/form/date-picker/date-picker.tsx +3 -3
  58. package/src/form/input/input.stories.tsx +2 -2
  59. package/src/form/input/input.tsx +13 -3
  60. package/src/form/input-group/input-group.tsx +3 -3
  61. package/src/form/select/select.stories.tsx +2 -2
  62. package/src/form/select/select.tsx +4 -4
  63. package/src/form/textarea/textarea.stories.tsx +2 -2
  64. package/src/form/textarea/textarea.tsx +2 -2
  65. package/dist/chunk-23IZCRJA.mjs.map +0 -1
  66. package/dist/chunk-AXEAIXG7.mjs.map +0 -1
  67. package/dist/chunk-ITLZQ47H.mjs.map +0 -1
  68. package/dist/chunk-JEAGKB4V.mjs.map +0 -1
  69. package/dist/chunk-XZ43OSZ5.mjs.map +0 -1
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InputGroup
3
- } from "./chunk-XZ43OSZ5.mjs";
3
+ } from "./chunk-6OJINZ37.mjs";
4
4
  import {
5
5
  __objRest,
6
6
  __spreadProps,
@@ -12,7 +12,7 @@ import { forwardRef } from "react";
12
12
  import { clsx } from "@postenbring/hedwig-css/typed-classname";
13
13
  import { jsx } from "react/jsx-runtime";
14
14
  var Input = forwardRef(function Input2(_a, ref) {
15
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
15
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
16
16
  return /* @__PURE__ */ jsx(
17
17
  InputGroup,
18
18
  {
@@ -24,7 +24,7 @@ var Input = forwardRef(function Input2(_a, ref) {
24
24
  labelProps,
25
25
  readOnly,
26
26
  style,
27
- variant,
27
+ size,
28
28
  children: /* @__PURE__ */ jsx("input", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
29
29
  }
30
30
  );
@@ -34,4 +34,4 @@ Input.displayName = "Input";
34
34
  export {
35
35
  Input
36
36
  };
37
- //# sourceMappingURL=chunk-ITLZQ47H.mjs.map
37
+ //# sourceMappingURL=chunk-3VKESN3T.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/input/input.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup } from \"../input-group\";\nimport type { InputGroupProps } from \"../input-group\";\n\n/**\n * Omitting:\n * - `size` from InputHTMLAttributes\n * - `children` from InputGroupProps\n * The original `size` prop that input elements have is not in use in HDS.\n * It is overridden by styling.\n */\nexport type InputProps = Omit<\n InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n \"children\"\n>;\n\nexport const Input = forwardRef<HTMLInputElement, InputProps>(function Input(\n { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly, ...rest },\n ref,\n) {\n return (\n <InputGroup\n className={clsx(\"hds-input\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n size={size}\n >\n <input {...rest} disabled={disabled} readOnly={readOnly} ref={ref} />\n </InputGroup>\n );\n});\n\nInput.displayName = \"Input\";\n"],"mappings":";;;;;;;;;;AAAA,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AAgCf;AAhBC,IAAM,QAAQ,WAAyC,SAASA,OACrE,IACA,KACA;AAFA,eAAE,aAAW,MAAM,cAAc,YAAY,OAAO,IAAI,OAAO,UAAU,SAnB3E,IAmBE,IAAsF,iBAAtF,IAAsF,CAApF,aAAW,QAAM,gBAAc,cAAY,SAAO,MAAI,SAAO,YAAU;AAGzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,aAAa,SAAsB;AAAA,MACnD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA,8BAAC,0CAAU,OAAV,EAAgB,UAAoB,UAAoB,MAAU;AAAA;AAAA,EACrE;AAEJ,CAAC;AAED,MAAM,cAAc;","names":["Input"]}
@@ -16,7 +16,7 @@ var InputGroup = forwardRef(function InputGroup2(_a, ref) {
16
16
  id,
17
17
  className,
18
18
  style,
19
- variant = "default",
19
+ size = "large",
20
20
  errorMessage,
21
21
  errorMessageProps,
22
22
  labelProps: _c = {}
@@ -29,7 +29,7 @@ var InputGroup = forwardRef(function InputGroup2(_a, ref) {
29
29
  "id",
30
30
  "className",
31
31
  "style",
32
- "variant",
32
+ "size",
33
33
  "errorMessage",
34
34
  "errorMessageProps",
35
35
  "labelProps",
@@ -65,7 +65,7 @@ var InputGroup = forwardRef(function InputGroup2(_a, ref) {
65
65
  className: clsx(
66
66
  "hds-input-group",
67
67
  {
68
- [`hds-input-group--${variant}`]: variant,
68
+ [`hds-input-group--${size}`]: size,
69
69
  "hds-input-group--error": errorMessage
70
70
  },
71
71
  className
@@ -101,4 +101,4 @@ var InputGroup = forwardRef(function InputGroup2(_a, ref) {
101
101
  export {
102
102
  InputGroup
103
103
  };
104
- //# sourceMappingURL=chunk-XZ43OSZ5.mjs.map
104
+ //# sourceMappingURL=chunk-6OJINZ37.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/input-group/input-group.tsx"],"sourcesContent":["import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage, type ErrorMessageProps } from \"../error-message\";\n\ninterface InputProps {\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: boolean;\n id?: string;\n className?: string;\n}\n\nexport interface InputGroupProps {\n id?: string;\n className?: string;\n style?: CSSProperties;\n size?: \"large\" | \"small\";\n errorMessage?: ReactNode;\n errorMessageProps?: Partial<ErrorMessageProps>;\n labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n label: ReactNode;\n disabled?: boolean;\n readOnly?: boolean;\n /**\n * `children` must be either a single input element or a render function.\n *\n * If you use a render function, make sure you spread the input props to the appropriate element.\n */\n children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n {\n id,\n className,\n style,\n size = \"large\",\n errorMessage,\n errorMessageProps,\n labelProps: { className: labelClassName, ...labelProps } = {},\n label,\n disabled,\n readOnly,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n const inputId = useId();\n\n const renderInput = () => {\n const inputProps: InputProps = {\n \"aria-describedby\": errorMessage ? errorMessageId : undefined,\n \"aria-invalid\": errorMessage ? true : undefined,\n id: id ?? inputId,\n className: clsx(\"hds-input-group__input\"),\n };\n\n if (typeof children === \"function\") {\n return children(inputProps);\n }\n\n const input: ReactNode = Children.toArray(children)[0];\n\n if (!isValidElement<InputProps>(input)) {\n return;\n }\n\n return cloneElement<InputProps>(input, {\n ...inputProps,\n ...input.props,\n className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n });\n };\n\n return (\n <div\n className={clsx(\n \"hds-input-group\",\n {\n [`hds-input-group--${size}`]: size,\n \"hds-input-group--error\": errorMessage,\n },\n className as undefined,\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n <label\n className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n {...labelProps}\n htmlFor={id ?? inputId}\n >\n {label}\n </label>\n <div\n className={clsx(\"hds-input-group__input-wrapper\")}\n data-disabled={disabled}\n data-readonly={readOnly}\n >\n {renderInput()}\n </div>\n <ErrorMessage id={errorMessageId} {...errorMessageProps}>\n {errorMessage}\n </ErrorMessage>\n </div>\n );\n});\n"],"mappings":";;;;;;;;;;AAAA,SAAS,OAAO,YAAY,UAAU,gBAAgB,oBAAoB;AAE1E,SAAS,YAAY;AA2EjB,SAaE,KAbF;AA9CG,IAAM,aAAa,WAA4C,SAASA,YAC7E,IAcA,KACA;AAfA,eAOc;AAAA,IANZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,YAAY,KAA+C,CAAC;AAAA,EAvChE,IAgCE,IAOc,SAAE,aAAW,eAvC7B,IAuCgB,IAAgC,uBAAhC,IAAgC,CAA9B,eAPhB,SAQE;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EA3CJ,IAgCE,IAYK,iBAZL,IAYK;AAAA,IAXH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAKF,QAAM,iBAAiB,MAAM;AAC7B,QAAM,UAAU,MAAM;AAEtB,QAAM,cAAc,MAAM;AAnD5B,QAAAC;AAoDI,UAAM,aAAyB;AAAA,MAC7B,oBAAoB,eAAe,iBAAiB;AAAA,MACpD,gBAAgB,eAAe,OAAO;AAAA,MACtC,IAAI,kBAAM;AAAA,MACV,WAAW,KAAK,wBAAwB;AAAA,IAC1C;AAEA,QAAI,OAAO,aAAa,YAAY;AAClC,aAAO,SAAS,UAAU;AAAA,IAC5B;AAEA,UAAM,QAAmB,SAAS,QAAQ,QAAQ,EAAE,CAAC;AAErD,QAAI,CAAC,eAA2B,KAAK,GAAG;AACtC;AAAA,IACF;AAEA,WAAO,aAAyB,OAAO,gDAClC,aACA,MAAM,QAF4B;AAAA,MAGrC,WAAW,GAAG,WAAW,SAAS,KAAIA,MAAA,MAAM,MAAM,cAAZ,OAAAA,MAAyB,EAAE;AAAA,IACnE,EAAC;AAAA,EACH;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,CAAC,oBAAoB,IAAI,EAAE,GAAG;AAAA,UAC9B,0BAA0B;AAAA,QAC5B;AAAA,QACA;AAAA,MACF;AAAA,MACA;AAAA,MACA;AAAA,OACI,OAXL;AAAA,MAaC;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,0BAA0B,cAA2B;AAAA,aACjE,aAFL;AAAA,YAGC,SAAS,kBAAM;AAAA,YAEd;AAAA;AAAA,QACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,gCAAgC;AAAA,YAChD,iBAAe;AAAA,YACf,iBAAe;AAAA,YAEd,sBAAY;AAAA;AAAA,QACf;AAAA,QACA,oBAAC,6CAAa,IAAI,kBAAoB,oBAArC,EACE,yBACH;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;","names":["InputGroup","_a"]}
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InputGroup
3
- } from "./chunk-XZ43OSZ5.mjs";
3
+ } from "./chunk-6OJINZ37.mjs";
4
4
  import {
5
5
  useMergeRefs
6
6
  } from "./chunk-77M2ZTP7.mjs";
@@ -17,7 +17,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
17
17
  var DatePicker = forwardRef(function DatePicker2(_a, ref) {
18
18
  var _b = _a, {
19
19
  className,
20
- variant,
20
+ size,
21
21
  errorMessage,
22
22
  labelProps,
23
23
  label,
@@ -28,7 +28,7 @@ var DatePicker = forwardRef(function DatePicker2(_a, ref) {
28
28
  calendarButtonTitle = "\xC5pne kalender"
29
29
  } = _b, rest = __objRest(_b, [
30
30
  "className",
31
- "variant",
31
+ "size",
32
32
  "errorMessage",
33
33
  "labelProps",
34
34
  "label",
@@ -51,7 +51,7 @@ var DatePicker = forwardRef(function DatePicker2(_a, ref) {
51
51
  labelProps,
52
52
  readOnly,
53
53
  style,
54
- variant,
54
+ size,
55
55
  children: (inputProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
56
56
  /* @__PURE__ */ jsx(
57
57
  "input",
@@ -83,4 +83,4 @@ DatePicker.displayName = "DatePicker";
83
83
  export {
84
84
  DatePicker
85
85
  };
86
- //# sourceMappingURL=chunk-23IZCRJA.mjs.map
86
+ //# sourceMappingURL=chunk-J35DWEJX.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/date-picker/date-picker.tsx"],"sourcesContent":["import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n \"children\" | \"type\"\n> & {\n /**\n * Accessible title for the calendar button\n *\n * This button currently only shows in Chrome.\n *\n * @defaultValue \"Åpne kalender\"\n */\n calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n {\n className,\n size,\n errorMessage,\n labelProps,\n label,\n id,\n style,\n disabled,\n readOnly,\n calendarButtonTitle = \"Åpne kalender\",\n ...rest\n },\n ref,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRefs([inputRef, ref]);\n\n return (\n <InputGroup\n className={clsx(\"hds-date-picker\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n size={size}\n >\n {(inputProps) => (\n <>\n <input\n {...rest}\n {...inputProps}\n disabled={disabled}\n readOnly={readOnly}\n ref={mergedRef}\n type=\"date\"\n />\n <button\n className={clsx(\"hds-date-picker__calendar-button\")}\n type=\"button\"\n title={calendarButtonTitle}\n onClick={() => {\n inputRef.current?.showPicker();\n }}\n />\n </>\n )}\n </InputGroup>\n );\n});\n\nDatePicker.displayName = \"DatePicker\";\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,YAAY,cAAwC;AAC7D,SAAS,YAAY;AA4Db,mBACE,KADF;AAhCD,IAAM,aAAa,WAA8C,SAASA,YAC/E,IAaA,KACA;AAdA,eACE;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,sBAAsB;AAAA,EAxC1B,IA8BE,IAWK,iBAXL,IAWK;AAAA,IAVH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAKF,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,YAAY,aAAa,CAAC,UAAU,GAAG,CAAC;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,mBAAmB,SAAsB;AAAA,MACzD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC,WAAC,eACA,iCACE;AAAA;AAAA,UAAC;AAAA,0DACK,OACA,aAFL;AAAA,YAGC;AAAA,YACA;AAAA,YACA,KAAK;AAAA,YACL,MAAK;AAAA;AAAA,QACP;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,kCAAkC;AAAA,YAClD,MAAK;AAAA,YACL,OAAO;AAAA,YACP,SAAS,MAAM;AA1E3B,kBAAAC;AA2Ec,eAAAA,MAAA,SAAS,YAAT,gBAAAA,IAAkB;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,SACF;AAAA;AAAA,EAEJ;AAEJ,CAAC;AAED,WAAW,cAAc;","names":["DatePicker","_a"]}
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InputGroup
3
- } from "./chunk-XZ43OSZ5.mjs";
3
+ } from "./chunk-6OJINZ37.mjs";
4
4
  import {
5
5
  __objRest,
6
6
  __spreadProps,
@@ -12,7 +12,7 @@ import { forwardRef } from "react";
12
12
  import { clsx } from "@postenbring/hedwig-css/typed-classname";
13
13
  import { jsx } from "react/jsx-runtime";
14
14
  var Textarea = forwardRef(function Textarea2(_a, ref) {
15
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
15
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
16
16
  return /* @__PURE__ */ jsx(
17
17
  InputGroup,
18
18
  {
@@ -24,7 +24,7 @@ var Textarea = forwardRef(function Textarea2(_a, ref) {
24
24
  labelProps,
25
25
  readOnly,
26
26
  style,
27
- variant,
27
+ size,
28
28
  children: /* @__PURE__ */ jsx("textarea", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
29
29
  }
30
30
  );
@@ -34,4 +34,4 @@ Textarea.displayName = "Textarea";
34
34
  export {
35
35
  Textarea
36
36
  };
37
- //# sourceMappingURL=chunk-JEAGKB4V.mjs.map
37
+ //# sourceMappingURL=chunk-N4W3OMA2.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/textarea/textarea.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { TextareaHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup } from \"../input-group\";\nimport type { InputGroupProps } from \"../input-group\";\n\nexport type TextareaProps = Omit<\n InputGroupProps & TextareaHTMLAttributes<HTMLTextAreaElement>,\n \"children\"\n>;\n\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(function Textarea(\n { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly, ...rest },\n ref,\n) {\n return (\n <InputGroup\n className={clsx(\"hds-textarea\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n size={size}\n >\n <textarea {...rest} disabled={disabled} readOnly={readOnly} ref={ref} />\n </InputGroup>\n );\n});\n\nTextarea.displayName = \"Textarea\";\n"],"mappings":";;;;;;;;;;AAAA,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AAyBf;AAhBC,IAAM,WAAW,WAA+C,SAASA,UAC9E,IACA,KACA;AAFA,eAAE,aAAW,MAAM,cAAc,YAAY,OAAO,IAAI,OAAO,UAAU,SAZ3E,IAYE,IAAsF,iBAAtF,IAAsF,CAApF,aAAW,QAAM,gBAAc,cAAY,SAAO,MAAI,SAAO,YAAU;AAGzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,gBAAgB,SAAsB;AAAA,MACtD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA,8BAAC,6CAAa,OAAb,EAAmB,UAAoB,UAAoB,MAAU;AAAA;AAAA,EACxE;AAEJ,CAAC;AAED,SAAS,cAAc;","names":["Textarea"]}
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  InputGroup
3
- } from "./chunk-XZ43OSZ5.mjs";
3
+ } from "./chunk-6OJINZ37.mjs";
4
4
  import {
5
5
  __objRest,
6
6
  __spreadProps,
@@ -12,7 +12,7 @@ import { forwardRef } from "react";
12
12
  import { clsx } from "@postenbring/hedwig-css/typed-classname";
13
13
  import { jsx } from "react/jsx-runtime";
14
14
  var Select = forwardRef(function Select2(_a, ref) {
15
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
15
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
16
16
  return /* @__PURE__ */ jsx(
17
17
  InputGroup,
18
18
  {
@@ -23,7 +23,7 @@ var Select = forwardRef(function Select2(_a, ref) {
23
23
  label,
24
24
  labelProps,
25
25
  style,
26
- variant,
26
+ size,
27
27
  children: /* @__PURE__ */ jsx("select", __spreadProps(__spreadValues({}, rest), { disabled, ref, children }))
28
28
  }
29
29
  );
@@ -33,4 +33,4 @@ Select.displayName = "Select";
33
33
  export {
34
34
  Select
35
35
  };
36
- //# sourceMappingURL=chunk-AXEAIXG7.mjs.map
36
+ //# sourceMappingURL=chunk-NBEGX26X.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/form/select/select.tsx"],"sourcesContent":["import { forwardRef, type ReactNode, type SelectHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup } from \"../input-group\";\nimport type { InputGroupProps } from \"../input-group\";\n\nexport type SelectProps = Omit<\n InputGroupProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, \"size\">,\n \"readOnly\" | \"children\"\n> & { children: ReactNode };\n\nexport const Select = forwardRef<HTMLSelectElement, SelectProps>(function Select(\n { className, size, errorMessage, labelProps, label, id, style, disabled, children, ...rest },\n ref,\n) {\n return (\n <InputGroup\n className={clsx(\"hds-select\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n style={style}\n size={size}\n >\n <select {...rest} disabled={disabled} ref={ref}>\n {children}\n </select>\n </InputGroup>\n );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":";;;;;;;;;;AAAA,SAAS,kBAA6D;AACtE,SAAS,YAAY;AAwBf;AAfC,IAAM,SAAS,WAA2C,SAASA,QACxE,IACA,KACA;AAFA,eAAE,aAAW,MAAM,cAAc,YAAY,OAAO,IAAI,OAAO,UAAU,SAX3E,IAWE,IAAsF,iBAAtF,IAAsF,CAApF,aAAW,QAAM,gBAAc,cAAY,SAAO,MAAI,SAAO,YAAU;AAGzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,cAAc,SAAsB;AAAA,MACpD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEA,8BAAC,2CAAW,OAAX,EAAiB,UAAoB,KACnC,WACH;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,OAAO,cAAc;","names":["Select"]}
@@ -1,6 +1,6 @@
1
1
  import { type InputHTMLAttributes } from "react";
2
2
  import { type InputGroupProps } from "../input-group";
3
- export type DatePickerProps = Omit<InputGroupProps & InputHTMLAttributes<HTMLInputElement>, "children" | "type"> & {
3
+ export type DatePickerProps = Omit<InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, "size">, "children" | "type"> & {
4
4
  /**
5
5
  * Accessible title for the calendar button
6
6
  *
@@ -20,7 +20,7 @@ export type DatePickerProps = Omit<InputGroupProps & InputHTMLAttributes<HTMLInp
20
20
  * icon in Chrome. Firefox will show built in icon and Safari will show no icon.
21
21
  * Not tested in Edge.
22
22
  */
23
- export declare const DatePicker: import("react").ForwardRefExoticComponent<Omit<InputGroupProps & InputHTMLAttributes<HTMLInputElement>, "children" | "type"> & {
23
+ export declare const DatePicker: import("react").ForwardRefExoticComponent<Omit<InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, "size">, "children" | "type"> & {
24
24
  /**
25
25
  * Accessible title for the calendar button
26
26
  *
@@ -1 +1 @@
1
- {"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../src/form/date-picker/date-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGlE,MAAM,MAAM,eAAe,GAAG,IAAI,CAChC,eAAe,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,EACvD,UAAU,GAAG,MAAM,CACpB,GAAG;IACF;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU;IApBrB;;;;;;OAMG;0BACmB,MAAM;oDAkE5B,CAAC"}
1
+ {"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../src/form/date-picker/date-picker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGlE,MAAM,MAAM,eAAe,GAAG,IAAI,CAChC,eAAe,GAAG,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC,EACrE,UAAU,GAAG,MAAM,CACpB,GAAG;IACF;;;;;;OAMG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU;IApBrB;;;;;;OAMG;0BACmB,MAAM;oDAkE5B,CAAC"}
@@ -98,7 +98,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
98
98
  id,
99
99
  className,
100
100
  style,
101
- variant = "default",
101
+ size = "large",
102
102
  errorMessage,
103
103
  errorMessageProps,
104
104
  labelProps: _c = {}
@@ -111,7 +111,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
111
111
  "id",
112
112
  "className",
113
113
  "style",
114
- "variant",
114
+ "size",
115
115
  "errorMessage",
116
116
  "errorMessageProps",
117
117
  "labelProps",
@@ -147,7 +147,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
147
147
  className: (0, import_typed_classname2.clsx)(
148
148
  "hds-input-group",
149
149
  {
150
- [`hds-input-group--${variant}`]: variant,
150
+ [`hds-input-group--${size}`]: size,
151
151
  "hds-input-group--error": errorMessage
152
152
  },
153
153
  className
@@ -206,7 +206,7 @@ var import_jsx_runtime3 = require("react/jsx-runtime");
206
206
  var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
207
207
  var _b = _a, {
208
208
  className,
209
- variant,
209
+ size,
210
210
  errorMessage,
211
211
  labelProps,
212
212
  label,
@@ -217,7 +217,7 @@ var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
217
217
  calendarButtonTitle = "\xC5pne kalender"
218
218
  } = _b, rest = __objRest(_b, [
219
219
  "className",
220
- "variant",
220
+ "size",
221
221
  "errorMessage",
222
222
  "labelProps",
223
223
  "label",
@@ -240,7 +240,7 @@ var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
240
240
  labelProps,
241
241
  readOnly,
242
242
  style,
243
- variant,
243
+ size,
244
244
  children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
245
245
  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
246
246
  "input",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/form/date-picker/date-picker.tsx","../../../src/form/input-group/input-group.tsx","../../../src/form/error-message/error-message.tsx","../../../src/utils/utils.ts"],"sourcesContent":["import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n InputGroupProps & InputHTMLAttributes<HTMLInputElement>,\n \"children\" | \"type\"\n> & {\n /**\n * Accessible title for the calendar button\n *\n * This button currently only shows in Chrome.\n *\n * @defaultValue \"Åpne kalender\"\n */\n calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n {\n className,\n variant,\n errorMessage,\n labelProps,\n label,\n id,\n style,\n disabled,\n readOnly,\n calendarButtonTitle = \"Åpne kalender\",\n ...rest\n },\n ref,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRefs([inputRef, ref]);\n\n return (\n <InputGroup\n className={clsx(\"hds-date-picker\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n variant={variant}\n >\n {(inputProps) => (\n <>\n <input\n {...rest}\n {...inputProps}\n disabled={disabled}\n readOnly={readOnly}\n ref={mergedRef}\n type=\"date\"\n />\n <button\n className={clsx(\"hds-date-picker__calendar-button\")}\n type=\"button\"\n title={calendarButtonTitle}\n onClick={() => {\n inputRef.current?.showPicker();\n }}\n />\n </>\n )}\n </InputGroup>\n );\n});\n\nDatePicker.displayName = \"DatePicker\";\n","import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage, type ErrorMessageProps } from \"../error-message\";\n\ninterface InputProps {\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: boolean;\n id?: string;\n className?: string;\n}\n\nexport interface InputGroupProps {\n id?: string;\n className?: string;\n style?: CSSProperties;\n variant?: \"default\" | \"white\";\n errorMessage?: ReactNode;\n errorMessageProps?: Partial<ErrorMessageProps>;\n labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n label: ReactNode;\n disabled?: boolean;\n readOnly?: boolean;\n /**\n * `children` must be either a single input element or a render function.\n *\n * If you use a render function, make sure you spread the input props to the appropriate element.\n */\n children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n {\n id,\n className,\n style,\n variant = \"default\",\n errorMessage,\n errorMessageProps,\n labelProps: { className: labelClassName, ...labelProps } = {},\n label,\n disabled,\n readOnly,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n const inputId = useId();\n\n const renderInput = () => {\n const inputProps: InputProps = {\n \"aria-describedby\": errorMessage ? errorMessageId : undefined,\n \"aria-invalid\": errorMessage ? true : undefined,\n id: id ?? inputId,\n className: clsx(\"hds-input-group__input\"),\n };\n\n if (typeof children === \"function\") {\n return children(inputProps);\n }\n\n const input: ReactNode = Children.toArray(children)[0];\n\n if (!isValidElement<InputProps>(input)) {\n return;\n }\n\n return cloneElement<InputProps>(input, {\n ...inputProps,\n ...input.props,\n className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n });\n };\n\n return (\n <div\n className={clsx(\n \"hds-input-group\",\n {\n [`hds-input-group--${variant}`]: variant,\n \"hds-input-group--error\": errorMessage,\n },\n className as undefined,\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n <label\n className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n {...labelProps}\n htmlFor={id ?? inputId}\n >\n {label}\n </label>\n <div\n className={clsx(\"hds-input-group__input-wrapper\")}\n data-disabled={disabled}\n data-readonly={readOnly}\n >\n {renderInput()}\n </div>\n <ErrorMessage id={errorMessageId} {...errorMessageProps}>\n {errorMessage}\n </ErrorMessage>\n </div>\n );\n});\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nexport interface ErrorMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n id: string;\n className?: string;\n}\n\nexport const ErrorMessage = forwardRef<HTMLDivElement, ErrorMessageProps>(\n ({ children, id, className, ...rest }, ref) => {\n return (\n <div\n aria-live=\"polite\"\n className={clsx(\"hds-error-message\", className as undefined)}\n id={id}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\nErrorMessage.displayName = \"ErrorMessage\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState, version } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nfunction releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n\n/**\n * React 19 supports inert prop\n * React 18 needs inert to be a string\n */\nconst inertBooleanSupported: boolean = Number(version.split(\".\")[0]) >= 19;\n\n/**\n * Returns the inert prop value based on the React version.\n */\nexport const inertPropValue: (x: boolean) => boolean | \"\" | undefined = inertBooleanSupported\n ? (x: boolean): boolean => x\n : (x: boolean): \"\" | undefined => (x ? \"\" : undefined);\n"],"mappings":"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","names":["import_react","import_typed_classname","import_react","import_typed_classname","import_jsx_runtime","InputGroup","_a","import_react","import_jsx_runtime","DatePicker","_a"]}
1
+ {"version":3,"sources":["../../../src/form/date-picker/date-picker.tsx","../../../src/form/input-group/input-group.tsx","../../../src/form/error-message/error-message.tsx","../../../src/utils/utils.ts"],"sourcesContent":["import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n \"children\" | \"type\"\n> & {\n /**\n * Accessible title for the calendar button\n *\n * This button currently only shows in Chrome.\n *\n * @defaultValue \"Åpne kalender\"\n */\n calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n {\n className,\n size,\n errorMessage,\n labelProps,\n label,\n id,\n style,\n disabled,\n readOnly,\n calendarButtonTitle = \"Åpne kalender\",\n ...rest\n },\n ref,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRefs([inputRef, ref]);\n\n return (\n <InputGroup\n className={clsx(\"hds-date-picker\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n size={size}\n >\n {(inputProps) => (\n <>\n <input\n {...rest}\n {...inputProps}\n disabled={disabled}\n readOnly={readOnly}\n ref={mergedRef}\n type=\"date\"\n />\n <button\n className={clsx(\"hds-date-picker__calendar-button\")}\n type=\"button\"\n title={calendarButtonTitle}\n onClick={() => {\n inputRef.current?.showPicker();\n }}\n />\n </>\n )}\n </InputGroup>\n );\n});\n\nDatePicker.displayName = \"DatePicker\";\n","import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage, type ErrorMessageProps } from \"../error-message\";\n\ninterface InputProps {\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: boolean;\n id?: string;\n className?: string;\n}\n\nexport interface InputGroupProps {\n id?: string;\n className?: string;\n style?: CSSProperties;\n size?: \"large\" | \"small\";\n errorMessage?: ReactNode;\n errorMessageProps?: Partial<ErrorMessageProps>;\n labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n label: ReactNode;\n disabled?: boolean;\n readOnly?: boolean;\n /**\n * `children` must be either a single input element or a render function.\n *\n * If you use a render function, make sure you spread the input props to the appropriate element.\n */\n children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n {\n id,\n className,\n style,\n size = \"large\",\n errorMessage,\n errorMessageProps,\n labelProps: { className: labelClassName, ...labelProps } = {},\n label,\n disabled,\n readOnly,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n const inputId = useId();\n\n const renderInput = () => {\n const inputProps: InputProps = {\n \"aria-describedby\": errorMessage ? errorMessageId : undefined,\n \"aria-invalid\": errorMessage ? true : undefined,\n id: id ?? inputId,\n className: clsx(\"hds-input-group__input\"),\n };\n\n if (typeof children === \"function\") {\n return children(inputProps);\n }\n\n const input: ReactNode = Children.toArray(children)[0];\n\n if (!isValidElement<InputProps>(input)) {\n return;\n }\n\n return cloneElement<InputProps>(input, {\n ...inputProps,\n ...input.props,\n className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n });\n };\n\n return (\n <div\n className={clsx(\n \"hds-input-group\",\n {\n [`hds-input-group--${size}`]: size,\n \"hds-input-group--error\": errorMessage,\n },\n className as undefined,\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n <label\n className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n {...labelProps}\n htmlFor={id ?? inputId}\n >\n {label}\n </label>\n <div\n className={clsx(\"hds-input-group__input-wrapper\")}\n data-disabled={disabled}\n data-readonly={readOnly}\n >\n {renderInput()}\n </div>\n <ErrorMessage id={errorMessageId} {...errorMessageProps}>\n {errorMessage}\n </ErrorMessage>\n </div>\n );\n});\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nexport interface ErrorMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n id: string;\n className?: string;\n}\n\nexport const ErrorMessage = forwardRef<HTMLDivElement, ErrorMessageProps>(\n ({ children, id, className, ...rest }, ref) => {\n return (\n <div\n aria-live=\"polite\"\n className={clsx(\"hds-error-message\", className as undefined)}\n id={id}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\nErrorMessage.displayName = \"ErrorMessage\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState, version } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nfunction releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n\n/**\n * React 19 supports inert prop\n * React 18 needs inert to be a string\n */\nconst inertBooleanSupported: boolean = Number(version.split(\".\")[0]) >= 19;\n\n/**\n * Returns the inert prop value based on the React version.\n */\nexport const inertPropValue: (x: boolean) => boolean | \"\" | undefined = inertBooleanSupported\n ? (x: boolean): boolean => x\n : (x: boolean): \"\" | undefined => (x ? \"\" : undefined);\n"],"mappings":"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","names":["import_react","import_typed_classname","import_react","import_typed_classname","import_jsx_runtime","InputGroup","_a","import_react","import_jsx_runtime","DatePicker","_a"]}
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  DatePicker
3
- } from "../../chunk-23IZCRJA.mjs";
3
+ } from "../../chunk-J35DWEJX.mjs";
4
4
  import "../../chunk-Y5SUMFYJ.mjs";
5
- import "../../chunk-XZ43OSZ5.mjs";
5
+ import "../../chunk-6OJINZ37.mjs";
6
6
  import "../../chunk-NSLSA7F7.mjs";
7
7
  import "../../chunk-LHIG6RW7.mjs";
8
8
  import "../../chunk-77M2ZTP7.mjs";
@@ -100,7 +100,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
100
100
  id,
101
101
  className,
102
102
  style,
103
- variant = "default",
103
+ size = "large",
104
104
  errorMessage,
105
105
  errorMessageProps,
106
106
  labelProps: _c = {}
@@ -113,7 +113,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
113
113
  "id",
114
114
  "className",
115
115
  "style",
116
- "variant",
116
+ "size",
117
117
  "errorMessage",
118
118
  "errorMessageProps",
119
119
  "labelProps",
@@ -149,7 +149,7 @@ var InputGroup = (0, import_react2.forwardRef)(function InputGroup2(_a, ref) {
149
149
  className: (0, import_typed_classname2.clsx)(
150
150
  "hds-input-group",
151
151
  {
152
- [`hds-input-group--${variant}`]: variant,
152
+ [`hds-input-group--${size}`]: size,
153
153
  "hds-input-group--error": errorMessage
154
154
  },
155
155
  className
@@ -208,7 +208,7 @@ var import_jsx_runtime3 = require("react/jsx-runtime");
208
208
  var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
209
209
  var _b = _a, {
210
210
  className,
211
- variant,
211
+ size,
212
212
  errorMessage,
213
213
  labelProps,
214
214
  label,
@@ -219,7 +219,7 @@ var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
219
219
  calendarButtonTitle = "\xC5pne kalender"
220
220
  } = _b, rest = __objRest(_b, [
221
221
  "className",
222
- "variant",
222
+ "size",
223
223
  "errorMessage",
224
224
  "labelProps",
225
225
  "label",
@@ -242,7 +242,7 @@ var DatePicker = (0, import_react4.forwardRef)(function DatePicker2(_a, ref) {
242
242
  labelProps,
243
243
  readOnly,
244
244
  style,
245
- variant,
245
+ size,
246
246
  children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
247
247
  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
248
248
  "input",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/form/date-picker/index.tsx","../../../src/form/date-picker/date-picker.tsx","../../../src/form/input-group/input-group.tsx","../../../src/form/error-message/error-message.tsx","../../../src/utils/utils.ts"],"sourcesContent":["export { DatePicker } from \"./date-picker\";\nexport type * from \"./date-picker\";\n","import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n InputGroupProps & InputHTMLAttributes<HTMLInputElement>,\n \"children\" | \"type\"\n> & {\n /**\n * Accessible title for the calendar button\n *\n * This button currently only shows in Chrome.\n *\n * @defaultValue \"Åpne kalender\"\n */\n calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n {\n className,\n variant,\n errorMessage,\n labelProps,\n label,\n id,\n style,\n disabled,\n readOnly,\n calendarButtonTitle = \"Åpne kalender\",\n ...rest\n },\n ref,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRefs([inputRef, ref]);\n\n return (\n <InputGroup\n className={clsx(\"hds-date-picker\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n variant={variant}\n >\n {(inputProps) => (\n <>\n <input\n {...rest}\n {...inputProps}\n disabled={disabled}\n readOnly={readOnly}\n ref={mergedRef}\n type=\"date\"\n />\n <button\n className={clsx(\"hds-date-picker__calendar-button\")}\n type=\"button\"\n title={calendarButtonTitle}\n onClick={() => {\n inputRef.current?.showPicker();\n }}\n />\n </>\n )}\n </InputGroup>\n );\n});\n\nDatePicker.displayName = \"DatePicker\";\n","import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage, type ErrorMessageProps } from \"../error-message\";\n\ninterface InputProps {\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: boolean;\n id?: string;\n className?: string;\n}\n\nexport interface InputGroupProps {\n id?: string;\n className?: string;\n style?: CSSProperties;\n variant?: \"default\" | \"white\";\n errorMessage?: ReactNode;\n errorMessageProps?: Partial<ErrorMessageProps>;\n labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n label: ReactNode;\n disabled?: boolean;\n readOnly?: boolean;\n /**\n * `children` must be either a single input element or a render function.\n *\n * If you use a render function, make sure you spread the input props to the appropriate element.\n */\n children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n {\n id,\n className,\n style,\n variant = \"default\",\n errorMessage,\n errorMessageProps,\n labelProps: { className: labelClassName, ...labelProps } = {},\n label,\n disabled,\n readOnly,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n const inputId = useId();\n\n const renderInput = () => {\n const inputProps: InputProps = {\n \"aria-describedby\": errorMessage ? errorMessageId : undefined,\n \"aria-invalid\": errorMessage ? true : undefined,\n id: id ?? inputId,\n className: clsx(\"hds-input-group__input\"),\n };\n\n if (typeof children === \"function\") {\n return children(inputProps);\n }\n\n const input: ReactNode = Children.toArray(children)[0];\n\n if (!isValidElement<InputProps>(input)) {\n return;\n }\n\n return cloneElement<InputProps>(input, {\n ...inputProps,\n ...input.props,\n className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n });\n };\n\n return (\n <div\n className={clsx(\n \"hds-input-group\",\n {\n [`hds-input-group--${variant}`]: variant,\n \"hds-input-group--error\": errorMessage,\n },\n className as undefined,\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n <label\n className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n {...labelProps}\n htmlFor={id ?? inputId}\n >\n {label}\n </label>\n <div\n className={clsx(\"hds-input-group__input-wrapper\")}\n data-disabled={disabled}\n data-readonly={readOnly}\n >\n {renderInput()}\n </div>\n <ErrorMessage id={errorMessageId} {...errorMessageProps}>\n {errorMessage}\n </ErrorMessage>\n </div>\n );\n});\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nexport interface ErrorMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n id: string;\n className?: string;\n}\n\nexport const ErrorMessage = forwardRef<HTMLDivElement, ErrorMessageProps>(\n ({ children, id, className, ...rest }, ref) => {\n return (\n <div\n aria-live=\"polite\"\n className={clsx(\"hds-error-message\", className as undefined)}\n id={id}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\nErrorMessage.displayName = \"ErrorMessage\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState, version } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nfunction releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n\n/**\n * React 19 supports inert prop\n * React 18 needs inert to be a string\n */\nconst inertBooleanSupported: boolean = Number(version.split(\".\")[0]) >= 19;\n\n/**\n * Returns the inert prop value based on the React version.\n */\nexport const inertPropValue: (x: boolean) => boolean | \"\" | undefined = inertBooleanSupported\n ? (x: boolean): boolean => x\n : (x: boolean): \"\" | undefined => (x ? \"\" : undefined);\n"],"mappings":"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","names":["import_react","import_typed_classname","import_react","import_typed_classname","import_jsx_runtime","InputGroup","_a","import_react","import_jsx_runtime","DatePicker","_a"]}
1
+ {"version":3,"sources":["../../../src/form/date-picker/index.tsx","../../../src/form/date-picker/date-picker.tsx","../../../src/form/input-group/input-group.tsx","../../../src/form/error-message/error-message.tsx","../../../src/utils/utils.ts"],"sourcesContent":["export { DatePicker } from \"./date-picker\";\nexport type * from \"./date-picker\";\n","import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n InputGroupProps & Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n \"children\" | \"type\"\n> & {\n /**\n * Accessible title for the calendar button\n *\n * This button currently only shows in Chrome.\n *\n * @defaultValue \"Åpne kalender\"\n */\n calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n {\n className,\n size,\n errorMessage,\n labelProps,\n label,\n id,\n style,\n disabled,\n readOnly,\n calendarButtonTitle = \"Åpne kalender\",\n ...rest\n },\n ref,\n) {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRefs([inputRef, ref]);\n\n return (\n <InputGroup\n className={clsx(\"hds-date-picker\", className as undefined)}\n disabled={disabled}\n errorMessage={errorMessage}\n id={id}\n label={label}\n labelProps={labelProps}\n readOnly={readOnly}\n style={style}\n size={size}\n >\n {(inputProps) => (\n <>\n <input\n {...rest}\n {...inputProps}\n disabled={disabled}\n readOnly={readOnly}\n ref={mergedRef}\n type=\"date\"\n />\n <button\n className={clsx(\"hds-date-picker__calendar-button\")}\n type=\"button\"\n title={calendarButtonTitle}\n onClick={() => {\n inputRef.current?.showPicker();\n }}\n />\n </>\n )}\n </InputGroup>\n );\n});\n\nDatePicker.displayName = \"DatePicker\";\n","import { useId, forwardRef, Children, isValidElement, cloneElement } from \"react\";\nimport type { LabelHTMLAttributes, ReactNode, CSSProperties } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { ErrorMessage, type ErrorMessageProps } from \"../error-message\";\n\ninterface InputProps {\n \"aria-describedby\"?: string;\n \"aria-invalid\"?: boolean;\n id?: string;\n className?: string;\n}\n\nexport interface InputGroupProps {\n id?: string;\n className?: string;\n style?: CSSProperties;\n size?: \"large\" | \"small\";\n errorMessage?: ReactNode;\n errorMessageProps?: Partial<ErrorMessageProps>;\n labelProps?: LabelHTMLAttributes<HTMLLabelElement>;\n label: ReactNode;\n disabled?: boolean;\n readOnly?: boolean;\n /**\n * `children` must be either a single input element or a render function.\n *\n * If you use a render function, make sure you spread the input props to the appropriate element.\n */\n children: Exclude<ReactNode, Iterable<ReactNode>> | ((inputProps: InputProps) => ReactNode);\n}\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(function InputGroup(\n {\n id,\n className,\n style,\n size = \"large\",\n errorMessage,\n errorMessageProps,\n labelProps: { className: labelClassName, ...labelProps } = {},\n label,\n disabled,\n readOnly,\n children,\n ...rest\n },\n ref,\n) {\n const errorMessageId = useId();\n const inputId = useId();\n\n const renderInput = () => {\n const inputProps: InputProps = {\n \"aria-describedby\": errorMessage ? errorMessageId : undefined,\n \"aria-invalid\": errorMessage ? true : undefined,\n id: id ?? inputId,\n className: clsx(\"hds-input-group__input\"),\n };\n\n if (typeof children === \"function\") {\n return children(inputProps);\n }\n\n const input: ReactNode = Children.toArray(children)[0];\n\n if (!isValidElement<InputProps>(input)) {\n return;\n }\n\n return cloneElement<InputProps>(input, {\n ...inputProps,\n ...input.props,\n className: `${inputProps.className} ${input.props.className ?? \"\"}`,\n });\n };\n\n return (\n <div\n className={clsx(\n \"hds-input-group\",\n {\n [`hds-input-group--${size}`]: size,\n \"hds-input-group--error\": errorMessage,\n },\n className as undefined,\n )}\n ref={ref}\n style={style}\n {...rest}\n >\n <label\n className={clsx(\"hds-input-group__label\", labelClassName as undefined)}\n {...labelProps}\n htmlFor={id ?? inputId}\n >\n {label}\n </label>\n <div\n className={clsx(\"hds-input-group__input-wrapper\")}\n data-disabled={disabled}\n data-readonly={readOnly}\n >\n {renderInput()}\n </div>\n <ErrorMessage id={errorMessageId} {...errorMessageProps}>\n {errorMessage}\n </ErrorMessage>\n </div>\n );\n});\n","import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { forwardRef, type ReactNode } from \"react\";\n\nexport interface ErrorMessageProps extends React.HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n id: string;\n className?: string;\n}\n\nexport const ErrorMessage = forwardRef<HTMLDivElement, ErrorMessageProps>(\n ({ children, id, className, ...rest }, ref) => {\n return (\n <div\n aria-live=\"polite\"\n className={clsx(\"hds-error-message\", className as undefined)}\n id={id}\n ref={ref}\n {...rest}\n >\n {children}\n </div>\n );\n },\n);\nErrorMessage.displayName = \"ErrorMessage\";\n","import * as React from \"react\";\nimport { useCallback, useEffect, useState, version } from \"react\";\n\n/**\n * Merges an array of refs into a single memoized callback ref or `null`.\n * @see https://floating-ui.com/docs/useMergeRefs\n */\nexport function useMergeRefs<Instance>(\n refs: (React.Ref<Instance> | undefined)[],\n): React.RefCallback<Instance> | null {\n return React.useMemo(() => {\n if (refs.every((ref) => ref === null)) {\n return null;\n }\n\n return (value) => {\n refs.forEach((ref) => {\n if (typeof ref === \"function\") {\n ref(value);\n } else if (ref !== null) {\n (ref as React.MutableRefObject<Instance | null>).current = value;\n }\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, refs);\n}\n\nexport function useResize<Instance extends HTMLElement>(\n ref: React.RefObject<Instance> | undefined | null,\n): { width: number; height: number } {\n const [width, setWidth] = useState<number>(0);\n const [height, setHeight] = useState<number>(0);\n const handleResize = useCallback(() => {\n if (ref?.current !== null) {\n setWidth(ref?.current?.offsetWidth ?? 0);\n setHeight(ref?.current?.offsetHeight ?? 0);\n }\n }, [ref]);\n useEffect(() => {\n window.addEventListener(\"load\", handleResize);\n window.addEventListener(\"resize\", handleResize);\n return () => {\n window.removeEventListener(\"load\", handleResize);\n window.removeEventListener(\"resize\", handleResize);\n };\n }, [ref, handleResize]);\n useEffect(() => {\n handleResize();\n // eslint-disable-next-line react-hooks/exhaustive-deps -- It's ok\n }, []);\n return { width, height };\n}\n\nfunction subscribe() {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- It's ok\n return () => {};\n}\n\nexport function useHydrated() {\n return React.useSyncExternalStore(\n subscribe,\n () => true,\n () => false,\n );\n}\n\n/**\n * Trap focus inside an element using the `inert` attribute.\n *\n * Adds `inert` to all siblings of the given element, and all their ancestors up to the body.\n * Returns a cleanup function which removes the `inert` property from the elements, effectively giving focus back to rest of the document.\n *\n * NOTE: Does not support portals, i.e. elements outside the DOM hierarchy of the given element.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert\n * @see https://web.dev/articles/inert\n */\nexport function focusTrap(element: HTMLElement) {\n // eslint-disable-next-line @typescript-eslint/no-empty-function -- NOP on focus trapping the body element\n if (element === document.body) return () => {};\n\n let inertElements: HTMLElement[] = [];\n for (let el: HTMLElement | null = element; el; el = el.parentElement) {\n if (el === document.body) break;\n\n for (const sibling of el.parentElement?.children ?? []) {\n if (sibling === el) continue;\n if (!(sibling instanceof HTMLElement)) continue;\n if (sibling.hasAttribute(\"inert\")) continue;\n\n sibling.setAttribute(\"inert\", \"true\");\n inertElements.push(sibling);\n }\n }\n\n return () => {\n releaseFocusTrap(inertElements);\n inertElements = [];\n };\n}\n\n/**\n * Unset the `inert` attribute on all elements given\n */\nfunction releaseFocusTrap(inertElements: Iterable<HTMLElement>) {\n for (const el of inertElements) {\n el.removeAttribute(\"inert\");\n }\n}\n\n/**\n * React 19 supports inert prop\n * React 18 needs inert to be a string\n */\nconst inertBooleanSupported: boolean = Number(version.split(\".\")[0]) >= 19;\n\n/**\n * Returns the inert prop value based on the React version.\n */\nexport const inertPropValue: (x: boolean) => boolean | \"\" | undefined = inertBooleanSupported\n ? (x: boolean): boolean => x\n : (x: boolean): \"\" | undefined => (x ? \"\" : undefined);\n"],"mappings":"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","names":["import_react","import_typed_classname","import_react","import_typed_classname","import_jsx_runtime","InputGroup","_a","import_react","import_jsx_runtime","DatePicker","_a"]}
@@ -1,9 +1,9 @@
1
1
  import "../../chunk-TDLSHJ4Z.mjs";
2
2
  import {
3
3
  DatePicker
4
- } from "../../chunk-23IZCRJA.mjs";
4
+ } from "../../chunk-J35DWEJX.mjs";
5
5
  import "../../chunk-Y5SUMFYJ.mjs";
6
- import "../../chunk-XZ43OSZ5.mjs";
6
+ import "../../chunk-6OJINZ37.mjs";
7
7
  import "../../chunk-NSLSA7F7.mjs";
8
8
  import "../../chunk-LHIG6RW7.mjs";
9
9
  import "../../chunk-77M2ZTP7.mjs";
@@ -228,7 +228,7 @@ var InputGroup = (0, import_react4.forwardRef)(function InputGroup2(_a, ref) {
228
228
  id,
229
229
  className,
230
230
  style,
231
- variant = "default",
231
+ size = "large",
232
232
  errorMessage,
233
233
  errorMessageProps,
234
234
  labelProps: _c = {}
@@ -241,7 +241,7 @@ var InputGroup = (0, import_react4.forwardRef)(function InputGroup2(_a, ref) {
241
241
  "id",
242
242
  "className",
243
243
  "style",
244
- "variant",
244
+ "size",
245
245
  "errorMessage",
246
246
  "errorMessageProps",
247
247
  "labelProps",
@@ -277,7 +277,7 @@ var InputGroup = (0, import_react4.forwardRef)(function InputGroup2(_a, ref) {
277
277
  className: (0, import_typed_classname4.clsx)(
278
278
  "hds-input-group",
279
279
  {
280
- [`hds-input-group--${variant}`]: variant,
280
+ [`hds-input-group--${size}`]: size,
281
281
  "hds-input-group--error": errorMessage
282
282
  },
283
283
  className
@@ -336,7 +336,7 @@ var import_jsx_runtime5 = require("react/jsx-runtime");
336
336
  var DatePicker = (0, import_react6.forwardRef)(function DatePicker2(_a, ref) {
337
337
  var _b = _a, {
338
338
  className,
339
- variant,
339
+ size,
340
340
  errorMessage,
341
341
  labelProps,
342
342
  label,
@@ -347,7 +347,7 @@ var DatePicker = (0, import_react6.forwardRef)(function DatePicker2(_a, ref) {
347
347
  calendarButtonTitle = "\xC5pne kalender"
348
348
  } = _b, rest = __objRest(_b, [
349
349
  "className",
350
- "variant",
350
+ "size",
351
351
  "errorMessage",
352
352
  "labelProps",
353
353
  "label",
@@ -370,7 +370,7 @@ var DatePicker = (0, import_react6.forwardRef)(function DatePicker2(_a, ref) {
370
370
  labelProps,
371
371
  readOnly,
372
372
  style,
373
- variant,
373
+ size,
374
374
  children: (inputProps) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
375
375
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
376
376
  "input",
@@ -653,7 +653,7 @@ var import_react11 = require("react");
653
653
  var import_typed_classname10 = require("@postenbring/hedwig-css/typed-classname");
654
654
  var import_jsx_runtime10 = require("react/jsx-runtime");
655
655
  var Input = (0, import_react11.forwardRef)(function Input2(_a, ref) {
656
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
656
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
657
657
  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
658
658
  InputGroup,
659
659
  {
@@ -665,7 +665,7 @@ var Input = (0, import_react11.forwardRef)(function Input2(_a, ref) {
665
665
  labelProps,
666
666
  readOnly,
667
667
  style,
668
- variant,
668
+ size,
669
669
  children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("input", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
670
670
  }
671
671
  );
@@ -770,7 +770,7 @@ var import_react14 = require("react");
770
770
  var import_typed_classname12 = require("@postenbring/hedwig-css/typed-classname");
771
771
  var import_jsx_runtime13 = require("react/jsx-runtime");
772
772
  var Select = (0, import_react14.forwardRef)(function Select2(_a, ref) {
773
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
773
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, children } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "children"]);
774
774
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
775
775
  InputGroup,
776
776
  {
@@ -781,7 +781,7 @@ var Select = (0, import_react14.forwardRef)(function Select2(_a, ref) {
781
781
  label,
782
782
  labelProps,
783
783
  style,
784
- variant,
784
+ size,
785
785
  children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("select", __spreadProps(__spreadValues({}, rest), { disabled, ref, children }))
786
786
  }
787
787
  );
@@ -793,7 +793,7 @@ var import_react15 = require("react");
793
793
  var import_typed_classname13 = require("@postenbring/hedwig-css/typed-classname");
794
794
  var import_jsx_runtime14 = require("react/jsx-runtime");
795
795
  var Textarea = (0, import_react15.forwardRef)(function Textarea2(_a, ref) {
796
- var _b = _a, { className, variant, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "variant", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
796
+ var _b = _a, { className, size, errorMessage, labelProps, label, id, style, disabled, readOnly } = _b, rest = __objRest(_b, ["className", "size", "errorMessage", "labelProps", "label", "id", "style", "disabled", "readOnly"]);
797
797
  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
798
798
  InputGroup,
799
799
  {
@@ -805,7 +805,7 @@ var Textarea = (0, import_react15.forwardRef)(function Textarea2(_a, ref) {
805
805
  labelProps,
806
806
  readOnly,
807
807
  style,
808
- variant,
808
+ size,
809
809
  children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("textarea", __spreadProps(__spreadValues({}, rest), { disabled, readOnly, ref }))
810
810
  }
811
811
  );