@jobber/components 8.1.0 → 8.2.0

package/dist/docs/Countdown/Countdown.md

@@ -33,7 +33,6 @@ decision on whether to show or hide the units.
 
 * To display a unit of time that has already passed, use
   [FormatRelativeDateTime](../FormatRelativeDateTime/FormatRelativeDateTime.md)
-* To display time as a static unit, use [FormatTime](../FormatTime/FormatTime.md)
 
 
 ## Props

package/dist/docs/InputNumber/InputNumber.md

@@ -17,17 +17,6 @@ InputNumber does not show a clear button. The component enforces
 `clearable="never"` to align with numeric, increment/decrement-focused usage.
 
 
-## Configuration
-
-## Using onValidation
-
-If you need to capture the error message and render it outside of the component.
-Read the [InputValidation](../InputValidation/InputValidation.md) documentation.
-
-For more details about `validation` using `Input` components, see the
-[InputText](../InputText/InputText.md) documentation.
-
-
 ## Props
 
 ### Web
@@ -35,33 +24,48 @@ For more details about `validation` using `Input` components, see the
 | Prop | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
 | `align` | `"center" | "right"` | No | — | Determines the alignment of the text inside the input. |
-| `autocomplete` | `AutocompleteTypes | boolean` | No | — | Determines if browser form autocomplete is enabled. Note that "one-time-code" is experimental and should not be used ... |
-| `clearable` | `Clearable` | No | — | Add a clear action on the input that clears the value.  You should always use `while-editing` if you want the input t... |
-| `defaultValue` | `Date | string` | No | — | Initial value of the input. Only use this when you need to pre-populate the field with a data that is not controlled ... |
+| `aria-activedescendant` | `string` | No | — | ID of the currently active descendant element. Used for composite widgets like combobox or listbox. @see {@link https... |
+| `aria-autocomplete` | `"both" | "inline" | "list" | "none"` | 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... |
+| `autoComplete` | `string` | No | — | Autocomplete behavior for the input (React casing, string values only). Use standard HTML autocomplete values or "on"... |
+| `autoFocus` | `boolean` | No | — | Whether the input should be auto-focused (React casing). |
+| `defaultValue` | `number` | No | — |  |
 | `description` | `ReactNode` | No | — | Further description of the input, can be used for a hint. |
-| `disabled` | `boolean` | No | — | Disable the input |
-| `id` | `string` | No | — | A unique identifier for the input. |
-| `inline` | `boolean` | No | — | Adjusts the form field to go inline with a content. This also silences the given `validations` prop. You'd have to us... |
-| `inputRef` | `RefObject<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>` | No | — |  |
+| `disabled` | `boolean` | No | — | Whether the input is disabled. |
+| `error` | `string` | No | — | Error message to display. This also highlights the field red. |
+| `formatOptions` | `NumberFormatOptions` | No | — |  |
+| `id` | `string` | No | — | The unique identifier for the input element. |
+| `inline` | `boolean` | No | — | Adjusts the form field to go inline with content. |
+| `inputMode` | `"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url"` | No | — | Input mode hint for virtual keyboards. |
 | `invalid` | `boolean` | No | — | Highlights the field red to indicate an error. |
-| `keyboard` | `"decimal" | "numeric"` | No | — | Determines what kind of keyboard appears on mobile web. |
-| `loading` | `boolean` | No | — | Show a spinner to indicate loading |
-| `max` | `number` | No | — | Specifies the maximum numerical or date value that a user can type |
-| `maxLength` | `number` | No | — | Maximum character length for an input. This also changes the width to roughly the same size as the max length. This i... |
-| `min` | `number` | No | — | Specifies the minimum numerical or date value that a user can type |
-| `name` | `string` | No | — | Name of the input. |
-| `onBlur` | `(event?: FocusEvent<Element, Element>) => void` | No | — | Blur callback. |
-| `onChange` | `(newValue: string | number | boolean | Date, event?: ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => void` | No | — | onChange handler that provides the new value (or event) @param newValue @param event |
-| `onEnter` | `(event: KeyboardEvent<Element>) => void` | No | — | A callback to handle "Enter" keypress. This will only run if Enter is the only key. Will not run if Shift or Control ... |
-| `onFocus` | `(event?: FocusEvent<Element, Element>) => void` | No | — | Focus callback. |
-| `onValidation` | `(message: string) => void` | No | — | Callback to get the the status and message when validating a field @param message |
+| `loading` | `boolean` | No | — | Show a spinner to indicate loading. |
+| `maxLength` | `number` | No | — | Maximum number of characters allowed in the input. |
+| `maxValue` | `number` | No | — |  |
+| `minValue` | `number` | No | — |  |
+| `name` | `string` | No | — | The name attribute for the input element. |
+| `onBlur` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Blur event handler. |
+| `onChange` | `(newValue: number, event?: ChangeEvent<HTMLInputElement>) => void` | No | — | Callback for value changes. @param newValue - The new numeric value @param event - Optional change event |
+| `onClick` | `(event: MouseEvent<HTMLInputElement, MouseEvent>) => void` | No | — | Click event handler. |
+| `onFocus` | `(event: FocusEvent<HTMLInputElement, Element>) => void` | No | — | Focus event handler. |
+| `onKeyDown` | `(event: KeyboardEvent<HTMLInputElement>) => void` | No | — | Key down event handler. |
+| `onKeyUp` | `(event: KeyboardEvent<HTMLInputElement>) => void` | No | — | Key up 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. |
+| `pattern` | `string` | No | — | Validation pattern (regex) for the input. |
 | `placeholder` | `string` | No | — | Text that appears inside the input when empty and floats above the value as a mini label once the user enters a value... |
-| `prefix` | `Affix` | No | — | Adds a prefix label and icon to the field |
-| `readonly` | `boolean` | No | — | Prevents users from editing the value. |
+| `readOnly` | `boolean` | No | — | Whether the input is read-only (HTML standard casing). |
 | `ref` | `Ref<InputNumberRef>` | No | — | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (... |
-| `showMiniLabel` | `boolean` | No | `true` | Controls the visibility of the mini label that appears inside the input when a value is entered. By default, the plac... |
+| `required` | `boolean` | No | — | Whether the input is required before form submission. |
+| `role` | `string` | No | — | Role attribute for accessibility. |
+| `showMiniLabel` | `boolean` | No | — |  |
 | `size` | `"large" | "small"` | No | — | Adjusts the interface to either have small or large spacing. |
-| `suffix` | `{ onClick: () => void; readonly ariaLabel: string; readonly icon: IconNames; readonly label?: string; } | { onClick?: never; ariaLabel?: never; readonly label?: string; readonly icon?: IconNames; }` | No | — | Adds a suffix label and icon with an optional action to the field |
-| `validations` | `RegisterOptions` | No | — | Show an error message above the field. This also highlights the the field red if an error message shows up. |
-| `value` | `number` | No | — | Set the component to the given value. |
-| `version` | `1` | No | — | Experimental: Determine which version of the FormField to use. |
+| `tabIndex` | `number` | No | — | Tab index for keyboard navigation. |
+| `value` | `number` | No | — |  |

package/dist/docs/index.md

@@ -44,7 +44,6 @@
 [Form](./Form/Form.md)
 [FormatFile](./FormatFile/FormatFile.md)
 [FormatRelativeDateTime](./FormatRelativeDateTime/FormatRelativeDateTime.md)
-[FormatTime](./FormatTime/FormatTime.md)
 [FormField](./FormField/FormField.md)
 [Frame](./Frame/Frame.md)
 [Gallery](./Gallery/Gallery.md)

package/dist/index.cjs

@@ -47,7 +47,6 @@ var useAtlantisFormFieldName = require('./useAtlantisFormFieldName-cjs.js');
 var FormFieldWrapper = require('./FormFieldWrapper-cjs.js');
 var FormatFile = require('./FormatFile-cjs.js');
 var FormatRelativeDateTime = require('./FormatRelativeDateTime-cjs.js');
-var FormatTime = require('./FormatTime-cjs.js');
 var Frame = require('./Frame-cjs.js');
 var Gallery = require('./Gallery-cjs.js');
 var Glimmer = require('./Glimmer-cjs.js');
@@ -59,7 +58,7 @@ var InputDate = require('./InputDate-cjs.js');
 var InputEmail = require('./InputEmail-cjs.js');
 var InputFile = require('./InputFile-cjs.js');
 var InputGroup = require('./InputGroup-cjs.js');
-var InputNumber_index = require('./InputNumber/index.cjs');
+var InputNumber = require('./InputNumber-cjs.js');
 var InputPassword = require('./InputPassword-cjs.js');
 var InputPhoneNumber = require('./InputPhoneNumber-cjs.js');
 var InputText_index = require('./InputText/index.cjs');
@@ -275,7 +274,6 @@ exports.FormatFile = FormatFile.FormatFile;
 exports.useFormatFile = FormatFile.useFormatFile;
 exports.useFormatFileStyles = FormatFile.useFormatFileStyles;
 exports.FormatRelativeDateTime = FormatRelativeDateTime.FormatRelativeDateTime;
-exports.FormatTime = FormatTime.FormatTime;
 exports.Frame = Frame.Frame;
 exports.Gallery = Gallery.Gallery;
 exports.GLIMMER_TEST_ID = Glimmer.GLIMMER_TEST_ID;
@@ -299,7 +297,7 @@ exports.mimeTypeToReadable = InputFile.mimeTypeToReadable;
 exports.updateFiles = InputFile.updateFiles;
 exports.useInputFileContentContext = InputFile.useInputFileContentContext;
 exports.InputGroup = InputGroup.InputGroup;
-exports.InputNumber = InputNumber_index.InputNumber;
+exports.InputNumber = InputNumber.InputNumber;
 exports.InputPassword = InputPassword.InputPassword;
 exports.InputPhoneNumber = InputPhoneNumber.InputPhoneNumber;
 exports.InputText = InputText_index.InputText;

package/dist/index.d.mts

@@ -35,7 +35,6 @@ export * from "./Form";
 export * from "./FormField";
 export * from "./FormatFile";
 export * from "./FormatRelativeDateTime";
-export * from "./FormatTime";
 export * from "./Frame";
 export * from "./Gallery";
 export * from "./Glimmer";

package/dist/index.d.ts

@@ -35,7 +35,6 @@ export * from "./Form";
 export * from "./FormField";
 export * from "./FormatFile";
 export * from "./FormatRelativeDateTime";
-export * from "./FormatTime";
 export * from "./Frame";
 export * from "./Gallery";
 export * from "./Glimmer";

package/dist/index.mjs

@@ -45,7 +45,6 @@ export { u as useAtlantisFormFieldName } from './useAtlantisFormFieldName-es.js'
 export { A as AffixIcon, f as AffixLabel, F as FormFieldInputHorizontalWrapper, a as FormFieldInputWrapperStyles, b as FormFieldLabel, c as FormFieldWrapper, d as FormFieldWrapperMain, e as FormFieldWrapperToolbar, u as useFormFieldWrapperStyles } from './FormFieldWrapper-es.js';
 export { F as FormatFile, u as useFormatFile, a as useFormatFileStyles } from './FormatFile-es.js';
 export { F as FormatRelativeDateTime } from './FormatRelativeDateTime-es.js';
-export { F as FormatTime } from './FormatTime-es.js';
 export { F as Frame } from './Frame-es.js';
 export { G as Gallery } from './Gallery-es.js';
 export { a as GLIMMER_TEST_ID, G as Glimmer } from './Glimmer-es.js';
@@ -57,7 +56,7 @@ export { I as InputDate } from './InputDate-es.js';
 export { I as InputEmail } from './InputEmail-es.js';
 export { F as FileTypes, I as InputFile, a as InputFileContentContext, c as convertToMimeTypes, f as formatMimeTypes, m as mimeTypeToReadable, u as updateFiles, b as useInputFileContentContext } from './InputFile-es.js';
 export { I as InputGroup } from './InputGroup-es.js';
-export { InputNumber } from './InputNumber/index.mjs';
+export { I as InputNumber } from './InputNumber-es.js';
 export { I as InputPassword } from './InputPassword-es.js';
 export { I as InputPhoneNumber } from './InputPhoneNumber-es.js';
 export { InputText } from './InputText/index.mjs';

package/dist/styles.css

@@ -10533,14 +10533,14 @@ html.atlantisLightBoxActive {
   --public-field--bottom-left-radius: var(--radius-base);
   --public-field--bottom-right-radius: var(--radius-base);
 }
-.yoAxHoRfBh0- {
+.-W4QiocGsR4- {
   width: 100%;
 }
-._2THRT-1hUFg- {
+._9-f2CjSVojs- {
   display: inline-block;
   width: auto;
 }
-.BFLLXHwls7k- {
+._4y342TRP-y8- {
   --field--placeholder-color: var(--color-base-blue--600);
   --field--value-color: var(--color-heading);
   --field--border-color: var(--color-border--interactive);
@@ -10593,43 +10593,43 @@ html.atlantisLightBoxActive {
   background-color: rgba(255, 255, 255, 1);
   background-color: var(--field--background-color);
 }
-.BFLLXHwls7k- * {
+._4y342TRP-y8- * {
   box-sizing: border-box;
 }
-.BFLLXHwls7k-:focus-within {
+._4y342TRP-y8-:focus-within {
   position: relative;
   z-index: var(--field--base-elevation);
   box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 1), 0px 0px 0px 4px hsl(198, 12%, 57%);
   box-shadow: var(--shadow-focus);
 }
-.TN-Vt0n--vs- {
+.-bawhitao74- {
   display: -ms-flexbox;
   display: flex;
   height: var(--field--height);
   -ms-flex: 1;
       flex: 1;
 }
-.TDDlk-skU3c-,
-.TDDlk-skU3c-:focus-within {
+._0ihSRVfrcGo-,
+._0ihSRVfrcGo-:focus-within {
   --field--border-color: var(--color-critical);
   position: relative;
 }
-._7Slwc5wYHas- {
+.d-YOq6z4ZxM- {
   --field--placeholder-color: var(--color-disabled);
   --field--value-color: var(--color-disabled);
   --field--background-color: var(--color-disabled--secondary);
   --field--border-color: var(--color-border);
 }
 /* override iOS default styling for disabled input */
-._7Slwc5wYHas- :disabled {
+.d-YOq6z4ZxM- :disabled {
   -webkit-text-fill-color: var(--field--value-color);
   opacity: 1;
 }
-.l-A9wrqF3o0- {
+.buIzMqBEpSQ- {
   margin-top: 4px;
   margin-top: var(--space-smaller);
 }
-.VqnwsVUZarY- {
+.pY0cqJVnma0- {
   -ms-flex-align: center;
       align-items: center;
   display: -ms-flexbox;
@@ -10640,7 +10640,7 @@ html.atlantisLightBoxActive {
   padding: var(--space-smaller);
   padding-left: 0;
 }
-.QYqNvgYefjY- {
+.YTL0AyJdbC8- {
   --field--padding-left: calc(var(--space-base) - var(--space-smaller));
   --field--padding-right: calc(var(--space-base) - var(--space-smaller));
   --field--padding-top: var(--space-small);
@@ -10648,22 +10648,22 @@ html.atlantisLightBoxActive {
   --field--height: calc(var(--space-larger) + var(--space-smaller));
   --postfix-right: calc(var(--space-small) + var(--space-smaller));
 }
-.tU-M7nFJOxs- {
+.mUfanIovnVg- {
   --field--padding-left: var(--space-large);
   --field--padding-right: var(--space-large);
   --field--height: calc(var(--space-extravagant));
   --postfix-right: var(--space-large);
 }
-.uZ9UB1bR9O8- {
+._8MM9keFOeD0- {
   --field--textAlign: center;
 }
-.FJI0aA3lUFE- {
+.mTeuCQufdj4- {
   --field--textAlign: right;
 }
 /**
  * Input Wrapper
  **/
-.xoyrLfJnWTc- {
+.IgE0pfetwVM- {
   display: -ms-flexbox;
   display: flex;
   -ms-flex: 1;
@@ -10673,7 +10673,7 @@ html.atlantisLightBoxActive {
   z-index: 0;
   z-index: var(--elevation-default);
 }
-._8PXaJfO9MhI- {
+.H-GDJPTnTJs- {
   position: relative;
   -ms-flex: 1;
       flex: 1;
@@ -10681,7 +10681,7 @@ html.atlantisLightBoxActive {
 /**
  * Input
  **/
-.cvvb1XVqdvM- {
+.MxShJMNKSB4- {
   position: relative;
   z-index: var(--field--base-elevation);
   width: 100%;
@@ -10701,7 +10701,7 @@ html.atlantisLightBoxActive {
   -webkit-appearance: none;
           appearance: none;
 }
-.cvvb1XVqdvM-:focus {
+.MxShJMNKSB4-:focus {
   outline: none;
 }
 /* DO WE NEED TO SUPPORT AUTOFILL FOR INPUT NUMBER?? */
@@ -10714,7 +10714,7 @@ html.atlantisLightBoxActive {
 /**
  * Label
  **/
-.bMiwDjxGnGs- {
+.f1OiicY3UzU- {
   position: absolute;
   top: var(--field--placeholder-offset);
   z-index: var(--field--label-elevation);
@@ -10732,7 +10732,7 @@ html.atlantisLightBoxActive {
           transform: translateY(var(--field--placeholder-transform));
 }
 /* When not hiding the label, animate the transition to the miniLabel */
-.xoyrLfJnWTc-:not(.h-Ctyb3v8T0-) .bMiwDjxGnGs- {
+.IgE0pfetwVM-:not(.j9oUhNvNwsE-) .f1OiicY3UzU- {
   transition: all 100ms;
   transition: all var(--timing-quick);
 }
@@ -10742,8 +10742,8 @@ html.atlantisLightBoxActive {
  * label becomes "miniLabel": small and above field value
  * unless inputWrapper is small
  */
-.xoyrLfJnWTc-:not(.QYqNvgYefjY-):not(.h-Ctyb3v8T0-):has(
-    .cvvb1XVqdvM-:not(:-ms-input-placeholder) + .bMiwDjxGnGs-:not(:empty)
+.IgE0pfetwVM-:not(.YTL0AyJdbC8-):not(.j9oUhNvNwsE-):has(
+    .MxShJMNKSB4-:not(:-ms-input-placeholder) + .f1OiicY3UzU-:not(:empty)
   ) {
   --field--placeholder-color: var(--color-text--secondary);
   --field--placeholder-offset: var(--space-smallest);
@@ -10760,20 +10760,20 @@ html.atlantisLightBoxActive {
   --field--padding-top: calc(var(--space-base) + var(--space-smaller));
   --field--padding-bottom: var(--space-small);
 }
-.xoyrLfJnWTc-:not(.QYqNvgYefjY-):not(.h-Ctyb3v8T0-):has(
-    .cvvb1XVqdvM-:not(:placeholder-shown) + .bMiwDjxGnGs-:not(:empty)
+.IgE0pfetwVM-:not(.YTL0AyJdbC8-):not(.j9oUhNvNwsE-):has(
+    .MxShJMNKSB4-:not(:placeholder-shown) + .f1OiicY3UzU-:not(:empty)
   ),
-.xoyrLfJnWTc-:not(.QYqNvgYefjY-):not(.h-Ctyb3v8T0-):has(.cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty)) {
+.IgE0pfetwVM-:not(.YTL0AyJdbC8-):not(.j9oUhNvNwsE-):has(.MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty)) {
   --field--placeholder-color: var(--color-text--secondary);
   --field--placeholder-offset: var(--space-smallest);
   --field--placeholder-transform: 0;
   --field--padding-top: calc(var(--space-base) + var(--space-smaller));
   --field--padding-bottom: var(--space-small);
 }
-.xoyrLfJnWTc-._7Slwc5wYHas- label {
+.IgE0pfetwVM-.d-YOq6z4ZxM- label {
   --field--placeholder-color: var(--color-text-disabled);
 }
-.cvvb1XVqdvM-:not(:-ms-input-placeholder) + .bMiwDjxGnGs-:not(:empty) {
+.MxShJMNKSB4-:not(:-ms-input-placeholder) + .f1OiicY3UzU-:not(:empty) {
   font-size: 12px;
   font-size: var(--typography--fontSize-small);
 }
@@ -10781,36 +10781,36 @@ html.atlantisLightBoxActive {
   font-size: 12px;
   font-size: var(--typography--fontSize-small);
 }
-.cvvb1XVqdvM-:not(:placeholder-shown) + .bMiwDjxGnGs-:not(:empty),
-.cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty) {
+.MxShJMNKSB4-:not(:placeholder-shown) + .f1OiicY3UzU-:not(:empty),
+.MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty) {
   font-size: 12px;
   font-size: var(--typography--fontSize-small);
 }
-.h-Ctyb3v8T0- .cvvb1XVqdvM-:not(:-ms-input-placeholder) + .bMiwDjxGnGs-:not(:empty) {
+.j9oUhNvNwsE- .MxShJMNKSB4-:not(:-ms-input-placeholder) + .f1OiicY3UzU-:not(:empty) {
   visibility: hidden;
 }
 .hideLabel .input:not(:-ms-input-placeholder) + .label:not(:empty) {
   visibility: hidden;
 }
-.h-Ctyb3v8T0- .cvvb1XVqdvM-:not(:placeholder-shown) + .bMiwDjxGnGs-:not(:empty),
-.h-Ctyb3v8T0- .cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty) {
+.j9oUhNvNwsE- .MxShJMNKSB4-:not(:placeholder-shown) + .f1OiicY3UzU-:not(:empty),
+.j9oUhNvNwsE- .MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty) {
   visibility: hidden;
 }
 /* Size small inputs don't show a "miniLabel" */
-.xoyrLfJnWTc-.QYqNvgYefjY- .cvvb1XVqdvM-:not(:-ms-input-placeholder) + .bMiwDjxGnGs-:not(:empty) {
+.IgE0pfetwVM-.YTL0AyJdbC8- .MxShJMNKSB4-:not(:-ms-input-placeholder) + .f1OiicY3UzU-:not(:empty) {
   display: none;
 }
 .inputWrapper.small .input:not(:-ms-input-placeholder) + .label:not(:empty) {
   display: none;
 }
-.xoyrLfJnWTc-.QYqNvgYefjY- .cvvb1XVqdvM-:not(:placeholder-shown) + .bMiwDjxGnGs-:not(:empty),
-.xoyrLfJnWTc-.QYqNvgYefjY- .cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty) {
+.IgE0pfetwVM-.YTL0AyJdbC8- .MxShJMNKSB4-:not(:placeholder-shown) + .f1OiicY3UzU-:not(:empty),
+.IgE0pfetwVM-.YTL0AyJdbC8- .MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty) {
   display: none;
 }
 /* Size Large inputs adjust top padding on minilabel  */
-.xoyrLfJnWTc-.tU-M7nFJOxs-:not(.h-Ctyb3v8T0-)
-  .cvvb1XVqdvM-:not(:-ms-input-placeholder)
-  + .bMiwDjxGnGs-:not(:empty) {
+.IgE0pfetwVM-.mUfanIovnVg-:not(.j9oUhNvNwsE-)
+  .MxShJMNKSB4-:not(:-ms-input-placeholder)
+  + .f1OiicY3UzU-:not(:empty) {
   --field--padding-top: calc(var(--space-large) + var(--space-smaller));
 }
 .inputWrapper.large:not(.hideLabel)
@@ -10818,13 +10818,13 @@ html.atlantisLightBoxActive {
   + .label:not(:empty) {
   --field--padding-top: calc(var(--space-large) + var(--space-smaller));
 }
-.xoyrLfJnWTc-.tU-M7nFJOxs-:not(.h-Ctyb3v8T0-)
-  .cvvb1XVqdvM-:not(:placeholder-shown)
-  + .bMiwDjxGnGs-:not(:empty),
-.xoyrLfJnWTc-.tU-M7nFJOxs-:not(.h-Ctyb3v8T0-) .cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty) {
+.IgE0pfetwVM-.mUfanIovnVg-:not(.j9oUhNvNwsE-)
+  .MxShJMNKSB4-:not(:placeholder-shown)
+  + .f1OiicY3UzU-:not(:empty),
+.IgE0pfetwVM-.mUfanIovnVg-:not(.j9oUhNvNwsE-) .MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty) {
   --field--padding-top: calc(var(--space-large) + var(--space-smaller));
 }
-.xoyrLfJnWTc-.tU-M7nFJOxs- .cvvb1XVqdvM-:not(:-ms-input-placeholder) + .bMiwDjxGnGs-:not(:empty) .bMiwDjxGnGs- {
+.IgE0pfetwVM-.mUfanIovnVg- .MxShJMNKSB4-:not(:-ms-input-placeholder) + .f1OiicY3UzU-:not(:empty) .f1OiicY3UzU- {
   padding-top: 8px;
   padding-top: var(--space-small);
 }
@@ -10832,8 +10832,8 @@ html.atlantisLightBoxActive {
   padding-top: 8px;
   padding-top: var(--space-small);
 }
-.xoyrLfJnWTc-.tU-M7nFJOxs- .cvvb1XVqdvM-:not(:placeholder-shown) + .bMiwDjxGnGs-:not(:empty) .bMiwDjxGnGs-,
-.xoyrLfJnWTc-.tU-M7nFJOxs- .cvvb1XVqdvM-:focus + .bMiwDjxGnGs-:not(:empty) .bMiwDjxGnGs- {
+.IgE0pfetwVM-.mUfanIovnVg- .MxShJMNKSB4-:not(:placeholder-shown) + .f1OiicY3UzU-:not(:empty) .f1OiicY3UzU-,
+.IgE0pfetwVM-.mUfanIovnVg- .MxShJMNKSB4-:focus + .f1OiicY3UzU-:not(:empty) .f1OiicY3UzU- {
   padding-top: 8px;
   padding-top: var(--space-small);
 }

package/dist/utils/meta/meta.json

@@ -102,7 +102,6 @@
     "FormatFile.ThumbnailContainer",
     "FormatFile.Wrapper",
     "FormatRelativeDateTime",
-    "FormatTime",
     "Frame",
     "Gallery",
     "Glimmer",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components",
-  "version": "8.1.0",
+  "version": "8.2.0",
   "license": "MIT",
   "type": "module",
   "main": "dist/index.cjs",
@@ -210,11 +210,6 @@
       "import": "./dist/FormatRelativeDateTime/index.mjs",
       "require": "./dist/FormatRelativeDateTime/index.cjs"
     },
-    "./FormatTime": {
-      "types": "./dist/FormatTime/index.d.ts",
-      "import": "./dist/FormatTime/index.mjs",
-      "require": "./dist/FormatTime/index.cjs"
-    },
     "./Frame": {
       "types": "./dist/Frame/index.d.ts",
       "import": "./dist/Frame/index.mjs",
@@ -568,5 +563,5 @@
     "> 1%",
     "IE 10"
   ],
-  "gitHead": "619a06389b92bcc8d2d8b5768b67604b0b29fbc7"
+  "gitHead": "95eed3cf18c0348874ee50b17bd3d927f392242d"
 }

package/FormatTime.d.ts

@@ -1 +0,0 @@
-export * from "./dist/FormatTime";

package/FormatTime.js

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true,
-});
-
-var FormatTime = require("./dist/FormatTime");
-
-Object.keys(FormatTime).forEach(function(key) {
-  if (key === "default" || key === "__esModule") return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return FormatTime[key];
-    },
-  });
-});

package/dist/FormatTime/FormatTime.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-interface FormatTimeProps {
-    /**
-     * Time (as JS Date) to be displayed.
-     *
-     * A `string` should be an ISO 8601 format date string.
-     */
-    readonly time: Date | string;
-    /**
-     * Optionally specify clock format. If `undefined` system format will be respected.
-     */
-    readonly use24HourClock?: boolean;
-}
-export declare function FormatTime({ time: inputTime, use24HourClock, }: FormatTimeProps): React.JSX.Element;
-export {};

package/dist/FormatTime/index.cjs

@@ -1,8 +0,0 @@
-'use strict';
-
-var FormatTime = require('../FormatTime-cjs.js');
-require('react');
-
-
-
-exports.FormatTime = FormatTime.FormatTime;

package/dist/FormatTime/index.d.ts

@@ -1 +0,0 @@
-export { FormatTime } from "./FormatTime";

package/dist/FormatTime/index.mjs

@@ -1,2 +0,0 @@
-export { F as FormatTime } from '../FormatTime-es.js';
-import 'react';

package/dist/FormatTime-cjs.js

@@ -1,24 +0,0 @@
-'use strict';
-
-var React = require('react');
-
-function FormatTime({ time: inputTime, use24HourClock, }) {
-    let dateObject;
-    if (inputTime instanceof Date) {
-        dateObject = inputTime;
-    }
-    else {
-        dateObject = new Date(inputTime);
-    }
-    return React.createElement(React.Fragment, null, dateToLocaleTimeString(dateObject, use24HourClock));
-}
-function dateToLocaleTimeString(date, use24HourClock) {
-    const language = (globalThis === null || globalThis === void 0 ? void 0 : globalThis.navigator) ? navigator.language : "en";
-    return date.toLocaleTimeString(language, {
-        hourCycle: use24HourClock ? "h23" : "h12",
-        minute: "2-digit",
-        hour: "numeric",
-    });
-}
-
-exports.FormatTime = FormatTime;

package/dist/FormatTime-es.js

@@ -1,22 +0,0 @@
-import React__default from 'react';
-
-function FormatTime({ time: inputTime, use24HourClock, }) {
-    let dateObject;
-    if (inputTime instanceof Date) {
-        dateObject = inputTime;
-    }
-    else {
-        dateObject = new Date(inputTime);
-    }
-    return React__default.createElement(React__default.Fragment, null, dateToLocaleTimeString(dateObject, use24HourClock));
-}
-function dateToLocaleTimeString(date, use24HourClock) {
-    const language = (globalThis === null || globalThis === void 0 ? void 0 : globalThis.navigator) ? navigator.language : "en";
-    return date.toLocaleTimeString(language, {
-        hourCycle: use24HourClock ? "h23" : "h12",
-        minute: "2-digit",
-        hour: "numeric",
-    });
-}
-
-export { FormatTime as F };

package/dist/InputNumber/InputNumber.rebuilt.d.ts

@@ -1,7 +0,0 @@
-import React from "react";
-import type { InputNumberRebuiltProps } from "./InputNumber.rebuilt.types";
-export interface InputNumberRebuiltRef {
-    blur(): void;
-    focus(): void;
-}
-export declare const InputNumberRebuilt: React.ForwardRefExoticComponent<InputNumberRebuiltProps & React.RefAttributes<InputNumberRebuiltRef>>;

package/dist/docs/FormatTime/FormatTime.md

@@ -1,32 +0,0 @@
-# FormatTime
-
-In Jobber a FormatTime is used to ensure that time is displayed in the expected
-format. No text styling is applied, this simply formats the text.
-
-## Specify format
-
-You can select a specific format to use in FormatTime.
-
-In the following example, we create a new `Date` object and set its time to
-22:35:00 (10:35 PM) using the `setHours` method. The `setHours` method sets the
-hours, minutes, seconds, and milliseconds for a specified date.
-
-```tsx
-const newDate = new Date();
-newDate.setHours(22, 35, 0, 0);
-
-<FormatTime time={newDate} use24HourClock={true} /> // prints 22:35
-
-<FormatTime time={newDate} use24HourClock={false} /> // prints 10:35 PM
-
-```
-
-
-## Props
-
-### Web
-
-| Prop | Type | Required | Default | Description |
-|------|------|----------|---------|-------------|
-| `time` | `Date | string` | Yes | — | Time (as JS Date) to be displayed.  A `string` should be an ISO 8601 format date string. |
-| `use24HourClock` | `boolean` | No | — | Optionally specify clock format. If `undefined` system format will be respected. |