@coopdigital/react 0.56.0 → 0.57.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.
@@ -92,6 +92,7 @@ const DatePicker = ({ className, closeOnSelect = true, dateFormat = "dd/MM/yyyy"
92
92
  const resetState = useCallback(() => setState({ ...initialState, [mode]: undefined }), [mode]);
93
93
  const componentProps = {
94
94
  className: clsx("coop-datepicker", className),
95
+ "data-disabled": disabled !== null && disabled !== void 0 ? disabled : undefined,
95
96
  "data-error": error || undefined,
96
97
  "data-mode": mode,
97
98
  ...props,
@@ -119,7 +120,7 @@ const DatePicker = ({ className, closeOnSelect = true, dateFormat = "dd/MM/yyyy"
119
120
  };
120
121
  return (jsxs("div", { ...componentProps, children: [jsxs(Popover, { onOpenChange: setOpen, open: state.open, children: [jsx(Popover.Anchor, { className: "coop-datepicker-inner", children: jsx(TextInput, { autoComplete: "off", className: "coop-datepicker-input", disabled: disabled, id: uid + componentConfig.fieldSuffix,
121
122
  //maxLength={dateFormat.length}
122
- name: name + componentConfig.fieldSuffix, onChange: updateFromInput, placeholder: getPlaceholder(), ref: ref, required: required, size: size, suffix: jsx(Popover.Trigger, { "aria-label": "Choose date", className: "coop-datepicker-trigger", children: jsx(CalendarIcon, { width: 24 }) }), suffixInline: true, value: (_f = (_e = state === null || state === void 0 ? void 0 : state[mode]) === null || _e === void 0 ? void 0 : _e.input) !== null && _f !== void 0 ? _f : "" }) }), jsxs(Popover.Content, { "aria-label": "Date picker", className: "coop-datepicker-calendar bg-white", collisionPadding: 16, sideOffset: 4, children: [jsx(Calendar
123
+ name: name + componentConfig.fieldSuffix, onChange: updateFromInput, placeholder: getPlaceholder(), ref: ref, required: required, size: size, suffix: disabled ? (jsx("span", { className: "coop-datepicker-trigger", children: jsx(CalendarIcon, { width: 24 }) })) : (jsx(Popover.Trigger, { "aria-label": "Choose date", className: "coop-datepicker-trigger", children: jsx(CalendarIcon, { width: 24 }) })), suffixInline: true, value: (_f = (_e = state === null || state === void 0 ? void 0 : state[mode]) === null || _e === void 0 ? void 0 : _e.input) !== null && _f !== void 0 ? _f : "" }) }), jsxs(Popover.Content, { "aria-label": "Date picker", className: "coop-datepicker-calendar bg-white", collisionPadding: 16, sideOffset: 4, children: [jsx(Calendar
123
124
  // jsx-ally throws here because we set autoFocus, but this
124
125
  // is not a standard element. Daypicker uses this value to
125
126
  // focus the day rather than the nav when it renders.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@coopdigital/react",
3
3
  "type": "module",
4
- "version": "0.56.0",
4
+ "version": "0.57.0",
5
5
  "private": false,
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -60,10 +60,10 @@
60
60
  "devDependencies": {
61
61
  "@axe-core/playwright": "^4.11.1",
62
62
  "@playwright/test": "^1.58.2",
63
- "@storybook/addon-a11y": "^10.2.16",
64
- "@storybook/addon-docs": "^10.2.16",
65
- "@storybook/addon-onboarding": "^10.2.16",
66
- "@storybook/react-vite": "^10.2.16",
63
+ "@storybook/addon-a11y": "^10.2.17",
64
+ "@storybook/addon-docs": "^10.2.17",
65
+ "@storybook/addon-onboarding": "^10.2.17",
66
+ "@storybook/react-vite": "^10.2.17",
67
67
  "@testing-library/jest-dom": "^6.9.1",
68
68
  "@testing-library/react": "^16.3.2",
69
69
  "@types/react": "^19.2.14",
@@ -72,7 +72,7 @@
72
72
  "react-dom": "^19.2.4",
73
73
  "resize-observer-polyfill": "^1.5.1",
74
74
  "serve": "^14.2.6",
75
- "storybook": "^10.2.16",
75
+ "storybook": "^10.2.17",
76
76
  "storybook-addon-tag-badges": "^3.0.6"
77
77
  },
78
78
  "peerDependencies": {
@@ -83,10 +83,10 @@
83
83
  "storybook": "$storybook"
84
84
  },
85
85
  "dependencies": {
86
- "@coopdigital/styles": "^0.46.1",
86
+ "@coopdigital/styles": "^0.47.0",
87
87
  "@radix-ui/react-popover": "^1.1.15",
88
88
  "clsx": "^2.1.1",
89
89
  "react-day-picker": "^9.12.0"
90
90
  },
91
- "gitHead": "fc079482ba56be244f761f526c2b79a5da2d3bb0"
91
+ "gitHead": "317b2f6af79b7aa2362a87303b887160e08f95d4"
92
92
  }
@@ -250,6 +250,7 @@ export const DatePicker = ({
250
250
 
251
251
  const componentProps = {
252
252
  className: clsx("coop-datepicker", className),
253
+ "data-disabled": disabled ?? undefined,
253
254
  "data-error": error || undefined,
254
255
  "data-mode": mode,
255
256
  ...props,
@@ -300,9 +301,15 @@ export const DatePicker = ({
300
301
  required={required}
301
302
  size={size}
302
303
  suffix={
303
- <Popover.Trigger aria-label="Choose date" className="coop-datepicker-trigger">
304
- <CalendarIcon width={24} />
305
- </Popover.Trigger>
304
+ disabled ? (
305
+ <span className="coop-datepicker-trigger">
306
+ <CalendarIcon width={24} />
307
+ </span>
308
+ ) : (
309
+ <Popover.Trigger aria-label="Choose date" className="coop-datepicker-trigger">
310
+ <CalendarIcon width={24} />
311
+ </Popover.Trigger>
312
+ )
306
313
  }
307
314
  suffixInline={true}
308
315
  value={state?.[mode]?.input ?? ""}