@kaizen/components 1.28.0 → 1.30.0

package/dist/esm/Tag/Tag.module.scss.mjs

@@ -0,0 +1,36 @@
+var styles = {
+  "root": "Tag-module_root__uRhoc",
+  "profile": "Tag-module_profile__OoGsS",
+  "layoutContainer": "Tag-module_layoutContainer__pBLSz",
+  "validationIcon": "Tag-module_validationIcon__B-YLv",
+  "textContent": "Tag-module_textContent__q76X-",
+  "iconWrapper": "Tag-module_iconWrapper__aPrKH",
+  "dismissButton": "Tag-module_dismissButton__rHv7r",
+  "background": "Tag-module_background__LkzGB",
+  "truncate": "Tag-module_truncate__5w7HW",
+  "inline": "Tag-module_inline__pPM-d",
+  "medium": "Tag-module_medium__NkOrv",
+  "small": "Tag-module_small__-xyNk",
+  "default": "Tag-module_default__6PVke",
+  "sentimentPositive": "Tag-module_sentimentPositive__nbqE1",
+  "sentimentNeutral": "Tag-module_sentimentNeutral__8BtD8",
+  "sentimentNegative": "Tag-module_sentimentNegative__1J85t",
+  "sentimentNone": "Tag-module_sentimentNone__8BWjU",
+  "validationPositive": "Tag-module_validationPositive__vgFUE",
+  "validationInformative": "Tag-module_validationInformative__bnJ4A",
+  "validationNegative": "Tag-module_validationNegative__lZgIY",
+  "validationCautionary": "Tag-module_validationCautionary__ERS2t",
+  "statusLive": "Tag-module_statusLive__xG48w",
+  "statusAction": "Tag-module_statusAction__woL-O",
+  "statusClosed": "Tag-module_statusClosed__VhZP-",
+  "statusDraft": "Tag-module_statusDraft__9QZDv",
+  "liveIcon": "Tag-module_liveIcon__URtak",
+  "liveIcon_base": "Tag-module_liveIcon_base__Nk5um",
+  "liveIcon_1": "Tag-module_liveIcon_1__STFJY",
+  "liveIcon_2": "Tag-module_liveIcon_2__rko-D",
+  "liveIcon_3": "Tag-module_liveIcon_3__fL71y",
+  "pulse-inner": "Tag-module_pulse-inner__0-JFL",
+  "pulse-outer": "Tag-module_pulse-outer__f9Oox"
+};
+export { styles as default };
+//# sourceMappingURL=Tag.module.scss.mjs.map

package/dist/esm/Tag/Tag.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/Tile/InformationTile/InformationTile.mjs

@@ -0,0 +1,17 @@
+import { __assign } from 'tslib';
+import React from 'react';
+import { GenericTile } from '../subcomponents/GenericTile/GenericTile.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#InformationTile%3A Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tiles-informationtile--docs Storybook}
+ */
+const InformationTile = /*#__PURE__*/function () {
+  const InformationTile = function (props) {
+    return /*#__PURE__*/React.createElement(GenericTile, __assign({}, props));
+  };
+  InformationTile.displayName = "InformationTile";
+  return InformationTile;
+}();
+export { InformationTile };
+//# sourceMappingURL=InformationTile.mjs.map

package/dist/esm/Tile/InformationTile/InformationTile.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InformationTile.mjs","sources":["../../../../src/Tile/InformationTile/InformationTile.tsx"],"sourcesContent":["import React from \"react\"\nimport { GenericTile, GenericTileProps } from \"../subcomponents/GenericTile\"\n\nexport type InformationTileProps = GenericTileProps\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#InformationTile%3A Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-tiles-informationtile--docs Storybook}\n */\nexport const InformationTile = (props: InformationTileProps): JSX.Element => (\n  <GenericTile {...props} />\n)\n\nInformationTile.displayName = \"InformationTile\"\n"],"names":["InformationTile","props","React","createElement","GenericTile","__assign","displayName"],"mappings":";;;;AAKA;;;AAGG;AAHH,MAIaA,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,KAA2B,EAAkB;IAAA,oBAC3EC,KAAA,CAAAC,aAAA,CAACC,WAAW,EAAKC,QAAA,CAAA,CAAA,CAAA,EAAAJ,KAAK,EAAI;EAC3B,CAAA;EAEDD,eAAe,CAACM,WAAW,GAAG,iBAAiB;EAAA,OAJlCN,eAAe;AAAA;"}

package/dist/esm/Tile/MultiActionTile/MultiActionTile.mjs

@@ -0,0 +1,36 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import { GenericTile } from '../subcomponents/GenericTile/GenericTile.mjs';
+import Action from '../subcomponents/GenericTile/Action.mjs';
+import styles from './MultiActionTile.module.scss.mjs';
+var renderActions = function (primaryAction, secondaryAction) {
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.actions
+  }, secondaryAction && /*#__PURE__*/React.createElement("div", {
+    className: "mr-8"
+  }, /*#__PURE__*/React.createElement(Action, {
+    action: secondaryAction,
+    secondary: true
+  })), /*#__PURE__*/React.createElement(Action, {
+    action: primaryAction
+  }));
+};
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#MultiActionTile.1 Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-tiles-multiactiontile--docs Storybook}
+ */
+const MultiActionTile = /*#__PURE__*/function () {
+  const MultiActionTile = function (_a) {
+    var children = _a.children,
+      primaryAction = _a.primaryAction,
+      secondaryAction = _a.secondaryAction,
+      restProps = __rest(_a, ["children", "primaryAction", "secondaryAction"]);
+    return /*#__PURE__*/React.createElement(GenericTile, __assign({
+      footer: renderActions(primaryAction, secondaryAction)
+    }, restProps), children);
+  };
+  MultiActionTile.displayName = "MultiActionTile";
+  return MultiActionTile;
+}();
+export { MultiActionTile };
+//# sourceMappingURL=MultiActionTile.mjs.map

