@danske/sapphire-react-lab 0.105.1 → 0.106.1

package/build/esm/TagGroup/src/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../../src/TagGroup/src/Tag.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport { AriaButtonProps, useButton } from '@react-aria/button';\nimport { useHover } from '@react-aria/interactions';\nimport { useTag } from '@react-aria/tag';\nimport { mergeProps, mergeRefs } from '@react-aria/utils';\nimport type { ListState } from '@react-stately/list';\nimport type { FocusableElement, Node } from '@react-types/shared';\n\nimport { Icon, useThemeCheck, TooltipIfNeeded } from '@danske/sapphire-react';\nimport { Close, Error } from '@danske/sapphire-icons/react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\nimport { FocusRing } from '@react-aria/focus';\n\nexport interface TagProps<T> {\n  /**\n   * Object representing the tag. Contains relevant information about the tag.\n   */\n  item: Node<T>;\n  /**\n   * State for TagGroup, returned by `useListState`\n   */\n  state: ListState<T>;\n  /**\n   * Shows error icon.\n   * @default 'false'\n   */\n  hasError?: boolean;\n  /**\n   * Control whether the tag is removable or not.\n   * This behavior is overridden to `false` if the tag is disabled.\n   *\n   * @default false\n   */\n  allowsRemoving?: boolean;\n}\n\nexport function Tag<T>(props: TagProps<T>): React.JSX.Element {\n  useThemeCheck();\n  const { hasError = false, item, state } = props;\n  const ref = useRef<HTMLDivElement>(null);\n  const {\n    gridCellProps,\n    isDisabled,\n    isFocused,\n    isPressed,\n    removeButtonProps,\n    rowProps: { onKeyDown, ...rowProps },\n    ...otherProps\n  } = useTag(props, state, ref);\n  const { hoverProps, isHovered } = useHover({ isDisabled });\n  /* hasAction prop is passed when onAction is present, we are using it to set the hover and action classes.\n  The workaround below is made because AriaTagProps Omit's hasAction to avoid typecheck error */\n  const hasAction = (otherProps as any).hasAction;\n\n  return (\n    <TooltipIfNeeded<HTMLDivElement> title={item.rendered}>\n      {(tooltipRef, tooltipProps) => {\n        const { ref: tooltipTargetRef, ...restTooltipProps } =\n          tooltipProps || {};\n        return (\n          <FocusRing focusRingClass={styles['is-focus']}>\n            <div\n              ref={mergeRefs(ref, tooltipTargetRef)}\n              {...mergeProps(\n                {\n                  onKeyDown: (e: React.KeyboardEvent<FocusableElement>) => {\n                    /* We are removing Space key interaction and prevent default behavior to avoid isPressed prop being set\n                  as we do not want to apply is-active class on \"Space\" interaction when having actionable tags with onAction or link */\n                    if (e.key !== ' ') {\n                      onKeyDown?.(e);\n                    } else {\n                      e.preventDefault();\n                    }\n                  },\n                },\n                rowProps,\n                hoverProps,\n                restTooltipProps\n              )}\n              className={clsx(\n                styles['sapphire-tag'],\n                styles['js-focus'],\n                styles['js-hover'],\n                {\n                  [styles['sapphire-tag--actionable']]: hasAction,\n                  [styles['is-active']]: hasAction && isPressed,\n                  [styles['is-hover']]: hasAction && isHovered,\n                  [styles['is-disabled']]: isDisabled,\n                }\n              )}\n              {...(hasError ? { 'aria-invalid': true } : {})}\n            >\n              <div\n                {...gridCellProps}\n                className={styles['sapphire-tag__content']}\n              >\n                {hasError && !isDisabled && <IconError />}\n                <span\n                  ref={tooltipRef as React.Ref<HTMLSpanElement>}\n                  className={styles['sapphire-tag__label']}\n                >\n                  {item.rendered}\n                </span>\n                {!isDisabled && props.allowsRemoving && (\n                  <RemoveButton {...(removeButtonProps as AriaButtonProps)} />\n                )}\n              </div>\n            </div>\n          </FocusRing>\n        );\n      }}\n    </TooltipIfNeeded>\n  );\n}\n\nfunction RemoveButton(removeButtonProps: AriaButtonProps) {\n  const buttonRef = useRef(null);\n  const { buttonProps } = useButton(removeButtonProps, buttonRef);\n  return (\n    <button\n      {...buttonProps}\n      className={clsx(styles['sapphire-tag__button'], styles['js-focus'])}\n    >\n      <Icon size=\"sm\">\n        <Close />\n      </Icon>\n    </button>\n  );\n}\n\nconst IconError = () => {\n  return (\n    <span className={clsx(styles['sapphire-tag__error-icon'])}>\n      <Icon size=\"sm\">\n        <Error />\n      </Icon>\n    </span>\n  );\n};\n"],"names":["Error2"],"mappings":"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"}
+{"version":3,"file":"Tag.js","sources":["../../../../src/TagGroup/src/Tag.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport clsx from 'clsx';\nimport { AriaButtonProps, useButton } from '@react-aria/button';\nimport { useHover } from '@react-aria/interactions';\nimport { useTag } from '@react-aria/tag';\nimport { mergeProps, mergeRefs } from '@react-aria/utils';\nimport type { ListState } from '@react-stately/list';\nimport type { FocusableElement, Node } from '@react-types/shared';\n\nimport { Icon, useThemeCheck, TooltipIfNeeded } from '@danske/sapphire-react';\nimport { Close, Error } from '@danske/sapphire-icons/react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\nimport { FocusRing } from '@react-aria/focus';\n\nexport interface TagProps<T> {\n  /**\n   * Object representing the tag. Contains relevant information about the tag.\n   */\n  item: Node<T>;\n  /**\n   * State for TagGroup, returned by `useListState`\n   */\n  state: ListState<T>;\n  /**\n   * Shows error icon.\n   * @default 'false'\n   */\n  hasError?: boolean;\n  /**\n   * Control whether the tag is removable or not.\n   * This behavior is overridden to `false` if the tag is disabled.\n   *\n   * @default false\n   */\n  allowsRemoving?: boolean;\n}\n\nexport function Tag<T>(props: TagProps<T>): React.JSX.Element {\n  useThemeCheck();\n  const { hasError = false, item, state } = props;\n  const ref = useRef<HTMLDivElement>(null);\n  const {\n    gridCellProps,\n    isDisabled,\n    isFocused,\n    isPressed,\n    removeButtonProps,\n    rowProps: { onKeyDown, ...rowProps },\n    ...otherProps\n  } = useTag(props, state, ref);\n  const { hoverProps, isHovered } = useHover({ isDisabled });\n  /* hasAction prop is passed when onAction is present, we are using it to set the hover and action classes.\n  The workaround below is made because AriaTagProps Omit's hasAction to avoid typecheck error */\n  const hasAction = (otherProps as any).hasAction;\n\n  return (\n    <TooltipIfNeeded<HTMLDivElement> title={item.rendered}>\n      {(tooltipRef, tooltipProps) => {\n        const { ref: tooltipTargetRef, ...restTooltipProps } =\n          tooltipProps || {};\n        return (\n          <FocusRing focusRingClass={styles['is-focus']}>\n            <div\n              ref={mergeRefs(ref, tooltipTargetRef)}\n              {...mergeProps(\n                {\n                  onKeyDown: (e: React.KeyboardEvent<FocusableElement>) => {\n                    /* We are removing Space key interaction and prevent default behavior to avoid isPressed prop being set\n                  as we do not want to apply is-active class on \"Space\" interaction when having actionable tags with onAction or link */\n                    if (e.key !== ' ') {\n                      onKeyDown?.(e);\n                    } else {\n                      e.preventDefault();\n                    }\n                  },\n                },\n                rowProps,\n                hoverProps,\n                restTooltipProps\n              )}\n              className={clsx(\n                styles['sapphire-tag'],\n                styles['js-focus'],\n                styles['js-hover'],\n                {\n                  [styles['sapphire-tag--actionable']]: hasAction,\n                  [styles['is-active']]: hasAction && isPressed,\n                  [styles['is-hover']]: hasAction && isHovered,\n                  [styles['is-disabled']]: isDisabled,\n                }\n              )}\n              {...(hasError ? { 'aria-invalid': true } : {})}\n            >\n              <div\n                {...gridCellProps}\n                className={styles['sapphire-tag__content']}\n              >\n                {hasError && !isDisabled && <IconError />}\n                <span\n                  ref={tooltipRef as React.Ref<HTMLSpanElement>}\n                  className={styles['sapphire-tag__label']}\n                >\n                  {item.rendered}\n                </span>\n                {!isDisabled && props.allowsRemoving && (\n                  <RemoveButton {...(removeButtonProps as AriaButtonProps)} />\n                )}\n              </div>\n            </div>\n          </FocusRing>\n        );\n      }}\n    </TooltipIfNeeded>\n  );\n}\n\nfunction RemoveButton(removeButtonProps: AriaButtonProps) {\n  const buttonRef = useRef(null);\n  const { buttonProps } = useButton(removeButtonProps, buttonRef);\n  return (\n    <button\n      {...buttonProps}\n      className={clsx(styles['sapphire-tag__button'], styles['js-focus'])}\n    >\n      <Icon size=\"sm\">\n        <Close />\n      </Icon>\n    </button>\n  );\n}\n\nconst IconError = () => {\n  return (\n    <span className={clsx(styles['sapphire-tag__error-icon'])}>\n      <Icon size=\"sm\">\n        <Error />\n      </Icon>\n    </span>\n  );\n};\n"],"names":[],"mappings":"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"}

