@jobber/components 7.2.0 → 7.4.0

package/dist/FormField/index.mjs

@@ -5,8 +5,8 @@ import 'framer-motion';
 import '@jobber/design';
 import 'classnames';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '../Typography-es.js';
 import '../Text-es.js';

package/dist/InputPassword/index.cjs

@@ -8,8 +8,8 @@ require('framer-motion');
 require('@jobber/design');
 require('classnames');
 require('../Button-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('../Typography-cjs.js');
 require('../Text-cjs.js');

package/dist/InputPassword/index.mjs

@@ -6,8 +6,8 @@ import 'framer-motion';
 import '@jobber/design';
 import 'classnames';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '../Typography-es.js';
 import '../Text-es.js';

package/dist/LightBox/index.cjs

@@ -10,8 +10,8 @@ require('../noop-cjs.js');
 require('../_commonjsHelpers-cjs.js');
 require('../ButtonDismiss-cjs.js');
 require('../Button-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('@jobber/design');
 require('../Typography-cjs.js');

package/dist/LightBox/index.mjs

@@ -8,8 +8,8 @@ import '../noop-es.js';
 import '../_commonjsHelpers-es.js';
 import '../ButtonDismiss-es.js';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '@jobber/design';
 import '../Typography-es.js';

package/dist/Menu/index.cjs

@@ -14,8 +14,8 @@ require('../Text-cjs2.js');
 require('../clsx-cjs.js');
 require('../index-cjs.js');
 require('../Button-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('@jobber/design');
 require('../Typography-cjs.js');

package/dist/Menu/index.mjs

@@ -12,8 +12,8 @@ import '../Text-es2.js';
 import '../clsx-es.js';
 import '../index-es.js';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '@jobber/design';
 import '../Typography-es.js';

package/dist/Modal/index.cjs

@@ -13,8 +13,8 @@ var floatingUi_react = require('../floating-ui.react-cjs.js');
 var identity = require('../identity-cjs.js');
 var AtlantisPortalContent = require('../AtlantisPortalContent-cjs.js');
 require('../Typography-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('@jobber/design');
 require('../_commonjsHelpers-cjs.js');

package/dist/Modal/index.mjs

@@ -11,8 +11,8 @@ import { b as useFloatingNodeId, u as useFloating, c as useDismiss, g as useRole
 import { b as identity } from '../identity-es.js';
 import { A as AtlantisPortalContent } from '../AtlantisPortalContent-es.js';
 import '../Typography-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '@jobber/design';
 import '../_commonjsHelpers-es.js';

package/dist/MultiSelect/index.cjs

@@ -3,9 +3,7 @@
 var MultiSelect = require('../MultiSelect-cjs.js');
 require('react');
 require('classnames');
-require('../Checkbox/index.cjs');
-require('../tslib.es6-cjs.js');
-require('react-hook-form');
+require('../Checkbox-cjs.js');
 require('../Icon-cjs.js');
 require('@jobber/design');
 require('../Text-cjs.js');

package/dist/MultiSelect/index.mjs

@@ -1,9 +1,7 @@
 export { M as MultiSelect } from '../MultiSelect-es.js';
 import 'react';
 import 'classnames';
-import '../Checkbox/index.mjs';
-import '../tslib.es6-es.js';
-import 'react-hook-form';
+import '../Checkbox-es.js';
 import '../Icon-es.js';
 import '@jobber/design';
 import '../Text-es.js';

package/dist/MultiSelect-cjs.js

@@ -2,7 +2,7 @@
 
 var React = require('react');
 var classnames = require('classnames');
-var Checkbox_index = require('./Checkbox/index.cjs');
+var Checkbox = require('./Checkbox-cjs.js');
 var Text = require('./Text-cjs.js');
 var Icon = require('./Icon-cjs.js');
 
@@ -81,7 +81,7 @@ function DropDownMenu({ options, setOptions }) {
                 event.preventDefault();
                 handleOptionClick(option);
             }, onMouseOver: e => handleOptionHover(e, index) },
-            React.createElement(Checkbox_index.Checkbox, { label: option.label, checked: option.checked, onFocus: () => setHighlightedIndex(index) })));
+            React.createElement(Checkbox.Checkbox, { label: option.label, checked: option.checked, onFocus: () => setHighlightedIndex(index) })));
     })));
     function handlePressUp(event) {
         event.preventDefault();

package/dist/MultiSelect-es.js

@@ -1,6 +1,6 @@
 import React__default, { useState, useRef, useCallback, useEffect } from 'react';
 import classnames from 'classnames';
-import { Checkbox } from './Checkbox/index.mjs';
+import { C as Checkbox } from './Checkbox-es.js';
 import { T as Text } from './Text-es.js';
 import { I as Icon } from './Icon-es.js';
 

package/dist/RecurringSelect/index.cjs

@@ -24,8 +24,8 @@ require('@jobber/hooks');
 require('framer-motion');
 require('@jobber/design');
 require('../Button-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('../useFormFieldFocus-cjs.js');
 require('../InputValidation-cjs.js');

package/dist/RecurringSelect/index.mjs

@@ -22,8 +22,8 @@ import '@jobber/hooks';
 import 'framer-motion';
 import '@jobber/design';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '../useFormFieldFocus-es.js';
 import '../InputValidation-es.js';

package/dist/SideDrawer/index.cjs

@@ -10,8 +10,8 @@ require('@jobber/design');
 require('../Heading-cjs.js');
 require('../Typography-cjs.js');
 require('../Button-cjs.js');
-require('react-router-dom');
 require('../tslib.es6-cjs.js');
+require('react-router-dom');
 require('../Icon-cjs.js');
 require('../Flex-cjs.js');
 

package/dist/SideDrawer/index.mjs

@@ -8,7 +8,7 @@ import '@jobber/design';
 import '../Heading-es.js';
 import '../Typography-es.js';
 import '../Button-es.js';
-import 'react-router-dom';
 import '../tslib.es6-es.js';
+import 'react-router-dom';
 import '../Icon-es.js';
 import '../Flex-es.js';

package/dist/Toast/index.cjs

@@ -7,9 +7,9 @@ require('framer-motion');
 require('../Icon-cjs.js');
 require('@jobber/design');
 require('../Button-cjs.js');
+require('../tslib.es6-cjs.js');
 require('react-router-dom');
 require('classnames');
-require('../tslib.es6-cjs.js');
 require('../Typography-cjs.js');
 
 

package/dist/Toast/index.mjs

@@ -5,7 +5,7 @@ import 'framer-motion';
 import '../Icon-es.js';
 import '@jobber/design';
 import '../Button-es.js';
+import '../tslib.es6-es.js';
 import 'react-router-dom';
 import 'classnames';
-import '../tslib.es6-es.js';
 import '../Typography-es.js';

package/dist/docs/Button/Button.md

@@ -917,9 +917,9 @@ export const styles = StyleSheet.create({
 | `label` | `string` | No | — |  |
 | `loading` | `boolean` | No | — |  |
 | `name` | `string` | No | — |  |
-| `onClick` | `(event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void` | No | — |  |
-| `onMouseDown` | `(event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void` | No | — |  |
-| `role` | `string` | No | — | Used to override the default button role. |
+| `onClick` | `((event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void) & MouseEventHandler<ButtonElement>` | No | — |  |
+| `onMouseDown` | `((event: MouseEvent<HTMLAnchorElement | HTMLButtonElement, MouseEvent>) => void) & MouseEventHandler<ButtonElement>` | No | — |  |
+| `ref` | `Ref<ButtonElement>` | No | — |  |
 | `size` | `ButtonSize` | No | — |  |
 | `submit` | `boolean` | No | — | Allows the button to submit a form |
 | `to` | `LocationDescriptor<unknown> | ((location: Location<unknown>) => LocationDescriptor<unknown>)` | No | — | **Deprecated**: to will be removed in the next major version @deprecated |
@@ -942,7 +942,7 @@ export const styles = StyleSheet.create({
 | `id` | `string` | No | — |  |
 | `numberOfLines` | `number` | No | — |  |
 | `size` | `"small" | "base" | "large" | "extravagant" | "jumbo" | "larger" | "largest" | "smaller"` | No | — |  |
-| `textCase` | `"capitalize" | "lowercase" | "none" | "uppercase"` | No | — |  |
+| `textCase` | `"none" | "capitalize" | "lowercase" | "uppercase"` | No | — |  |
 | `underline` | `UnderlineStyle | "solid color-indigo" | "solid color-indigo--light" | "solid color-indigo--lighter" | "solid color-indigo--lightest" | "solid color-indigo--dark" | ... 646 more ... | "dashed color-client--onSurface"` | No | — | The style (and optionally a color) of underline the text is decorated with. All semantic color tokens (other than the... |
 | `UNSAFE_className` | `{ textStyle?: string; }` | No | — | **Use at your own risk:** Custom classNames for specific elements. This should only be used as a **last resort**. Usi... |
 | `UNSAFE_style` | `{ textStyle?: CSSProperties; }` | No | — | **Use at your own risk:** Custom style for specific elements. This should only be used as a **last resort**. Using th... |

package/dist/docs/Checkbox/Checkbox.md

@@ -58,17 +58,31 @@ able to keep track the state of the child Checkboxes. See
 
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
+| `aria-activedescendant` | `string` | No | — | ID of the currently active descendant element. Used for composite widgets like combobox or listbox. @see {@link https... |
+| `aria-autocomplete` | `"none" | "inline" | "list" | "both"` | No | — | Indicates the type of autocomplete interaction. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-autocomplete} |
+| `aria-controls` | `string` | No | — | Indicates the element that controls the current element. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-controls} |
+| `aria-describedby` | `string` | No | — | Identifies the element (or elements) that describes the object. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-... |
+| `aria-details` | `string` | No | — | Identifies the element (or elements) that provide a detailed, extended description. @see {@link https://www.w3.org/TR... |
+| `aria-expanded` | `Booleanish` | No | — | Indicates whether the element is expanded or collapsed. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-expanded} |
+| `aria-label` | `string` | No | — | Defines a string value that labels the current element. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-label} |
+| `aria-labelledby` | `string` | No | — | Identifies the element (or elements) that labels the current element. @see {@link https://www.w3.org/TR/wai-aria-1.2/... |
+| `aria-required` | `Booleanish` | No | — | Indicates that user input is required before form submission. @see {@link https://www.w3.org/TR/wai-aria-1.2/#aria-re... |
 | `checked` | `boolean` | No | — | Determines if the checkbox is checked or not. |
-| `children` | `ReactElement<unknown, string | JSXElementConstructor<any>>` | No | — | Component children, which shows up as a label |
 | `defaultChecked` | `boolean` | No | — | Initial checked value of the checkbox. Only use this when you need to pre-populate the checked attribute that is not ... |
-| `description` | `ReactNode` | No | — | Further description of the label |
-| `disabled` | `boolean` | No | — | Disables the checkbox. |
-| `id` | `string` | No | — | ID for the checkbox input |
+| `description` | `ReactNode` | No | — | Additional description of the checkbox. String will be rendered with the default markup. ReactElement will be rendere... |
+| `disabled` | `boolean` | No | — | Whether the input is disabled. |
+| `id` | `string` | No | — | The unique identifier for the input element. |
 | `indeterminate` | `boolean` | No | `false` | When `true` the checkbox to appears in indeterminate. |
-| `label` | `string` | No | — | Label that shows up beside the checkbox. |
-| `name` | `string` | No | — | Checkbox input name |
-| `onBlur` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Called when the checkbox loses focus |
-| `onChange` | `(newValue: boolean) => void` | No | — | Called when the checkbox value changes |
-| `onFocus` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Called when the checkbox is focused |
+| `invalid` | `boolean` | No | — | Whether the checkbox is invalid |
+| `label` | `string | ReactElement<unknown, string | JSXElementConstructor<any>>` | No | — | Label that shows up beside the checkbox. String will be rendered with the default markup. ReactElement will be render... |
+| `name` | `string` | No | — | The name attribute for the input element. |
+| `onBlur` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Blur event handler. |
+| `onChange` | `(newValue: boolean, event: ChangeEvent<HTMLInputElement>) => void` | No | — | Called when the checkbox value changes. Includes the change event as a second argument. This is the recommended event... |
+| `onClick` | `(event: MouseEvent<HTMLInputElement, MouseEvent>) => void` | No | — | Click event handler. |
+| `onFocus` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Focus event handler. |
+| `onMouseDown` | `(event: MouseEvent<HTMLInputElement, MouseEvent>) => void` | No | — | Mouse down event handler. |
+| `onMouseUp` | `(event: MouseEvent<HTMLInputElement, MouseEvent>) => void` | No | — | Mouse up event handler. |
+| `onPointerDown` | `(event: PointerEvent<HTMLInputElement>) => void` | No | — | Pointer down event handler. |
+| `onPointerUp` | `(event: PointerEvent<HTMLInputElement>) => void` | No | — | Pointer up event handler. |
+| `ref` | `Ref<HTMLInputElement>` | No | — | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (... |
 | `value` | `string` | No | — | Value of the checkbox. |
-| `version` | `1` | No | — |  |

package/dist/docs/Icon/Icon.md

@@ -210,6 +210,7 @@ export function IconSizesExample() {
 |      | `availability`          |
 |      | `beforeDate`            |
 |      | `calendar`              |
+|      | `calendarCheck`         |
 |      | `clearFilters`          |
 |      | `event`                 |
 |      | `onlineBooking`         |

package/dist/docs/usage-guidelines/usage-guidelines.md

@@ -14,7 +14,6 @@ deprecated.
 | Component        | Import                                                                   | v2 prop                                                                                                   |
 | ---------------- | ------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------- |
 | Autocomplete     | `import { Autocomplete } from "@jobber/components/Autocomplete"`         | `version={2}` — fully controlled, async support                                                           |
-| Checkbox         | `import { Checkbox } from "@jobber/components/Checkbox"`                 | `version={2}`                                                                                             |
 | InputDate        | `import { InputDate } from "@jobber/components/InputDate"`               | `version={2}`                                                                                             |
 | InputEmail       | `import { InputEmail } from "@jobber/components/InputEmail"`             | `version={2}`                                                                                             |
 | InputNumber      | `import { InputNumber } from "@jobber/components/InputNumber"`           | `version={2}`                                                                                             |

package/dist/index.cjs

@@ -15,7 +15,7 @@ var Card = require('./Card-cjs.js');
 var Cluster = require('./Cluster-cjs.js');
 var Container = require('./Container-cjs.js');
 var Cover = require('./Cover-cjs.js');
-var Checkbox_index = require('./Checkbox/index.cjs');
+var Checkbox = require('./Checkbox-cjs.js');
 var Chip = require('./Chip-cjs.js');
 var ChipDismissible = require('./ChipDismissible-cjs.js');
 require('react');
@@ -222,7 +222,7 @@ exports.Card = Card.Card;
 exports.Cluster = Cluster.Cluster;
 exports.Container = Container.Container;
 exports.Cover = Cover.Cover;
-exports.Checkbox = Checkbox_index.Checkbox;
+exports.Checkbox = Checkbox.Checkbox;
 exports.Chip = Chip.Chip;
 exports.ChipDismissible = ChipDismissible.ChipDismissible;
 exports.ChipSelectable = ChipDismissible.ChipSelectable;

package/dist/index.mjs

@@ -13,7 +13,7 @@ export { C as Card } from './Card-es.js';
 export { C as Cluster } from './Cluster-es.js';
 export { C as Container } from './Container-es.js';
 export { C as Cover } from './Cover-es.js';
-export { Checkbox } from './Checkbox/index.mjs';
+export { C as Checkbox } from './Checkbox-es.js';
 export { C as Chip } from './Chip-es.js';
 export { a as ChipDismissible, C as ChipSelectable } from './ChipDismissible-es.js';
 import 'react';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "7.2.0",
+  "version": "7.4.0",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -528,7 +528,7 @@
   "devDependencies": {
     "@apollo/client": "^3.7.10",
     "@csstools/postcss-global-data": "^1.0.3",
-    "@jobber/design": "0.98.0",
+    "@jobber/design": "0.99.0",
     "@jobber/hooks": "2.19.4",
     "@rollup/plugin-alias": "^5.1.0",
     "@rollup/plugin-commonjs": "^25.0.7",
@@ -583,5 +583,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "3e24f22e0704d0c879ccd8d76c37ac0ff9866094"
+  "gitHead": "1513cc5ba2285ff22a2cb3eb537a2c105e9f793b"
 }

package/dist/Checkbox/Checkbox.rebuilt.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-export declare const CheckboxRebuilt: React.ForwardRefExoticComponent<import("./Checkbox.types").CheckboxCoreProps & import("../sharedHelpers/types").AriaInputProps & import("../sharedHelpers/types").FocusEvents<HTMLInputElement> & import("../sharedHelpers/types").MouseEvents<HTMLInputElement> & Pick<import("../sharedHelpers/types").HTMLInputBaseProps, "id" | "name" | "disabled"> & Pick<import("../sharedHelpers/types").RebuiltInputCommonProps, "version"> & {
-    label?: string | React.ReactElement;
-    description?: React.ReactNode;
-    invalid?: boolean;
-    onChange?(newValue: boolean, event: React.ChangeEvent<HTMLInputElement>): void;
-} & React.RefAttributes<HTMLInputElement>>;