package/dist/esm/Tile/MultiActionTile/MultiActionTile.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiActionTile.mjs","sources":["../../../../src/Tile/MultiActionTile/MultiActionTile.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  GenericTile,\n  GenericTileProps,\n  TileAction,\n} from \"../subcomponents/GenericTile\"\nimport Action from \"../subcomponents/GenericTile/Action\"\nimport styles from \"./MultiActionTile.module.scss\"\n\nexport type MultiActionTileProps = {\n  primaryAction: TileAction\n  secondaryAction?: TileAction\n} & Omit<GenericTileProps, \"footer\">\n\nconst renderActions = (\n  primaryAction: TileAction,\n  secondaryAction?: TileAction\n): JSX.Element => (\n  <div className={styles.actions}>\n    {secondaryAction && (\n      <div className=\"mr-8\">\n        <Action action={secondaryAction} secondary />\n      </div>\n    )}\n    <Action action={primaryAction} />\n  </div>\n)\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#MultiActionTile.1 Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-tiles-multiactiontile--docs Storybook}\n */\nexport const MultiActionTile = ({\n  children,\n  primaryAction,\n  secondaryAction,\n  ...restProps\n}: MultiActionTileProps): JSX.Element => (\n  <GenericTile\n    footer={renderActions(primaryAction, secondaryAction)}\n    {...restProps}\n  >\n    {children}\n  </GenericTile>\n)\n\nMultiActionTile.displayName = \"MultiActionTile\"\n"],"names":["renderActions","primaryAction","secondaryAction","React","createElement","className","styles","actions","Action","action","secondary","MultiActionTile","_a","children","restProps","__rest","GenericTile","footer","displayName"],"mappings":";;;;;AAcA,IAAMA,aAAa,GAAG,SAAAA,CACpBC,aAAyB,EACzBC,eAA4B,EAAA;EACZ,oBAChBC,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAEC,MAAM,CAACC;EAAO,CAAA,EAC3BL,eAAe,iBACdC,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAC;EAAM,CAAA,eACnBF,KAAC,CAAAC,aAAA,CAAAI,MAAM;IAACC,MAAM,EAAEP,eAAe;IAAEQ,SAAS,EAAG;EAAA,CAAA,CAAA,CAEhD,eACDP,KAAC,CAAAC,aAAA,CAAAI,MAAM,EAAC;IAAAC,MAAM,EAAER;IAAiB,CAC7B;CACP;AAED;;;AAGG;AAHH,MAIaU,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJrB,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRZ,aAAa,GAAAW,EAAA,CAAAX,aAAA;MACbC,eAAe,GAAAU,EAAA,CAAAV,eAAA;MACZY,SAAS,GAJkBC,MAAA,CAAAH,EAAA,EAAA,CAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,CAK/B,CADa;IAC2B,oBACvCT,KAAC,CAAAC,aAAA,CAAAY,WAAW;MACVC,MAAM,EAAEjB,aAAa,CAACC,aAAa,EAAEC,eAAe;IAAC,CACjD,EAAAY,SAAS,GAEZD,QAAQ,CACG;GACf;EAEDF,eAAe,CAACO,WAAW,GAAG,iBAAiB;EAAA,OAdlCP,eAAe;AAAA;"}

package/dist/esm/Tile/MultiActionTile/MultiActionTile.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "actions": "MultiActionTile-module_actions__mntsC"
+};
+export { styles as default };
+//# sourceMappingURL=MultiActionTile.module.scss.mjs.map

package/dist/esm/Tile/MultiActionTile/MultiActionTile.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiActionTile.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Tile/TileGrid/TileGrid.mjs

@@ -0,0 +1,24 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import styles from './TileGrid.module.scss.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#TileGrid Guidance} |
+ * {@link https://cultureamp.design/storybook/?path=/docs/components-tiles-tilegrid--docs Storybook}
+ */
+const TileGrid = /*#__PURE__*/function () {
+  const TileGrid = function (_a) {
+    var children = _a.children,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["children", "classNameOverride"]);
+    return /*#__PURE__*/React.createElement("div", __assign({
+      className: classnames(styles.grid, classNameOverride),
+      "data-tile-grid": true
+    }, restProps), children);
+  };
+  TileGrid.displayName = "TileGrid";
+  return TileGrid;
+}();
+export { TileGrid };
+//# sourceMappingURL=TileGrid.mjs.map

package/dist/esm/Tile/TileGrid/TileGrid.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TileGrid.mjs","sources":["../../../../src/Tile/TileGrid/TileGrid.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactElement } from \"react\"\nimport classnames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { InformationTileProps } from \"../InformationTile\"\nimport { MultiActionTileProps } from \"../MultiActionTile\"\nimport styles from \"./TileGrid.module.scss\"\n\ntype TileProps = InformationTileProps | MultiActionTileProps\n\nexport type TileElement = ReactElement<TileProps>\n\nexport interface TileGridProps\n  extends OverrideClassName<HTMLAttributes<HTMLDivElement>> {\n  children: TileElement[] | TileElement\n}\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#TileGrid Guidance} |\n * {@link https://cultureamp.design/storybook/?path=/docs/components-tiles-tilegrid--docs Storybook}\n */\nexport const TileGrid = ({\n  children,\n  classNameOverride,\n  ...restProps\n}: TileGridProps): JSX.Element => (\n  <div\n    className={classnames(styles.grid, classNameOverride)}\n    data-tile-grid\n    {...restProps}\n  >\n    {children}\n  </div>\n)\n\nTileGrid.displayName = \"TileGrid\"\n"],"names":["TileGrid","_a","children","classNameOverride","restProps","__rest","React","createElement","__assign","className","classnames","styles","grid","displayName"],"mappings":";;;;;AAgBA;;;AAGG;AAHH,MAIaA,QAAQ;EAAA,MAARA,QAAQ,GAAG,SAAAA,CAACC,EAIT,EAAA;IAHd,IAAAC,QAAQ,cAAA;MACRC,iBAAiB,uBAAA;MACdC,SAAS,GAHWC,MAAA,CAAAJ,EAAA,EAAA,CAAA,UAAA,EAAA,mBAAA,CAIxB,CADa;IACoB,oBAChCK,KACE,CAAAC,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACC,IAAI,EAAET,iBAAiB,CAAC;MAEjD,gBAAA,EAAA;IAAA,CAAA,EAAAC,SAAS,GAEZF,QAAQ,CACL;GACP;EAEDF,QAAQ,CAACa,WAAW,GAAG,UAAU;EAAA,OAdpBb,QAAQ;AAAA;"}