package/build/esm/TagGroup/src/TagGroup.js

@@ -5,89 +5,68 @@ import { useThemeCheck, Field, Label } from '@danske/sapphire-react';
 import styles from '@danske/sapphire-css/components/tag/tag.module.css';
 import { Tag } from './Tag.js';
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 function TagGroup(props) {
   useThemeCheck();
-  const _a = props, {
+  const {
     contextualHelp,
     errorMessage,
     label: labelText,
     labelPlacement = "above",
     note,
-    onRemove: originalOnRemove
-  } = _a, otherProps = __objRest(_a, [
-    "contextualHelp",
-    "errorMessage",
-    "label",
-    "labelPlacement",
-    "note",
-    "onRemove"
-  ]);
+    onRemove: originalOnRemove,
+    ...otherProps
+  } = props;
   const ref = useRef(null);
   const state = useListState(props);
   const onRemove = originalOnRemove ? (keys) => {
-    console.warn("The `onRemove` prop is deprecated and will be removed in future versions. Use the `onRemove` prop on the `TagItem` component instead.");
+    console.warn(
+      "The `onRemove` prop is deprecated and will be removed in future versions. Use the `onRemove` prop on the `TagItem` component instead."
+    );
     originalOnRemove(keys);
   } : (keys) => {
     Array.from(keys).forEach((key) => {
-      var _a2, _b;
       const item = state.collection.getItem(key);
       if (item) {
-        (_b = (_a2 = item.props).onRemove) == null ? void 0 : _b.call(_a2);
+        item.props.onRemove?.();
       }
     });
   };
-  const { descriptionProps, gridProps, labelProps, errorMessageProps } = useTagGroup(__spreadProps(__spreadValues({}, props), { onRemove }), state, ref);
-  return /* @__PURE__ */ React.createElement(Field, __spreadProps(__spreadValues({}, otherProps), {
-    labelPlacement,
-    labelVerticalAlignment: "top",
-    noDefaultWidth: true
-  }), /* @__PURE__ */ React.createElement(Field.Context, {
-    descriptionProps: errorMessage ? errorMessageProps : descriptionProps
-  }, (labelText || contextualHelp) && /* @__PURE__ */ React.createElement(Field.Label, null, /* @__PURE__ */ React.createElement(Label, __spreadProps(__spreadValues({}, labelProps), {
-    contextualHelp
-  }), labelText)), /* @__PURE__ */ React.createElement(Field.Control, null, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, gridProps), {
-    ref,
-    className: styles["sapphire-tag-group"]
-  }), Array.from(state.collection).map((item) => /* @__PURE__ */ React.createElement(Tag, {
-    key: item.key,
-    item,
-    state,
-    hasError: item.props.hasError,
-    allowsRemoving: !!originalOnRemove || !!item.props.onRemove
-  })))), (note || errorMessage) && (errorMessage ? /* @__PURE__ */ React.createElement(Field.Footer, null, /* @__PURE__ */ React.createElement(Field.Note, {
-    variant: "error"
-  }, errorMessage)) : /* @__PURE__ */ React.createElement(Field.Footer, null, note))));
+  const { descriptionProps, gridProps, labelProps, errorMessageProps } = useTagGroup({ ...props, onRemove }, state, ref);
+  return /* @__PURE__ */ React.createElement(
+    Field,
+    {
+      ...otherProps,
+      labelPlacement,
+      labelVerticalAlignment: "top",
+      noDefaultWidth: true
+    },
+    /* @__PURE__ */ React.createElement(
+      Field.Context,
+      {
+        descriptionProps: errorMessage ? errorMessageProps : descriptionProps
+      },
+      (labelText || contextualHelp) && /* @__PURE__ */ React.createElement(Field.Label, null, /* @__PURE__ */ React.createElement(Label, { ...labelProps, contextualHelp }, labelText)),
+      /* @__PURE__ */ React.createElement(Field.Control, null, /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          ...gridProps,
+          ref,
+          className: styles["sapphire-tag-group"]
+        },
+        Array.from(state.collection).map((item) => /* @__PURE__ */ React.createElement(
+          Tag,
+          {
+            key: item.key,
+            item,
+            state,
+            hasError: item.props.hasError,
+            allowsRemoving: !!originalOnRemove || !!item.props.onRemove
+          }
+        ))
+      )),
+      (note || errorMessage) && (errorMessage ? /* @__PURE__ */ React.createElement(Field.Footer, null, /* @__PURE__ */ React.createElement(Field.Note, { variant: "error" }, errorMessage)) : /* @__PURE__ */ React.createElement(Field.Footer, null, note))
+    )
+  );
 }
 
 export { TagGroup };