package/dist/esm/Tile/TileGrid/TileGrid.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "grid": "TileGrid-module_grid__1WCNc"
+};
+export { styles as default };
+//# sourceMappingURL=TileGrid.module.scss.mjs.map

package/dist/esm/Tile/TileGrid/TileGrid.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TileGrid.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/Tile/subcomponents/GenericTile/Action.mjs

@@ -0,0 +1,28 @@
+import React from 'react';
+import { Button } from '../../../Button/Button/Button.mjs';
+import '../../../Button/IconButton/IconButton.mjs';
+var Action = function (_a) {
+  var action = _a.action,
+    _b = _a.secondary,
+    secondary = _b === void 0 ? false : _b,
+    _c = _a.disabled,
+    disabled = _c === void 0 ? false : _c;
+  var label = action.label,
+    href = action.href,
+    onClick = action.onClick,
+    icon = action.icon,
+    automationId = action.automationId,
+    newTabAndIUnderstandTheAccessibilityImplications = action.newTabAndIUnderstandTheAccessibilityImplications;
+  return /*#__PURE__*/React.createElement(Button, {
+    label: label,
+    href: href,
+    onClick: onClick,
+    secondary: secondary,
+    icon: icon,
+    "data-automation-id": automationId,
+    disabled: disabled,
+    newTabAndIUnderstandTheAccessibilityImplications: newTabAndIUnderstandTheAccessibilityImplications
+  });
+};
+export { Action as default };
+//# sourceMappingURL=Action.mjs.map

package/dist/esm/Tile/subcomponents/GenericTile/Action.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Action.mjs","sources":["../../../../../src/Tile/subcomponents/GenericTile/Action.tsx"],"sourcesContent":["import React from \"react\"\nimport { Button } from \"~components/Button\"\nimport { TileAction } from \"./GenericTile\"\n\ntype ActionProps = {\n  action: TileAction\n  secondary?: boolean\n  disabled?: boolean\n}\n\nconst Action = ({\n  action,\n  secondary = false,\n  disabled = false,\n}: ActionProps): JSX.Element => {\n  const {\n    label,\n    href,\n    onClick,\n    icon,\n    automationId,\n    newTabAndIUnderstandTheAccessibilityImplications,\n  } = action\n\n  return (\n    <Button\n      label={label}\n      href={href}\n      onClick={onClick}\n      secondary={secondary}\n      icon={icon}\n      data-automation-id={automationId}\n      disabled={disabled}\n      newTabAndIUnderstandTheAccessibilityImplications={\n        newTabAndIUnderstandTheAccessibilityImplications\n      }\n    />\n  )\n}\n\nexport default Action\n"],"names":["Action","_a","action","_b","secondary","_c","disabled","label","href","onClick","icon","automationId","newTabAndIUnderstandTheAccessibilityImplications","React","createElement","Button"],"mappings":";;;AAUM,IAAAA,MAAM,GAAG,SAAAA,CAACC,EAIF,EAAA;EAHZ,IAAAC,MAAM,GAAAD,EAAA,CAAAC,MAAA;IACNC,EAAiB,GAAAF,EAAA,CAAAG,SAAA;IAAjBA,SAAS,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;IACjBE,EAAgB,GAAAJ,EAAA,CAAAK,QAAA;IAAhBA,QAAQ,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAAA,EAAA;EAGd,IAAAE,KAAK,GAMHL,MAAM,CAAAK,KANH;IACLC,IAAI,GAKFN,MAAM,CALJM,IAAA;IACJC,OAAO,GAILP,MAAM,CAAAO,OAJD;IACPC,IAAI,GAGFR,MAAM,CAHJQ,IAAA;IACJC,YAAY,GAEVT,MAAM,CAAAS,YAFI;IACZC,gDAAgD,GAC9CV,MAAM,iDADwC;EAGlD,oBACEW,KAAA,CAAAC,aAAA,CAACC,MAAM,EAAA;IACLR,KAAK,EAAEA,KAAK;IACZC,IAAI,EAAEA,IAAI;IACVC,OAAO,EAAEA,OAAO;IAChBL,SAAS,EAAEA,SAAS;IACpBM,IAAI,EAAEA,IAAI;IAAA,oBAAA,EACUC,YAAY;IAChCL,QAAQ,EAAEA,QAAQ;IAClBM,gDAAgD,EAC9CA;EAAgD,CAAA,CAElD;AAEN,CAAA;"}

package/dist/esm/Tile/subcomponents/GenericTile/GenericTile.mjs

@@ -0,0 +1,115 @@
+import { __rest, __assign } from 'tslib';
+import React, { useState } from 'react';
+import classnames from 'classnames';
+import '../../../Button/Button/Button.mjs';
+import { IconButton } from '../../../Button/IconButton/IconButton.mjs';
+import { Heading } from '../../../Heading/Heading.mjs';
+import 'uuid';
+import '../../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../../Icon/ArrowBackwardIcon.mjs';
+import { InformationIcon } from '../../../Icon/InformationIcon.mjs';
+import { Text } from '../../../Text/Text.mjs';
+import Action from './Action.mjs';
+import styles from './GenericTile.module.scss.mjs';
+const GenericTile = /*#__PURE__*/function () {
+  const GenericTile = function (_a) {
+    var children = _a.children,
+      title = _a.title,
+      _b = _a.titleTag,
+      titleTag = _b === void 0 ? "h3" : _b,
+      metadata = _a.metadata,
+      information = _a.information,
+      mood = _a.mood,
+      footer = _a.footer,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["children", "title", "titleTag", "metadata", "information", "mood", "footer", "classNameOverride"]);
+    var _c = useState(false),
+      isFlipped = _c[0],
+      setIsFlipped = _c[1];
+    var renderTitle = function () {
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles.title
+      }, /*#__PURE__*/React.createElement(Heading, {
+        variant: "heading-3",
+        tag: titleTag
+      }, title), metadata && /*#__PURE__*/React.createElement("div", {
+        className: "pt-4"
+      }, /*#__PURE__*/React.createElement(Text, {
+        variant: "small",
+        color: "dark-reduced-opacity"
+      }, metadata)));
+    };
+    var renderActions = function (primaryAction, secondaryAction, disabled) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: styles.actions
+      }, secondaryAction && /*#__PURE__*/React.createElement(Action, {
+        action: secondaryAction,
+        secondary: true,
+        disabled: disabled
+      }), primaryAction && /*#__PURE__*/React.createElement(Action, {
+        action: primaryAction,
+        disabled: disabled
+      }));
+    };
+    var renderFront = function () {
+      return /*#__PURE__*/React.createElement("div", {
+        className: classnames(styles.face, styles.faceFront, mood === "positive" && styles.faceMoodPositive, mood === "informative" && styles.faceMoodInformative, mood === "cautionary" && styles.faceMoodCautionary, mood === "assertive" && styles.faceMoodAssertive, mood === "negative" && styles.faceMoodNegative, mood === "prominent" && styles.faceMoodProminent)
+      }, information && /*#__PURE__*/React.createElement("div", {
+        className: styles.informationBtn
+      }, /*#__PURE__*/React.createElement(IconButton, {
+        label: "Information",
+        icon: /*#__PURE__*/React.createElement(InformationIcon, {
+          role: "presentation"
+        }),
+        onClick: function () {
+          return setIsFlipped(true);
+        },
+        disabled: isFlipped,
+        "aria-hidden": isFlipped
+      })), renderTitle(), /*#__PURE__*/React.createElement("div", {
+        className: styles.children
+      }, children && children), footer && /*#__PURE__*/React.createElement("div", {
+        className: styles.footer
+      }, footer));
+    };
+    var renderInformation = function (informationProp) {
+      if (informationProp && typeof informationProp === "object" && "text" in informationProp) {
+        return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+          variant: "body"
+        }, informationProp.text), (informationProp.primaryAction || informationProp.secondaryAction) && /*#__PURE__*/React.createElement("div", {
+          className: styles.footer
+        }, renderActions(informationProp.primaryAction, informationProp.secondaryAction, !isFlipped)));
+      }
+      return informationProp;
+    };
+    var renderBack = function () {
+      if (!information) return;
+      return /*#__PURE__*/React.createElement("div", {
+        className: classnames(styles.face, styles.faceBack)
+      }, /*#__PURE__*/React.createElement("div", {
+        className: styles.informationBtn
+      }, /*#__PURE__*/React.createElement(IconButton, {
+        label: "Information",
+        icon: /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
+          role: "presentation"
+        }),
+        onClick: function () {
+          return setIsFlipped(false);
+        },
+        disabled: !isFlipped,
+        "aria-hidden": !isFlipped
+      })), /*#__PURE__*/React.createElement("div", {
+        className: styles.information
+      }, renderInformation(information)));
+    };
+    return /*#__PURE__*/React.createElement("div", __assign({
+      className: classnames(styles.root, classNameOverride)
+    }, restProps), /*#__PURE__*/React.createElement("div", {
+      className: classnames(styles.tile, isFlipped && styles.isFlipped)
+    }, /*#__PURE__*/React.createElement(React.Fragment, null, renderFront(), renderBack())));
+  };
+  GenericTile.displayName = "GenericTile";
+  return GenericTile;
+}();
+export { GenericTile };
+//# sourceMappingURL=GenericTile.mjs.map