package/build/esm/TagGroup/src/TagGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagGroup.js","sources":["../../../../src/TagGroup/src/TagGroup.tsx"],"sourcesContent":["import React, { Key, ReactNode, useRef } from 'react';\nimport { useTagGroup } from '@react-aria/tag';\nimport { useListState } from '@react-stately/list';\nimport {\n  AriaLabelingProps,\n  CollectionBase,\n  DOMProps,\n} from '@react-types/shared';\nimport {\n  Field,\n  Label,\n  SapphireStyleProps,\n  useThemeCheck,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\n\nimport { Tag } from './Tag';\nimport { TagItemProps } from './TagItem';\n\nexport interface TagGroupProps<T>\n  extends CollectionBase<T>,\n    DOMProps,\n    // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n    Pick<\n      AriaLabelingProps,\n      'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n    >,\n    SapphireStyleProps,\n    GlobalDomAttributes {\n  /**\n   * A HelpButton element to place next to the label.\n   */\n  contextualHelp?: ReactNode;\n  /**\n   * Custom error message help text.\n   */\n  errorMessage?: string;\n  /**\n   * The label of the tag group.\n   */\n  label?: string;\n  /**\n   * Places the label either above (default) or on the left side of tags.\n   * @default 'above'\n   */\n  labelPlacement?: 'above' | 'side';\n  /**\n   * Help text description displayed below tags.\n   */\n  note?: string;\n  /**\n   * onAction handler passed down for actionable Tags, called onPress of tags.\n   */\n  onAction?: (key: Key) => void;\n  /**\n   * Handler that is called when a user deletes a tag.\n   *\n   * @deprecated Use `onRemove` prop on the `TagItem` component instead.\n   * This prop will be removed when this component is moved to \"@danske/sapphire-react\".\n   */\n  onRemove?: (keys: Set<Key>) => void;\n}\n\nexport function TagGroup<T extends object>(\n  props: TagGroupProps<T>\n): React.JSX.Element {\n  useThemeCheck();\n  const {\n    contextualHelp,\n    errorMessage,\n    label: labelText,\n    labelPlacement = 'above',\n    note,\n    onRemove: originalOnRemove,\n    ...otherProps\n  } = props;\n  const ref = useRef(null);\n  const state = useListState(props);\n\n  // TODO when moving to \"core\": Remove `originalOnRemove` from here & remove support for `onRemove` prop.\n  // If an external onRemove handler is provided, use it directly.\n  // Otherwise, call individual onRemove handlers on each tag item.\n  const onRemove = originalOnRemove\n    ? (keys: Set<Key>) => {\n        // eslint-disable-next-line no-console -- It's good to warn about the deprecation, but this needs to be removed alongside `onRemove`\n        console.warn(\n          'The `onRemove` prop is deprecated and will be removed in future versions. Use the `onRemove` prop on the `TagItem` component instead.'\n        );\n        originalOnRemove(keys);\n      }\n    : (keys: Set<Key>) => {\n        // Iterate through the keys and call each item's onRemove handler\n        Array.from(keys).forEach((key) => {\n          const item = state.collection.getItem(key);\n          if (item) {\n            (item.props as TagItemProps<T>).onRemove?.();\n          }\n        });\n      };\n\n  const { descriptionProps, gridProps, labelProps, errorMessageProps } =\n    useTagGroup({ ...props, onRemove }, state, ref);\n\n  return (\n    <Field\n      {...otherProps}\n      labelPlacement={labelPlacement}\n      labelVerticalAlignment=\"top\"\n      noDefaultWidth\n    >\n      <Field.Context\n        descriptionProps={errorMessage ? errorMessageProps : descriptionProps}\n      >\n        {(labelText || contextualHelp) && (\n          <Field.Label>\n            <Label {...labelProps} contextualHelp={contextualHelp}>\n              {labelText}\n            </Label>\n          </Field.Label>\n        )}\n        <Field.Control>\n          <div\n            {...gridProps}\n            ref={ref}\n            className={styles['sapphire-tag-group']}\n          >\n            {Array.from(state.collection).map((item) => (\n              <Tag\n                key={item.key}\n                item={item}\n                state={state}\n                hasError={item.props.hasError}\n                // TODO when moving to \"core\": Remove `originalOnRemove` from here & remove support for `onRemove` prop.\n                // Always allow removing if `onRemove` was provided, for backwards compatibility\n                // Allow removal of the tag item if a removal handler is provided\n                allowsRemoving={!!originalOnRemove || !!item.props.onRemove}\n              />\n            ))}\n          </div>\n        </Field.Control>\n        {(note || errorMessage) &&\n          (errorMessage ? (\n            <Field.Footer>\n              <Field.Note variant=\"error\">{errorMessage}</Field.Note>\n            </Field.Footer>\n          ) : (\n            <Field.Footer>{note}</Field.Footer>\n          ))}\n      </Field.Context>\n    </Field>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TagGroup.js","sources":["../../../../src/TagGroup/src/TagGroup.tsx"],"sourcesContent":["import React, { Key, ReactNode, useRef } from 'react';\nimport { useTagGroup } from '@react-aria/tag';\nimport { useListState } from '@react-stately/list';\nimport {\n  AriaLabelingProps,\n  CollectionBase,\n  DOMProps,\n} from '@react-types/shared';\nimport {\n  Field,\n  Label,\n  SapphireStyleProps,\n  useThemeCheck,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\n\nimport { Tag } from './Tag';\nimport { TagItemProps } from './TagItem';\n\nexport interface TagGroupProps<T>\n  extends CollectionBase<T>,\n    DOMProps,\n    // TODO when moving to \"core\", use types under `types.ts` instead of plain strings\n    Pick<\n      AriaLabelingProps,\n      'aria-label' | 'aria-labelledby' | 'aria-describedby' | 'aria-details'\n    >,\n    SapphireStyleProps,\n    GlobalDomAttributes {\n  /**\n   * A HelpButton element to place next to the label.\n   */\n  contextualHelp?: ReactNode;\n  /**\n   * Custom error message help text.\n   */\n  errorMessage?: string;\n  /**\n   * The label of the tag group.\n   */\n  label?: string;\n  /**\n   * Places the label either above (default) or on the left side of tags.\n   * @default 'above'\n   */\n  labelPlacement?: 'above' | 'side';\n  /**\n   * Help text description displayed below tags.\n   */\n  note?: string;\n  /**\n   * onAction handler passed down for actionable Tags, called onPress of tags.\n   */\n  onAction?: (key: Key) => void;\n  /**\n   * Handler that is called when a user deletes a tag.\n   *\n   * @deprecated Use `onRemove` prop on the `TagItem` component instead.\n   * This prop will be removed when this component is moved to \"@danske/sapphire-react\".\n   */\n  onRemove?: (keys: Set<Key>) => void;\n}\n\nexport function TagGroup<T extends object>(\n  props: TagGroupProps<T>\n): React.JSX.Element {\n  useThemeCheck();\n  const {\n    contextualHelp,\n    errorMessage,\n    label: labelText,\n    labelPlacement = 'above',\n    note,\n    onRemove: originalOnRemove,\n    ...otherProps\n  } = props;\n  const ref = useRef(null);\n  const state = useListState(props);\n\n  // TODO when moving to \"core\": Remove `originalOnRemove` from here & remove support for `onRemove` prop.\n  // If an external onRemove handler is provided, use it directly.\n  // Otherwise, call individual onRemove handlers on each tag item.\n  const onRemove = originalOnRemove\n    ? (keys: Set<Key>) => {\n        // eslint-disable-next-line no-console -- It's good to warn about the deprecation, but this needs to be removed alongside `onRemove`\n        console.warn(\n          'The `onRemove` prop is deprecated and will be removed in future versions. Use the `onRemove` prop on the `TagItem` component instead.'\n        );\n        originalOnRemove(keys);\n      }\n    : (keys: Set<Key>) => {\n        // Iterate through the keys and call each item's onRemove handler\n        Array.from(keys).forEach((key) => {\n          const item = state.collection.getItem(key);\n          if (item) {\n            (item.props as TagItemProps<T>).onRemove?.();\n          }\n        });\n      };\n\n  const { descriptionProps, gridProps, labelProps, errorMessageProps } =\n    useTagGroup({ ...props, onRemove }, state, ref);\n\n  return (\n    <Field\n      {...otherProps}\n      labelPlacement={labelPlacement}\n      labelVerticalAlignment=\"top\"\n      noDefaultWidth\n    >\n      <Field.Context\n        descriptionProps={errorMessage ? errorMessageProps : descriptionProps}\n      >\n        {(labelText || contextualHelp) && (\n          <Field.Label>\n            <Label {...labelProps} contextualHelp={contextualHelp}>\n              {labelText}\n            </Label>\n          </Field.Label>\n        )}\n        <Field.Control>\n          <div\n            {...gridProps}\n            ref={ref}\n            className={styles['sapphire-tag-group']}\n          >\n            {Array.from(state.collection).map((item) => (\n              <Tag\n                key={item.key}\n                item={item}\n                state={state}\n                hasError={item.props.hasError}\n                // TODO when moving to \"core\": Remove `originalOnRemove` from here & remove support for `onRemove` prop.\n                // Always allow removing if `onRemove` was provided, for backwards compatibility\n                // Allow removal of the tag item if a removal handler is provided\n                allowsRemoving={!!originalOnRemove || !!item.props.onRemove}\n              />\n            ))}\n          </div>\n        </Field.Control>\n        {(note || errorMessage) &&\n          (errorMessage ? (\n            <Field.Footer>\n              <Field.Note variant=\"error\">{errorMessage}</Field.Note>\n            </Field.Footer>\n          ) : (\n            <Field.Footer>{note}</Field.Footer>\n          ))}\n      </Field.Context>\n    </Field>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAgEO,SAAS,SACd,KAAA,EACmB;AACnB,EAAA,aAAA,EAAc;AACd,EAAA,MAAM;AAAA,IACJ,cAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAA,EAAO,SAAA;AAAA,IACP,cAAA,GAAiB,OAAA;AAAA,IACjB,IAAA;AAAA,IACA,QAAA,EAAU,gBAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,GAAA,GAAM,OAAO,IAAI,CAAA;AACvB,EAAA,MAAM,KAAA,GAAQ,aAAa,KAAK,CAAA;AAKhC,EAAA,MAAM,QAAA,GAAW,gBAAA,GACb,CAAC,IAAA,KAAmB;AAElB,IAAA,OAAA,CAAQ,IAAA;AAAA,MACN;AAAA,KACF;AACA,IAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA,EACvB,CAAA,GACA,CAAC,IAAA,KAAmB;AAElB,IAAA,KAAA,CAAM,IAAA,CAAK,IAAI,CAAA,CAAE,OAAA,CAAQ,CAAC,GAAA,KAAQ;AAChC,MAAA,MAAM,IAAA,GAAO,KAAA,CAAM,UAAA,CAAW,OAAA,CAAQ,GAAG,CAAA;AACzC,MAAA,IAAI,IAAA,EAAM;AACR,QAAC,IAAA,CAAK,MAA0B,QAAA,IAAW;AAAA,MAC7C;AAAA,IACF,CAAC,CAAA;AAAA,EACH,CAAA;AAEJ,EAAA,MAAM,EAAE,gBAAA,EAAkB,SAAA,EAAW,UAAA,EAAY,iBAAA,EAAkB,GACjE,WAAA,CAAY,EAAE,GAAG,KAAA,EAAO,QAAA,EAAS,EAAG,OAAO,GAAG,CAAA;AAEhD,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,cAAA;AAAA,MACA,sBAAA,EAAuB,KAAA;AAAA,MACvB,cAAA,EAAc;AAAA,KAAA;AAAA,oBAEd,KAAA,CAAA,aAAA;AAAA,MAAC,KAAA,CAAM,OAAA;AAAA,MAAN;AAAA,QACC,gBAAA,EAAkB,eAAe,iBAAA,GAAoB;AAAA,OAAA;AAAA,MAAA,CAEnD,SAAA,IAAa,cAAA,qBACb,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,KAAA,EAAN,IAAA,kBACC,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAO,GAAG,UAAA,EAAY,cAAA,EAAA,EACpB,SACH,CACF,CAAA;AAAA,sBAEF,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,OAAA,EAAN,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACE,GAAG,SAAA;AAAA,UACJ,GAAA;AAAA,UACA,SAAA,EAAW,OAAO,oBAAoB;AAAA,SAAA;AAAA,QAErC,MAAM,IAAA,CAAK,KAAA,CAAM,UAAU,CAAA,CAAE,GAAA,CAAI,CAAC,IAAA,qBACjC,KAAA,CAAA,aAAA;AAAA,UAAC,GAAA;AAAA,UAAA;AAAA,YACC,KAAK,IAAA,CAAK,GAAA;AAAA,YACV,IAAA;AAAA,YACA,KAAA;AAAA,YACA,QAAA,EAAU,KAAK,KAAA,CAAM,QAAA;AAAA,YAIrB,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC,KAAK,KAAA,CAAM;AAAA;AAAA,SAEtD;AAAA,OAEL,CAAA;AAAA,MAAA,CACE,IAAA,IAAQ,kBACP,YAAA,mBACC,KAAA,CAAA,aAAA,CAAC,MAAM,MAAA,EAAN,IAAA,sCACE,KAAA,CAAM,IAAA,EAAN,EAAW,OAAA,EAAQ,OAAA,EAAA,EAAS,YAAa,CAC5C,CAAA,uCAEC,KAAA,CAAM,MAAA,EAAN,MAAc,IAAK,CAAA;AAAA;AAE1B,GACF;AAEJ;;;;"}

package/build/esm/TagGroup/src/TagItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagItem.js","sources":["../../../../src/TagGroup/src/TagItem.tsx"],"sourcesContent":["import { Item } from '@react-stately/collections';\nimport { ItemProps } from '@react-types/shared';\n\nexport interface TagItemProps<T> extends ItemProps<T> {\n  /**\n   * Shows error icon.\n   * @default 'false'\n   */\n  hasError?: boolean;\n\n  /**\n   * This function is called when the tag is being removed, either through\n   * clicking the \"X\" button or by any supported key combination.\n   *\n   * @default false\n   *\n   * @note If the `TagGroup` has `onRemove` prop, that implementation will take\n   * precedence over this function.\n   *\n   * @note If the `TagItem` is disabled, this function will not be called.\n   */\n  onRemove?: () => void;\n}\n\nconst TagItem = Item as <T>(props: TagItemProps<T>) => JSX.Element;\n\nexport { TagItem };\n"],"names":[],"mappings":";;AAwBA,MAAM,OAAU,GAAA;;;;"}
+{"version":3,"file":"TagItem.js","sources":["../../../../src/TagGroup/src/TagItem.tsx"],"sourcesContent":["import { Item } from '@react-stately/collections';\nimport { ItemProps } from '@react-types/shared';\n\nexport interface TagItemProps<T> extends ItemProps<T> {\n  /**\n   * Shows error icon.\n   * @default 'false'\n   */\n  hasError?: boolean;\n\n  /**\n   * This function is called when the tag is being removed, either through\n   * clicking the \"X\" button or by any supported key combination.\n   *\n   * @default false\n   *\n   * @note If the `TagGroup` has `onRemove` prop, that implementation will take\n   * precedence over this function.\n   *\n   * @note If the `TagItem` is disabled, this function will not be called.\n   */\n  onRemove?: () => void;\n}\n\nconst TagItem = Item as <T>(props: TagItemProps<T>) => JSX.Element;\n\nexport { TagItem };\n"],"names":[],"mappings":";;AAwBA,MAAM,OAAA,GAAU;;;;"}

package/build/esm/TimeField/i18n/da-DK.json.js

@@ -0,0 +1,7 @@
+var clear$6 = "Nulstil";
+var da = {
+	clear: clear$6
+};
+
+export { clear$6 as clear, da as default };
+//# sourceMappingURL=da-DK.json.js.map

package/build/esm/TimeField/i18n/da-DK.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"da-DK.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/de-DE.json.js

@@ -0,0 +1,7 @@
+var clear$4 = "Zurücksetzen";
+var de = {
+	clear: clear$4
+};
+
+export { clear$4 as clear, de as default };
+//# sourceMappingURL=de-DE.json.js.map

package/build/esm/TimeField/i18n/de-DE.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"de-DE.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/en-US.json.js

@@ -0,0 +1,7 @@
+var clear$5 = "Clear";
+var en = {
+	clear: clear$5
+};
+
+export { clear$5 as clear, en as default };
+//# sourceMappingURL=en-US.json.js.map

package/build/esm/TimeField/i18n/en-US.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en-US.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/fi-FI.json.js

@@ -0,0 +1,7 @@
+var clear$3 = "Nollaa";
+var fi = {
+	clear: clear$3
+};
+
+export { clear$3 as clear, fi as default };
+//# sourceMappingURL=fi-FI.json.js.map

package/build/esm/TimeField/i18n/fi-FI.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fi-FI.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/index.js

@@ -1,10 +1,10 @@
-import da from './da-DK.js';
-import en from './en-US.js';
-import de from './de-DE.js';
-import fi from './fi-FI.js';
-import no from './nb-NO.js';
-import pl from './pl-PL.js';
-import se from './sv-SE.js';
+import da from './da-DK.json.js';
+import en from './en-US.json.js';
+import de from './de-DE.json.js';
+import fi from './fi-FI.json.js';
+import no from './nb-NO.json.js';
+import pl from './pl-PL.json.js';
+import se from './sv-SE.json.js';
 
 var intlMessages = {
   "da-DK": da,

package/build/esm/TimeField/i18n/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/TimeField/i18n/index.ts"],"sourcesContent":["import da from './da-DK.json';\nimport en from './en-US.json';\nimport de from './de-DE.json';\nimport fi from './fi-FI.json';\nimport no from './nb-NO.json';\nimport pl from './pl-PL.json';\nimport se from './sv-SE.json';\n\nexport default {\n  'da-DK': da,\n  'en-US': en,\n  'de-DE': de,\n  'fi-FI': fi,\n  'nb-NO': no,\n  'pl-PL': pl,\n  'sv-SE': se,\n};\n"],"names":[],"mappings":";;;;;;;;AAQA,mBAAe;AAAA,EACb,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,EACT,OAAS,EAAA,EAAA;AAAA,CAAA;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/TimeField/i18n/index.ts"],"sourcesContent":["import da from './da-DK.json';\nimport en from './en-US.json';\nimport de from './de-DE.json';\nimport fi from './fi-FI.json';\nimport no from './nb-NO.json';\nimport pl from './pl-PL.json';\nimport se from './sv-SE.json';\n\nexport default {\n  'da-DK': da,\n  'en-US': en,\n  'de-DE': de,\n  'fi-FI': fi,\n  'nb-NO': no,\n  'pl-PL': pl,\n  'sv-SE': se,\n};\n"],"names":[],"mappings":";;;;;;;;AAQA,mBAAe;AAAA,EACb,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS,EAAA;AAAA,EACT,OAAA,EAAS;AACX,CAAA;;;;"}

package/build/esm/TimeField/i18n/nb-NO.json.js

@@ -0,0 +1,7 @@
+var clear$2 = "Nullstill";
+var no = {
+	clear: clear$2
+};
+
+export { clear$2 as clear, no as default };
+//# sourceMappingURL=nb-NO.json.js.map

package/build/esm/TimeField/i18n/nb-NO.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nb-NO.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/pl-PL.json.js

@@ -0,0 +1,7 @@
+var clear$1 = "Zresetuj";
+var pl = {
+	clear: clear$1
+};
+
+export { clear$1 as clear, pl as default };
+//# sourceMappingURL=pl-PL.json.js.map

package/build/esm/TimeField/i18n/pl-PL.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pl-PL.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/i18n/{sv-SE.js → sv-SE.json.js}

@@ -4,4 +4,4 @@ var se = {
 };
 
 export { clear, se as default };
-//# sourceMappingURL=sv-SE.js.map
+//# sourceMappingURL=sv-SE.json.js.map

package/build/esm/TimeField/i18n/sv-SE.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sv-SE.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/TimeField/src/TimeField.js

@@ -10,95 +10,77 @@ import { CloseOutline } from '@danske/sapphire-icons/react';
 import { useObjectRef } from '@react-aria/utils';
 import intlMessages from '../i18n/index.js';
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 const isAnySegmentModified = (segments) => segments.map(({ type, isPlaceholder }) => {
   return type !== "literal" && !isPlaceholder;
 }).some((isModified) => isModified);
-function _TimeField(_a, ref) {
-  var _b = _a, {
-    size = "lg",
-    noClearButton = false,
-    error,
-    note,
-    contextualHelp,
-    necessityIndicator = false
-  } = _b, otherProps = __objRest(_b, [
-    "size",
-    "noClearButton",
-    "error",
-    "note",
-    "contextualHelp",
-    "necessityIndicator"
-  ]);
+function _TimeField({
+  // TODO many other props
+  size = "lg",
+  noClearButton = false,
+  error,
+  note,
+  contextualHelp,
+  necessityIndicator = false,
+  ...otherProps
+}, ref) {
   useThemeCheck();
   const timeFieldRef = useObjectRef(ref);
   const { locale } = useLocale();
   const formatMessage = useMessageFormatter(intlMessages);
-  const state = useTimeFieldState(__spreadProps(__spreadValues({}, otherProps), {
+  const state = useTimeFieldState({
+    ...otherProps,
     locale,
     isInvalid: error ? true : void 0
-  }));
-  const { fieldProps, labelProps } = useTimeField(__spreadValues({}, otherProps), state, timeFieldRef);
-  return /* @__PURE__ */ React.createElement(Field, __spreadProps(__spreadValues({}, otherProps), {
-    ref,
-    size,
-    noShrink: true
-  }), /* @__PURE__ */ React.createElement(Field.Context, null, otherProps.label && /* @__PURE__ */ React.createElement(Field.Label, null, /* @__PURE__ */ React.createElement(Label, __spreadProps(__spreadValues({}, labelProps), {
-    size,
-    necessityIndicator: otherProps.isRequired && necessityIndicator ? "required" : !otherProps.isRequired && necessityIndicator ? "optional" : void 0,
-    contextualHelp
-  }), otherProps.label))), /* @__PURE__ */ React.createElement(Field.Control, null, /* @__PURE__ */ React.createElement("div", {
-    className: clsx(styles["sapphire-date-field"], {
-      [styles["sapphire-date-field--error"]]: state.isInvalid,
-      [styles["sapphire-date-field--no-clear-button"]]: noClearButton,
-      [styles["sapphire-date-field--no-calendar"]]: true,
-      [styles["sapphire-date-field--md"]]: size === "md"
-    })
-  }, /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, fieldProps), {
-    className: styles["sapphire-date-field__input"],
-    ref: timeFieldRef
-  }), state.segments.map((segment, i) => /* @__PURE__ */ React.createElement(TimeSegment, {
-    key: i,
-    segment,
-    state
-  }))), !noClearButton && !otherProps.isReadOnly && !otherProps.isDisabled && isAnySegmentModified(state.segments) && /* @__PURE__ */ React.createElement(IconButton, {
-    "aria-label": formatMessage("clear"),
-    onPress: () => state.segments.forEach((segment) => state.clearSegment(segment.type)),
-    size: size === "md" ? "sm" : "md",
-    UNSAFE_className: clsx(styles["sapphire-date-field__button"], styles["sapphire-date-field__button--clear"])
-  }, /* @__PURE__ */ React.createElement(Icon, null, /* @__PURE__ */ React.createElement(CloseOutline, null))))), !!error && typeof error !== "boolean" || note ? /* @__PURE__ */ React.createElement(Field.Footer, null, !!error && typeof error !== "boolean" ? /* @__PURE__ */ React.createElement(Field.Note, {
-    variant: "error"
-  }, error) : note ? note : null) : null);
+  });
+  const { fieldProps, labelProps } = useTimeField(
+    { ...otherProps },
+    state,
+    timeFieldRef
+  );
+  return /* @__PURE__ */ React.createElement(Field, { ...otherProps, ref, size, noShrink: true }, /* @__PURE__ */ React.createElement(Field.Context, null, otherProps.label && /* @__PURE__ */ React.createElement(Field.Label, null, /* @__PURE__ */ React.createElement(
+    Label,
+    {
+      ...labelProps,
+      size,
+      necessityIndicator: otherProps.isRequired && necessityIndicator ? "required" : !otherProps.isRequired && necessityIndicator ? "optional" : void 0,
+      contextualHelp
+    },
+    otherProps.label
+  ))), /* @__PURE__ */ React.createElement(Field.Control, null, /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      className: clsx(styles["sapphire-date-field"], {
+        [styles["sapphire-date-field--error"]]: state.isInvalid,
+        [styles["sapphire-date-field--no-clear-button"]]: noClearButton,
+        [styles["sapphire-date-field--no-calendar"]]: true,
+        [styles["sapphire-date-field--md"]]: size === "md"
+      })
+    },
+    /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ...fieldProps,
+        className: styles["sapphire-date-field__input"],
+        ref: timeFieldRef
+      },
+      state.segments.map((segment, i) => /* @__PURE__ */ React.createElement(TimeSegment, { key: i, segment, state }))
+    ),
+    !noClearButton && !otherProps.isReadOnly && !otherProps.isDisabled && isAnySegmentModified(state.segments) && /* @__PURE__ */ React.createElement(
+      IconButton,
+      {
+        "aria-label": formatMessage("clear"),
+        onPress: () => state.segments.forEach(
+          (segment) => state.clearSegment(segment.type)
+        ),
+        size: size === "md" ? "sm" : "md",
+        UNSAFE_className: clsx(
+          styles["sapphire-date-field__button"],
+          styles["sapphire-date-field__button--clear"]
+        )
+      },
+      /* @__PURE__ */ React.createElement(Icon, null, /* @__PURE__ */ React.createElement(CloseOutline, null))
+    )
+  )), !!error && typeof error !== "boolean" || note ? /* @__PURE__ */ React.createElement(Field.Footer, null, !!error && typeof error !== "boolean" ? /* @__PURE__ */ React.createElement(Field.Note, { variant: "error" }, error) : note ? note : null) : null);
 }
 const TimeField = forwardRef(_TimeField);
 