package/dist/esm/Tile/subcomponents/GenericTile/GenericTile.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericTile.mjs","sources":["../../../../../src/Tile/subcomponents/GenericTile/GenericTile.tsx"],"sourcesContent":["import React, { HTMLAttributes, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { IconButton } from \"~components/Button\"\nimport { GenericButtonProps } from \"~components/Button/GenericButton\"\nimport { AllowedHeadingTags, Heading } from \"~components/Heading\"\nimport { ArrowBackwardIcon, InformationIcon } from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport Action from \"./Action\"\nimport { Moods } from \"./types\"\nimport styles from \"./GenericTile.module.scss\"\n\nexport type TileAction = {\n  label: string\n  onClick?: GenericButtonProps[\"onClick\"]\n  href?: string\n  icon?: JSX.Element\n  /**\n   * @deprecated use data-testid instead\n   */\n  automationId?: string\n  newTabAndIUnderstandTheAccessibilityImplications?: boolean\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type TileInformation = {\n  text: string\n  primaryAction?: TileAction\n  secondaryAction?: TileAction\n}\n\nexport type GenericTileProps = {\n  children?: React.ReactNode\n  title: React.ReactNode\n  titleTag?: AllowedHeadingTags\n  metadata?: string\n  information?: TileInformation | React.ReactNode\n  mood?: Moods\n  footer: React.ReactNode\n} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, \"title\">>\n\nexport const GenericTile = ({\n  children,\n  title,\n  titleTag = \"h3\",\n  metadata,\n  information,\n  mood,\n  footer,\n  classNameOverride,\n  ...restProps\n}: GenericTileProps): JSX.Element => {\n  const [isFlipped, setIsFlipped] = useState<boolean>(false)\n\n  const renderTitle = (): JSX.Element => (\n    <div className={styles.title}>\n      <Heading variant=\"heading-3\" tag={titleTag}>\n        {title}\n      </Heading>\n      {metadata && (\n        <div className=\"pt-4\">\n          <Text variant=\"small\" color=\"dark-reduced-opacity\">\n            {metadata}\n          </Text>\n        </div>\n      )}\n    </div>\n  )\n\n  const renderActions = (\n    primaryAction?: TileAction,\n    secondaryAction?: TileAction,\n    disabled?: boolean\n  ): JSX.Element => (\n    <div className={styles.actions}>\n      {secondaryAction && (\n        <Action action={secondaryAction} secondary disabled={disabled} />\n      )}\n      {primaryAction && <Action action={primaryAction} disabled={disabled} />}\n    </div>\n  )\n\n  const renderFront = (): JSX.Element => (\n    <div\n      className={classnames(\n        styles.face,\n        styles.faceFront,\n        mood === \"positive\" && styles.faceMoodPositive,\n        mood === \"informative\" && styles.faceMoodInformative,\n        mood === \"cautionary\" && styles.faceMoodCautionary,\n        mood === \"assertive\" && styles.faceMoodAssertive,\n        mood === \"negative\" && styles.faceMoodNegative,\n        mood === \"prominent\" && styles.faceMoodProminent\n      )}\n    >\n      {information && (\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<InformationIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(true)}\n            disabled={isFlipped}\n            aria-hidden={isFlipped}\n          />\n        </div>\n      )}\n      {renderTitle()}\n      <div className={styles.children}>{children && children}</div>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </div>\n  )\n\n  const renderInformation = (\n    informationProp: GenericTileProps[\"information\"] | undefined\n  ): JSX.Element | React.ReactNode => {\n    if (\n      informationProp &&\n      typeof informationProp === \"object\" &&\n      \"text\" in informationProp\n    ) {\n      return (\n        <>\n          <Text variant=\"body\">{informationProp.text}</Text>\n          {(informationProp.primaryAction ||\n            informationProp.secondaryAction) && (\n            <div className={styles.footer}>\n              {renderActions(\n                informationProp.primaryAction,\n                informationProp.secondaryAction,\n                !isFlipped\n              )}\n            </div>\n          )}\n        </>\n      )\n    }\n\n    return informationProp\n  }\n\n  const renderBack = (): JSX.Element | void => {\n    if (!information) return\n\n    return (\n      <div className={classnames(styles.face, styles.faceBack)}>\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<ArrowBackwardIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(false)}\n            disabled={!isFlipped}\n            aria-hidden={!isFlipped}\n          />\n        </div>\n        <div className={styles.information}>\n          {renderInformation(information)}\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className={classnames(styles.root, classNameOverride)} {...restProps}>\n      <div className={classnames(styles.tile, isFlipped && styles.isFlipped)}>\n        <>\n          {renderFront()}\n          {renderBack()}\n        </>\n      </div>\n    </div>\n  )\n}\n\nGenericTile.displayName = \"GenericTile\"\n"],"names":["GenericTile","_a","children","title","_b","titleTag","metadata","information","mood","footer","classNameOverride","restProps","__rest","_c","useState","isFlipped","setIsFlipped","renderTitle","React","className","styles","createElement","Heading","variant","tag","Text","color","renderActions","primaryAction","secondaryAction","disabled","actions","Action","action","secondary","renderFront","classnames","face","faceFront","faceMoodPositive","faceMoodInformative","faceMoodCautionary","faceMoodAssertive","faceMoodNegative","faceMoodProminent","informationBtn","IconButton","label","icon","InformationIcon","role","onClick","renderInformation","informationProp","Fragment","text","renderBack","faceBack","ArrowBackwardIcon","__assign","root","tile","displayName"],"mappings":"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"}

package/dist/esm/Tile/subcomponents/GenericTile/GenericTile.module.scss.mjs

@@ -0,0 +1,21 @@
+var styles = {
+  "root": "GenericTile-module_root__9ZHdH",
+  "tile": "GenericTile-module_tile__mgFhk",
+  "face": "GenericTile-module_face__-KLVi",
+  "faceFront": "GenericTile-module_faceFront__HywHi",
+  "faceBack": "GenericTile-module_faceBack__NDCQ8",
+  "faceMoodPositive": "GenericTile-module_faceMoodPositive__3MEBl",
+  "faceMoodInformative": "GenericTile-module_faceMoodInformative__D0QsW",
+  "faceMoodCautionary": "GenericTile-module_faceMoodCautionary__oUZXT",
+  "faceMoodAssertive": "GenericTile-module_faceMoodAssertive__PaUZ-",
+  "faceMoodNegative": "GenericTile-module_faceMoodNegative__DmcZH",
+  "faceMoodProminent": "GenericTile-module_faceMoodProminent__VmMmv",
+  "isFlipped": "GenericTile-module_isFlipped__K18mo",
+  "title": "GenericTile-module_title__zC6Qv",
+  "actions": "GenericTile-module_actions__l8vXl",
+  "informationBtn": "GenericTile-module_informationBtn__LY3SW",
+  "information": "GenericTile-module_information__wKXBp",
+  "footer": "GenericTile-module_footer__u2Pei"
+};
+export { styles as default };
+//# sourceMappingURL=GenericTile.module.scss.mjs.map

package/dist/esm/Tile/subcomponents/GenericTile/GenericTile.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"GenericTile.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}

package/dist/esm/TimeField/TimeField.mjs

@@ -0,0 +1,96 @@
+import { __assign, __rest } from 'tslib';
+import React, { useState } from 'react';
+import { Time } from '@internationalized/date';
+import { useTimeField } from '@react-aria/datepicker';
+import { I18nProvider } from '@react-aria/i18n';
+import { useTimeFieldState } from '@react-stately/datepicker';
+import classnames from 'classnames';
+import { v4 } from 'uuid';
+import { FieldMessage } from '../FieldMessage/FieldMessage.mjs';
+import { Heading } from '../Heading/Heading.mjs';
+import { TimeSegment } from './subcomponents/TimeSegment/TimeSegment.mjs';
+import styles from './TimeField.module.scss.mjs';
+
+// This needed to be placed directly below the props because
+// the prop descriptions wouldn't show in Storybook otherwise.
+const TimeField = /*#__PURE__*/function () {
+  const TimeField = function (props) {
+    return /*#__PURE__*/React.createElement(I18nProvider, {
+      locale: props.locale
+    }, /*#__PURE__*/React.createElement(TimeFieldComponent, __assign({}, props)));
+  };
+  TimeField.displayName = "TimeField";
+  return TimeField;
+}();
+const TimeFieldComponent = /*#__PURE__*/function () {
+  const TimeFieldComponent = function (_a) {
+    var propsId = _a.id,
+      label = _a.label,
+      locale = _a.locale,
+      onChange = _a.onChange,
+      value = _a.value,
+      _b = _a.status,
+      status = _b === void 0 ? "default" : _b,
+      validationMessage = _a.validationMessage,
+      isDisabled = _a.isDisabled,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["id", "label", "locale", "onChange", "value", "status", "validationMessage", "isDisabled", "classNameOverride"]);
+    var id = useState(propsId || v4())[0];
+    var handleOnChange = function (timeValue) {
+      if (timeValue === null) {
+        return onChange(null);
+      }
+      onChange({
+        hour: timeValue.hour,
+        minutes: timeValue.minute
+      });
+    };
+    var state = useTimeFieldState(__assign(__assign({}, restProps), {
+      value: value ? new Time(value.hour, value.minutes) : null,
+      onChange: handleOnChange,
+      isDisabled: isDisabled,
+      hideTimeZone: true,
+      locale: locale,
+      validationState: status === "default" ? "valid" : "invalid"
+    }));
+    var descriptionId = "".concat(id, "-field-message");
+    var inputRef = React.useRef(null);
+    var _c = useTimeField(__assign(__assign({}, restProps), {
+        label: label,
+        isDisabled: isDisabled,
+        "aria-describedby": descriptionId
+      }), state, inputRef),
+      fieldProps = _c.fieldProps,
+      labelProps = _c.labelProps;
+    return /*#__PURE__*/React.createElement("div", {
+      className: classNameOverride
+    }, /*#__PURE__*/React.createElement(Heading, __assign({
+      tag: "div",
+      variant: "heading-6"
+    }, labelProps, {
+      classNameOverride: classnames(styles.heading, state.isDisabled && styles.isDisabled)
+    }), label), /*#__PURE__*/React.createElement("div", {
+      className: styles.wrapper
+    }, /*#__PURE__*/React.createElement("div", __assign({}, fieldProps, {
+      id: id,
+      ref: inputRef,
+      className: classnames(styles.input, state.isDisabled && styles.isDisabled, state.validationState === "invalid" && styles.error)
+    }), state.segments.map(function (segment, i) {
+      return /*#__PURE__*/React.createElement(TimeSegment, {
+        key: i,
+        segment: segment,
+        state: state
+      });
+    }), /*#__PURE__*/React.createElement("div", {
+      className: styles.focusRing
+    }))), validationMessage && status === "error" && /*#__PURE__*/React.createElement(FieldMessage, {
+      id: descriptionId,
+      message: validationMessage,
+      status: status
+    }));
+  };
+  TimeFieldComponent.displayName = "TimeFieldComponent";
+  return TimeFieldComponent;
+}();
+export { TimeField };
+//# sourceMappingURL=TimeField.mjs.map