package/build/esm/TimeField/src/TimeField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.js","sources":["../../../../src/TimeField/src/TimeField.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/dateField/dateField.module.css';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  Field,\n  Label,\n  Icon,\n  IconButton,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport { AriaTimeFieldProps, useTimeField } from '@react-aria/datepicker';\nimport { ForwardedRef, forwardRef, RefObject, ReactNode } from 'react';\nimport { TimeValue } from 'react-aria-components';\nimport {\n  useTimeFieldState,\n  DateSegment as DateSegmentType,\n} from '@react-stately/datepicker';\nimport { useLocale, useMessageFormatter } from '@react-aria/i18n';\nimport { TimeSegment } from './TimeFieldSegment';\nimport { CloseOutline } from '@danske/sapphire-icons/react';\nimport { useObjectRef } from '@react-aria/utils';\nimport intlMessages from '../i18n';\n\nconst isAnySegmentModified = (segments: DateSegmentType[]) =>\n  segments\n    .map(({ type, isPlaceholder }) => {\n      // type \"literal\" refers to the segment containing the non-editable separator\n      return type !== 'literal' && !isPlaceholder;\n    })\n    .some((isModified) => isModified);\n\nexport type TimeFieldProps<T extends TimeValue> = Pick<\n  AriaTimeFieldProps<T>,\n  // TODO: when this is moved to `core`, we can replace the picked props with `ValueBasePropsKeys`\n  | 'isDisabled'\n  | 'isRequired'\n  | 'isReadOnly'\n  | 'label'\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'shouldForceLeadingZeros'\n> &\n  SapphireStyleProps &\n  GlobalDomAttributes & {\n    /**\n     * @default 'lg'\n     */\n    size?: 'lg' | 'md';\n    /**\n     * To visually indicate if this field is required or optional.\n     * @default false\n     */\n    necessityIndicator?: boolean;\n    /**\n     * Places the label either above (default) or on the side of the control.\n     * @default 'above'\n     */\n    labelPlacement?: 'side' | 'above';\n    /**\n     * If it should hide the \"clear\" button when input is not empty.\n     *\n     * @default false\n     */\n    noClearButton?: boolean;\n    /**\n     * Whether the input should render as having an error and an error message.\n     * This also sets the appropriate `aria` attributes on the input.\n     *\n     * A `boolean` sets the error state. Can be paired with the \"note\" prop with Field.Note variant=\"error\"\n     * A `ReactNode` sets the error state with an additional error message.\n     *\n     * **An error message is strongly recommended because an error should\n     * always have an explanation about how to fix it.**\n     */\n    error?: boolean | ReactNode;\n    /**\n     * A note to show below the input.\n     * If the input has an error message, this note will be replaced by that.\n     * Use {@Link Field.Note} to render the note.\n     */\n    note?: ReactNode;\n    /**\n     * A HelpButton to render next to the label.\n     */\n    contextualHelp?: ReactNode;\n  };\n\nfunction _TimeField<T extends TimeValue>(\n  {\n    // TODO many other props\n    size = 'lg',\n    noClearButton = false,\n    error,\n    note,\n    contextualHelp,\n    necessityIndicator = false,\n    ...otherProps\n  }: TimeFieldProps<T>,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  useThemeCheck();\n\n  const timeFieldRef = useObjectRef(ref);\n  const { locale } = useLocale();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  const state = useTimeFieldState({\n    ...otherProps,\n    locale,\n    isInvalid: error ? true : undefined,\n  });\n\n  const { fieldProps, labelProps } = useTimeField(\n    { ...otherProps },\n    state,\n    timeFieldRef\n  );\n\n  return (\n    <Field {...otherProps} ref={ref} size={size} noShrink>\n      <Field.Context>\n        {otherProps.label && (\n          <Field.Label>\n            <Label\n              {...labelProps}\n              size={size}\n              necessityIndicator={\n                otherProps.isRequired && necessityIndicator\n                  ? 'required'\n                  : !otherProps.isRequired && necessityIndicator\n                  ? 'optional'\n                  : undefined\n              }\n              contextualHelp={contextualHelp}\n            >\n              {otherProps.label}\n            </Label>\n          </Field.Label>\n        )}\n      </Field.Context>\n      <Field.Control>\n        <div\n          className={clsx(styles['sapphire-date-field'], {\n            [styles['sapphire-date-field--error']]: state.isInvalid,\n            [styles['sapphire-date-field--no-clear-button']]: noClearButton,\n            [styles['sapphire-date-field--no-calendar']]: true,\n            [styles['sapphire-date-field--md']]: size === 'md',\n          })}\n        >\n          <div\n            {...fieldProps}\n            className={styles['sapphire-date-field__input']}\n            ref={timeFieldRef}\n          >\n            {state.segments.map((segment, i) => (\n              <TimeSegment key={i} segment={segment} state={state} />\n            ))}\n          </div>\n          {!noClearButton &&\n            !otherProps.isReadOnly &&\n            !otherProps.isDisabled &&\n            isAnySegmentModified(state.segments) && (\n              <IconButton\n                aria-label={formatMessage('clear')}\n                onPress={() =>\n                  state.segments.forEach((segment) =>\n                    state.clearSegment(segment.type)\n                  )\n                }\n                size={size === 'md' ? 'sm' : 'md'}\n                UNSAFE_className={clsx(\n                  styles['sapphire-date-field__button'],\n                  styles['sapphire-date-field__button--clear']\n                )}\n              >\n                <Icon>\n                  <CloseOutline />\n                </Icon>\n              </IconButton>\n            )}\n        </div>\n      </Field.Control>\n      {(!!error && typeof error !== 'boolean') || note ? (\n        <Field.Footer>\n          {!!error && typeof error !== 'boolean' ? (\n            <Field.Note variant=\"error\">{error}</Field.Note>\n          ) : note ? (\n            note\n          ) : null}\n        </Field.Footer>\n      ) : null}\n    </Field>\n  );\n}\n\nexport const TimeField = forwardRef(_TimeField) as <T extends TimeValue>(\n  props: TimeFieldProps<T> & { ref?: RefObject<HTMLDivElement> }\n) => React.ReactElement;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"TimeField.js","sources":["../../../../src/TimeField/src/TimeField.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/dateField/dateField.module.css';\nimport {\n  SapphireStyleProps,\n  useThemeCheck,\n  Field,\n  Label,\n  Icon,\n  IconButton,\n  GlobalDomAttributes,\n} from '@danske/sapphire-react';\nimport { AriaTimeFieldProps, useTimeField } from '@react-aria/datepicker';\nimport { ForwardedRef, forwardRef, RefObject, ReactNode } from 'react';\nimport { TimeValue } from 'react-aria-components';\nimport {\n  useTimeFieldState,\n  DateSegment as DateSegmentType,\n} from '@react-stately/datepicker';\nimport { useLocale, useMessageFormatter } from '@react-aria/i18n';\nimport { TimeSegment } from './TimeFieldSegment';\nimport { CloseOutline } from '@danske/sapphire-icons/react';\nimport { useObjectRef } from '@react-aria/utils';\nimport intlMessages from '../i18n';\n\nconst isAnySegmentModified = (segments: DateSegmentType[]) =>\n  segments\n    .map(({ type, isPlaceholder }) => {\n      // type \"literal\" refers to the segment containing the non-editable separator\n      return type !== 'literal' && !isPlaceholder;\n    })\n    .some((isModified) => isModified);\n\nexport type TimeFieldProps<T extends TimeValue> = Pick<\n  AriaTimeFieldProps<T>,\n  // TODO: when this is moved to `core`, we can replace the picked props with `ValueBasePropsKeys`\n  | 'isDisabled'\n  | 'isRequired'\n  | 'isReadOnly'\n  | 'label'\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'shouldForceLeadingZeros'\n> &\n  SapphireStyleProps &\n  GlobalDomAttributes & {\n    /**\n     * @default 'lg'\n     */\n    size?: 'lg' | 'md';\n    /**\n     * To visually indicate if this field is required or optional.\n     * @default false\n     */\n    necessityIndicator?: boolean;\n    /**\n     * Places the label either above (default) or on the side of the control.\n     * @default 'above'\n     */\n    labelPlacement?: 'side' | 'above';\n    /**\n     * If it should hide the \"clear\" button when input is not empty.\n     *\n     * @default false\n     */\n    noClearButton?: boolean;\n    /**\n     * Whether the input should render as having an error and an error message.\n     * This also sets the appropriate `aria` attributes on the input.\n     *\n     * A `boolean` sets the error state. Can be paired with the \"note\" prop with Field.Note variant=\"error\"\n     * A `ReactNode` sets the error state with an additional error message.\n     *\n     * **An error message is strongly recommended because an error should\n     * always have an explanation about how to fix it.**\n     */\n    error?: boolean | ReactNode;\n    /**\n     * A note to show below the input.\n     * If the input has an error message, this note will be replaced by that.\n     * Use {@Link Field.Note} to render the note.\n     */\n    note?: ReactNode;\n    /**\n     * A HelpButton to render next to the label.\n     */\n    contextualHelp?: ReactNode;\n  };\n\nfunction _TimeField<T extends TimeValue>(\n  {\n    // TODO many other props\n    size = 'lg',\n    noClearButton = false,\n    error,\n    note,\n    contextualHelp,\n    necessityIndicator = false,\n    ...otherProps\n  }: TimeFieldProps<T>,\n  ref: ForwardedRef<HTMLDivElement>\n) {\n  useThemeCheck();\n\n  const timeFieldRef = useObjectRef(ref);\n  const { locale } = useLocale();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  const state = useTimeFieldState({\n    ...otherProps,\n    locale,\n    isInvalid: error ? true : undefined,\n  });\n\n  const { fieldProps, labelProps } = useTimeField(\n    { ...otherProps },\n    state,\n    timeFieldRef\n  );\n\n  return (\n    <Field {...otherProps} ref={ref} size={size} noShrink>\n      <Field.Context>\n        {otherProps.label && (\n          <Field.Label>\n            <Label\n              {...labelProps}\n              size={size}\n              necessityIndicator={\n                otherProps.isRequired && necessityIndicator\n                  ? 'required'\n                  : !otherProps.isRequired && necessityIndicator\n                  ? 'optional'\n                  : undefined\n              }\n              contextualHelp={contextualHelp}\n            >\n              {otherProps.label}\n            </Label>\n          </Field.Label>\n        )}\n      </Field.Context>\n      <Field.Control>\n        <div\n          className={clsx(styles['sapphire-date-field'], {\n            [styles['sapphire-date-field--error']]: state.isInvalid,\n            [styles['sapphire-date-field--no-clear-button']]: noClearButton,\n            [styles['sapphire-date-field--no-calendar']]: true,\n            [styles['sapphire-date-field--md']]: size === 'md',\n          })}\n        >\n          <div\n            {...fieldProps}\n            className={styles['sapphire-date-field__input']}\n            ref={timeFieldRef}\n          >\n            {state.segments.map((segment, i) => (\n              <TimeSegment key={i} segment={segment} state={state} />\n            ))}\n          </div>\n          {!noClearButton &&\n            !otherProps.isReadOnly &&\n            !otherProps.isDisabled &&\n            isAnySegmentModified(state.segments) && (\n              <IconButton\n                aria-label={formatMessage('clear')}\n                onPress={() =>\n                  state.segments.forEach((segment) =>\n                    state.clearSegment(segment.type)\n                  )\n                }\n                size={size === 'md' ? 'sm' : 'md'}\n                UNSAFE_className={clsx(\n                  styles['sapphire-date-field__button'],\n                  styles['sapphire-date-field__button--clear']\n                )}\n              >\n                <Icon>\n                  <CloseOutline />\n                </Icon>\n              </IconButton>\n            )}\n        </div>\n      </Field.Control>\n      {(!!error && typeof error !== 'boolean') || note ? (\n        <Field.Footer>\n          {!!error && typeof error !== 'boolean' ? (\n            <Field.Note variant=\"error\">{error}</Field.Note>\n          ) : note ? (\n            note\n          ) : null}\n        </Field.Footer>\n      ) : null}\n    </Field>\n  );\n}\n\nexport const TimeField = forwardRef(_TimeField) as <T extends TimeValue>(\n  props: TimeFieldProps<T> & { ref?: RefObject<HTMLDivElement> }\n) => React.ReactElement;\n"],"names":[],"mappings":";;;;;;;;;;;;AAyBA,MAAM,oBAAA,GAAuB,CAAC,QAAA,KAC5B,QAAA,CACG,IAAI,CAAC,EAAE,IAAA,EAAM,aAAA,EAAc,KAAM;AAEhC,EAAA,OAAO,IAAA,KAAS,aAAa,CAAC,aAAA;AAChC,CAAC,CAAA,CACA,IAAA,CAAK,CAAC,UAAA,KAAe,UAAU,CAAA;AA6DpC,SAAS,UAAA,CACP;AAAA;AAAA,EAEE,IAAA,GAAO,IAAA;AAAA,EACP,aAAA,GAAgB,KAAA;AAAA,EAChB,KAAA;AAAA,EACA,IAAA;AAAA,EACA,cAAA;AAAA,EACA,kBAAA,GAAqB,KAAA;AAAA,EACrB,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,aAAA,EAAc;AAEd,EAAA,MAAM,YAAA,GAAe,aAAa,GAAG,CAAA;AACrC,EAAA,MAAM,EAAE,MAAA,EAAO,GAAI,SAAA,EAAU;AAC7B,EAAA,MAAM,aAAA,GAAgB,oBAAoB,YAAY,CAAA;AAEtD,EAAA,MAAM,QAAQ,iBAAA,CAAkB;AAAA,IAC9B,GAAG,UAAA;AAAA,IACH,MAAA;AAAA,IACA,SAAA,EAAW,QAAQ,IAAA,GAAO;AAAA,GAC3B,CAAA;AAED,EAAA,MAAM,EAAE,UAAA,EAAY,UAAA,EAAW,GAAI,YAAA;AAAA,IACjC,EAAE,GAAG,UAAA,EAAW;AAAA,IAChB,KAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,2CACG,KAAA,EAAA,EAAO,GAAG,UAAA,EAAY,GAAA,EAAU,MAAY,QAAA,EAAQ,IAAA,EAAA,kBACnD,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,SAAN,IAAA,EACE,UAAA,CAAW,yBACV,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,OAAN,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,UAAA;AAAA,MACJ,IAAA;AAAA,MACA,kBAAA,EACE,WAAW,UAAA,IAAc,kBAAA,GACrB,aACA,CAAC,UAAA,CAAW,UAAA,IAAc,kBAAA,GAC1B,UAAA,GACA,MAAA;AAAA,MAEN;AAAA,KAAA;AAAA,IAEC,UAAA,CAAW;AAAA,GAEhB,CAEJ,CAAA,kBACA,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,SAAN,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,IAAA,CAAK,MAAA,CAAO,qBAAqB,CAAA,EAAG;AAAA,QAC7C,CAAC,MAAA,CAAO,4BAA4B,CAAC,GAAG,KAAA,CAAM,SAAA;AAAA,QAC9C,CAAC,MAAA,CAAO,sCAAsC,CAAC,GAAG,aAAA;AAAA,QAClD,CAAC,MAAA,CAAO,kCAAkC,CAAC,GAAG,IAAA;AAAA,QAC9C,CAAC,MAAA,CAAO,yBAAyB,CAAC,GAAG,IAAA,KAAS;AAAA,OAC/C;AAAA,KAAA;AAAA,oBAED,KAAA,CAAA,aAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACE,GAAG,UAAA;AAAA,QACJ,SAAA,EAAW,OAAO,4BAA4B,CAAA;AAAA,QAC9C,GAAA,EAAK;AAAA,OAAA;AAAA,MAEJ,KAAA,CAAM,QAAA,CAAS,GAAA,CAAI,CAAC,OAAA,EAAS,CAAA,qBAC5B,KAAA,CAAA,aAAA,CAAC,WAAA,EAAA,EAAY,GAAA,EAAK,CAAA,EAAG,OAAA,EAAkB,KAAA,EAAc,CACtD;AAAA,KACH;AAAA,IACC,CAAC,aAAA,IACA,CAAC,UAAA,CAAW,UAAA,IACZ,CAAC,UAAA,CAAW,UAAA,IACZ,oBAAA,CAAqB,KAAA,CAAM,QAAQ,CAAA,oBACjC,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,YAAA,EAAY,cAAc,OAAO,CAAA;AAAA,QACjC,OAAA,EAAS,MACP,KAAA,CAAM,QAAA,CAAS,OAAA;AAAA,UAAQ,CAAC,OAAA,KACtB,KAAA,CAAM,YAAA,CAAa,QAAQ,IAAI;AAAA,SACjC;AAAA,QAEF,IAAA,EAAM,IAAA,KAAS,IAAA,GAAO,IAAA,GAAO,IAAA;AAAA,QAC7B,gBAAA,EAAkB,IAAA;AAAA,UAChB,OAAO,6BAA6B,CAAA;AAAA,UACpC,OAAO,oCAAoC;AAAA;AAC7C,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA,CAAC,IAAA,EAAA,IAAA,kBACC,KAAA,CAAA,aAAA,CAAC,YAAA,EAAA,IAAa,CAChB;AAAA;AACF,GAGR,CAAA,EACE,CAAC,CAAC,KAAA,IAAS,OAAO,KAAA,KAAU,SAAA,IAAc,IAAA,mBAC1C,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,MAAA,EAAN,MACE,CAAC,CAAC,KAAA,IAAS,OAAO,KAAA,KAAU,SAAA,mBAC3B,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,MAAN,EAAW,OAAA,EAAQ,OAAA,EAAA,EAAS,KAAM,CAAA,GACjC,IAAA,GACF,IAAA,GACE,IACN,IACE,IACN,CAAA;AAEJ;AAEO,MAAM,SAAA,GAAY,WAAW,UAAU;;;;"}