package/dist/esm/TimeField/TimeField.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeField.mjs","sources":["../../../src/TimeField/TimeField.tsx"],"sourcesContent":["import React, { useState } from \"react\"\nimport { Time } from \"@internationalized/date\"\nimport { useTimeField } from \"@react-aria/datepicker\"\nimport { I18nProvider } from \"@react-aria/i18n\"\nimport {\n  useTimeFieldState,\n  TimeFieldStateOptions,\n} from \"@react-stately/datepicker\"\nimport classnames from \"classnames\"\nimport { v4 } from \"uuid\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport { Heading } from \"~components/Heading\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { TimeSegment } from \"./subcomponents/TimeSegment\"\nimport { StatusType, TimeValue, ValueType } from \"./types\"\nimport styles from \"./TimeField.module.scss\"\n\ntype OmittedTimeFieldProps =\n  | \"errorMessage\"\n  | \"validationState\"\n  | \"value\"\n  | \"onChange\"\n  | \"label\"\n  | \"hideTimeZone\"\n\nexport type TimeFieldProps = {\n  id?: string\n  /**\n   * Field label.\n   */\n  label: string\n  /**\n   * Accepts any valid locale code (https://npm.io/package/locale-codes).\n   */\n  locale: string\n  onChange: (value: ValueType | null) => void\n  value: ValueType | null\n  status?: StatusType\n  validationMessage?: React.ReactNode\n} & OverrideClassName<Omit<TimeFieldStateOptions, OmittedTimeFieldProps>>\n\n// This needed to be placed directly below the props because\n// the prop descriptions wouldn't show in Storybook otherwise.\nexport const TimeField = (props: TimeFieldProps): JSX.Element => (\n  <I18nProvider locale={props.locale}>\n    <TimeFieldComponent {...props} />\n  </I18nProvider>\n)\n\nTimeField.displayName = \"TimeField\"\n\nconst TimeFieldComponent = ({\n  id: propsId,\n  label,\n  locale,\n  onChange,\n  value,\n  status = \"default\",\n  validationMessage,\n  isDisabled,\n  classNameOverride,\n  ...restProps\n}: TimeFieldProps): JSX.Element => {\n  const [id] = useState<string>(propsId || v4())\n\n  const handleOnChange = (timeValue: TimeValue | null): void => {\n    if (timeValue === null) {\n      return onChange(null)\n    }\n    onChange({ hour: timeValue.hour, minutes: timeValue.minute })\n  }\n\n  const state = useTimeFieldState({\n    ...restProps,\n    value: value ? new Time(value.hour, value.minutes) : null,\n    onChange: handleOnChange,\n    isDisabled,\n    hideTimeZone: true,\n    locale,\n    validationState: status === \"default\" ? \"valid\" : \"invalid\",\n  })\n  const descriptionId = `${id}-field-message`\n\n  const inputRef = React.useRef(null)\n  const { fieldProps, labelProps } = useTimeField(\n    {\n      ...restProps,\n      label,\n      isDisabled,\n      \"aria-describedby\": descriptionId,\n    },\n    state,\n    inputRef\n  )\n  return (\n    <div className={classNameOverride}>\n      <Heading\n        tag=\"div\"\n        variant=\"heading-6\"\n        {...labelProps}\n        classNameOverride={classnames(\n          styles.heading,\n          state.isDisabled && styles.isDisabled\n        )}\n      >\n        {label}\n      </Heading>\n      <div className={styles.wrapper}>\n        {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */}\n        <div\n          {...fieldProps}\n          id={id}\n          ref={inputRef}\n          className={classnames(\n            styles.input,\n            state.isDisabled && styles.isDisabled,\n            state.validationState === \"invalid\" && styles.error\n          )}\n        >\n          {state.segments.map((segment, i) => (\n            <TimeSegment key={i} segment={segment} state={state} />\n          ))}\n          <div className={styles.focusRing} />\n        </div>\n      </div>\n      {validationMessage && status === \"error\" && (\n        <FieldMessage\n          id={descriptionId}\n          message={validationMessage}\n          status={status}\n        />\n      )}\n    </div>\n  )\n}\n\nTimeFieldComponent.displayName = \"TimeFieldComponent\"\n"],"names":["TimeField","props","React","createElement","I18nProvider","locale","TimeFieldComponent","displayName","_a","propsId","id","label","onChange","value","_b","status","validationMessage","isDisabled","classNameOverride","restProps","__rest","useState","v4","handleOnChange","timeValue","hour","minutes","minute","state","useTimeFieldState","__assign","Time","hideTimeZone","validationState","descriptionId","concat","inputRef","useRef","_c","useTimeField","fieldProps","labelProps","className","Heading","tag","variant","classnames","styles","heading","wrapper","ref","input","error","segments","map","segment","i","TimeSegment","key","focusRing","FieldMessage","message"],"mappings":"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"}

package/dist/esm/TimeField/TimeField.module.scss.mjs

@@ -0,0 +1,10 @@
+var styles = {
+  "wrapper": "TimeField-module_wrapper__YuSI3",
+  "heading": "TimeField-module_heading__5EOZf",
+  "input": "TimeField-module_input__Hxjcu",
+  "focusRing": "TimeField-module_focusRing__7hgWG",
+  "isDisabled": "TimeField-module_isDisabled__rpEc8",
+  "error": "TimeField-module_error__tK2QY"
+};
+export { styles as default };
+//# sourceMappingURL=TimeField.module.scss.mjs.map

package/dist/esm/TimeField/TimeField.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeField.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/TimeField/subcomponents/TimeSegment/TimeSegment.mjs

@@ -0,0 +1,28 @@
+import { __assign } from 'tslib';
+import React from 'react';
+import { useDateSegment } from '@react-aria/datepicker';
+import classnames from 'classnames';
+import { generateSegmentDisplayText } from './utils/generateSegmentDisplayText.mjs';
+import styles from './TimeSegment.module.scss.mjs';
+const TimeSegment = /*#__PURE__*/function () {
+  const TimeSegment = function (_a) {
+    var segment = _a.segment,
+      state = _a.state;
+    var ref = React.useRef(null);
+    var segmentProps = useDateSegment(segment, state, ref).segmentProps;
+    // Chrome has a bug where `contenteditable` elements receive focus from external clicks.
+    // This (in combination with the invisible character ​) creates boundaries
+    // for the element.
+    // https://stackoverflow.com/a/34445203
+    return /*#__PURE__*/React.createElement("span", {
+      className: styles.timeSegmentWrapper
+    }, "\u200B", /*#__PURE__*/React.createElement("span", __assign({}, segmentProps, {
+      ref: ref,
+      className: classnames(styles.timeSegment, segment.type === "literal" && styles.literal, segment.isPlaceholder && styles.placeholder, segment.type === "dayPeriod" && styles.dayPeriod)
+    }), generateSegmentDisplayText(segment)), "\u200B");
+  };
+  TimeSegment.displayName = "TimeSegment";
+  return TimeSegment;
+}();
+export { TimeSegment };
+//# sourceMappingURL=TimeSegment.mjs.map

package/dist/esm/TimeField/subcomponents/TimeSegment/TimeSegment.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeSegment.mjs","sources":["../../../../../src/TimeField/subcomponents/TimeSegment/TimeSegment.tsx"],"sourcesContent":["import React from \"react\"\nimport { useDateSegment } from \"@react-aria/datepicker\"\nimport { DateSegment, DateFieldState } from \"@react-stately/datepicker\"\nimport classnames from \"classnames\"\nimport { generateSegmentDisplayText } from \"./utils/generateSegmentDisplayText\"\nimport styles from \"./TimeSegment.module.scss\"\n\nexport type TimeSegmentProps = {\n  segment: DateSegment\n  state: DateFieldState\n}\n\nexport const TimeSegment = ({\n  segment,\n  state,\n}: TimeSegmentProps): JSX.Element => {\n  const ref = React.useRef<HTMLDivElement>(null)\n  const { segmentProps } = useDateSegment(segment, state, ref)\n\n  // Chrome has a bug where `contenteditable` elements receive focus from external clicks.\n  // This (in combination with the invisible character &#8203;) creates boundaries\n  // for the element.\n  // https://stackoverflow.com/a/34445203\n  return (\n    <span className={styles.timeSegmentWrapper}>\n      &#8203;\n      <span\n        {...segmentProps}\n        ref={ref}\n        className={classnames(\n          styles.timeSegment,\n          segment.type === \"literal\" && styles.literal,\n          segment.isPlaceholder && styles.placeholder,\n          segment.type === \"dayPeriod\" && styles.dayPeriod\n        )}\n      >\n        {generateSegmentDisplayText(segment)}\n      </span>\n      &#8203;\n    </span>\n  )\n}\n\nTimeSegment.displayName = \"TimeSegment\"\n"],"names":["TimeSegment","_a","segment","state","ref","React","useRef","segmentProps","useDateSegment","createElement","className","styles","timeSegmentWrapper","__assign","classnames","timeSegment","type","literal","isPlaceholder","placeholder","dayPeriod","generateSegmentDisplayText","displayName"],"mappings":";;;;;;MAYaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAGT,EAAA;QAFjBC,OAAO,GAAAD,EAAA,CAAAC,OAAA;MACPC,KAAK,GAAAF,EAAA,CAAAE,KAAA;IAEL,IAAMC,GAAG,GAAGC,KAAK,CAACC,MAAM,CAAiB,IAAI,CAAC;IACtC,IAAAC,YAAY,GAAKC,cAAc,CAACN,OAAO,EAAEC,KAAK,EAAEC,GAAG,CAAC,CAAAG,YAAxC;;;;;IAMpB,oBACEF,KAAM,CAAAI,aAAA,CAAA,MAAA,EAAA;MAAAC,SAAS,EAAEC,MAAM,CAACC;IAAkB,CAAA,yBAExCP,KACM,CAAAI,aAAA,CAAA,MAAA,EAAAI,QAAA,CAAA,CAAA,CAAA,EAAAN,YAAY;MAChBH,GAAG,EAAEA,GAAG;MACRM,SAAS,EAAEI,UAAU,CACnBH,MAAM,CAACI,WAAW,EAClBb,OAAO,CAACc,IAAI,KAAK,SAAS,IAAIL,MAAM,CAACM,OAAO,EAC5Cf,OAAO,CAACgB,aAAa,IAAIP,MAAM,CAACQ,WAAW,EAC3CjB,OAAO,CAACc,IAAI,KAAK,WAAW,IAAIL,MAAM,CAACS,SAAS;IACjD,IAEAC,0BAA0B,CAACnB,OAAO,CAAC,CAC/B,EAEF,QAAA,CAAA;EAEX,CAAC;EAEDF,WAAW,CAACsB,WAAW,GAAG,aAAa;EAAA,OA/B1BtB,WAAW;AAAA;"}

package/dist/esm/TimeField/subcomponents/TimeSegment/TimeSegment.module.scss.mjs

@@ -0,0 +1,9 @@
+var styles = {
+  "timeSegmentWrapper": "TimeSegment-module_timeSegmentWrapper__WYD6y",
+  "timeSegment": "TimeSegment-module_timeSegment__eXb0c",
+  "placeholder": "TimeSegment-module_placeholder__j1-gK",
+  "literal": "TimeSegment-module_literal__mOkqz",
+  "dayPeriod": "TimeSegment-module_dayPeriod__fzT5I"
+};
+export { styles as default };
+//# sourceMappingURL=TimeSegment.module.scss.mjs.map

package/dist/esm/TimeField/subcomponents/TimeSegment/TimeSegment.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeSegment.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/dist/esm/TimeField/subcomponents/TimeSegment/utils/generateSegmentDisplayText.mjs

@@ -0,0 +1,5 @@
+var generateSegmentDisplayText = function (segment) {
+  return segment.isPlaceholder && segment.type !== "dayPeriod" ? "--" : segment.text;
+};
+export { generateSegmentDisplayText };
+//# sourceMappingURL=generateSegmentDisplayText.mjs.map

package/dist/esm/TimeField/subcomponents/TimeSegment/utils/generateSegmentDisplayText.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateSegmentDisplayText.mjs","sources":["../../../../../../src/TimeField/subcomponents/TimeSegment/utils/generateSegmentDisplayText.ts"],"sourcesContent":["import { DateSegment } from \"@react-stately/datepicker\"\n\nexport const generateSegmentDisplayText = (segment: DateSegment): string =>\n  segment.isPlaceholder && segment.type !== \"dayPeriod\" ? \"--\" : segment.text\n"],"names":["generateSegmentDisplayText","segment","isPlaceholder","type","text"],"mappings":"AAEO,IAAMA,0BAA0B,GAAG,SAAAA,CAACC,OAAoB,EAAA;EAC7D,OAAAA,OAAO,CAACC,aAAa,IAAID,OAAO,CAACE,IAAI,KAAK,WAAW,GAAG,IAAI,GAAGF,OAAO,CAACG,IAAI;AAA3E,CAAA;"}