@danske/sapphire-react-lab 0.86.0 → 0.86.3

package/build/esm/Calendar/src/Calendar.js

@@ -55,7 +55,6 @@ const Calendar = (_a) => {
   useThemeCheck();
   const { locale } = useLocale();
   const formatMessage = useMessageFormatter(intlMessages);
-  useThemeCheck();
   const { styleProps } = useSapphireStyleProps(props);
   const state = useCalendarAnimationState(useSapphireCalendarState(__spreadProps(__spreadValues({
     selectionAlignment: "start"

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

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../../../../src/Calendar/src/Calendar.tsx"],"sourcesContent":["import React from 'react';\nimport { createCalendar, DateValue } from '@internationalized/date';\nimport { AriaCalendarProps, useCalendar } from '@react-aria/calendar';\nimport { filterDOMProps, mergeProps } from '@react-aria/utils';\n\nimport {\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  Button,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/calendar/calendar.module.css';\n\nimport { CalendarDaysGrid } from './CalendarDaysGrid';\nimport {\n  useDateFormatter,\n  useLocale,\n  useMessageFormatter,\n} from '@react-aria/i18n';\nimport { CalendarMonthsGrid } from './CalendarMonthsGrid';\nimport { CalendarYearsGrid } from './CalendarYearsGrid';\nimport {\n  SapphireCalendarStateOptions,\n  useSapphireCalendarState,\n} from './useSapphireCalendarState';\nimport clsx from 'clsx';\nimport { CalendarHeader } from './CalendarHeader';\nimport {\n  CalendarPageAnimation,\n  useCalendarAnimationState,\n} from './CalendarPageAnimation';\nimport intlMessages from '../i18n';\nimport { sentenceCase } from './utils';\n\nexport interface SapphireCalendarProps<T extends DateValue = DateValue>\n  extends SapphireStyleProps,\n    Omit<AriaCalendarProps<T>, 'validationState' | 'errorMessage'>,\n    Omit<SapphireCalendarStateOptions<T>, 'createCalendar'> {\n  /**\n   * Whether week numbers are visible as a first column\n   */\n  showWeekNumbers?: boolean;\n}\n\n/**\n * Displays a calendar and allows users to select a single date. It displays a grid of days in one\n * month, by default, and the user can navigate to previous and next months. It's also possible\n * to navigate to months and years view, to quickly jump to a date far away from the focused date.\n */\nexport const Calendar = <T extends DateValue = DateValue>({\n  showWeekNumbers,\n  ...props\n}: Omit<SapphireCalendarProps<T>, 'locale'>): JSX.Element => {\n  useThemeCheck();\n  const { locale } = useLocale();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  useThemeCheck();\n  const { styleProps } = useSapphireStyleProps(props);\n  const state = useCalendarAnimationState(\n    useSapphireCalendarState({\n      selectionAlignment: 'start',\n      ...props,\n      locale,\n      createCalendar,\n    })\n  );\n\n  const monthDateFormatter = useDateFormatter({\n    month: 'long',\n    year: 'numeric',\n    era:\n      state.visibleRange.start.calendar.identifier === 'gregory' &&\n      state.visibleRange.start.era === 'BC'\n        ? 'short'\n        : undefined,\n    calendar: state.visibleRange.start.calendar.identifier,\n    timeZone: state.timeZone,\n  });\n\n  const { calendarProps, prevButtonProps, nextButtonProps } = useCalendar(\n    props,\n    state\n  );\n\n  const renderGrid = () => {\n    switch (state.view) {\n      case 'years':\n        return <CalendarYearsGrid state={state} />;\n      case 'months':\n        return <CalendarMonthsGrid state={state} />;\n      case 'days':\n      default:\n        return (\n          <CalendarDaysGrid state={state} showWeekNumbers={showWeekNumbers} />\n        );\n    }\n  };\n\n  const renderTitle = () => {\n    switch (state.view) {\n      case 'days':\n        return sentenceCase(\n          monthDateFormatter.format(\n            state.visibleRange.start.toDate(state.timeZone)\n          )\n        );\n      case 'months':\n        return state.focusedDate.year;\n      case 'years':\n        return sentenceCase(formatMessage('year'));\n    }\n  };\n  return (\n    <div\n      className={styles['sapphire-calendar']}\n      {...mergeProps(calendarProps, filterDOMProps(props))}\n    >\n      <div\n        className={clsx(\n          styles['sapphire-calendar__table-container'],\n          styleProps.className\n        )}\n        style={styleProps.style}\n      >\n        <CalendarHeader\n          prevButtonProps={prevButtonProps}\n          nextButtonProps={nextButtonProps}\n        >\n          {state.canBroadenView ? (\n            <Button\n              onPress={state.broadenView}\n              isDisabled={state.isDisabled}\n              variant=\"tertiary\"\n              appearance=\"ghost\"\n              size=\"large\"\n            >\n              {renderTitle()}\n            </Button>\n          ) : (\n            renderTitle()\n          )}\n        </CalendarHeader>\n        {state.view === 'days' ? (\n          <CalendarPageAnimation state={state.animationState}>\n            {renderGrid()}\n          </CalendarPageAnimation>\n        ) : (\n          renderGrid()\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDa,MAAA,QAAA,GAAW,CAAkC,EAGG,KAAA;AAHH,EACxD,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,eAAA;AAAA,GADwD,GAAA,EAAA,EAErD,kBAFqD,EAErD,EAAA;AAAA,IADH,iBAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AACA,EAAA,MAAM,EAAE,MAAW,EAAA,GAAA,SAAA,EAAA,CAAA;AACnB,EAAA,MAAM,gBAAgB,mBAAoB,CAAA,YAAA,CAAA,CAAA;AAE1C,EAAA,aAAA,EAAA,CAAA;AACA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAC7C,EAAM,MAAA,KAAA,GAAQ,0BACZ,wBAAyB,CAAA,aAAA,CAAA,cAAA,CAAA;AAAA,IACvB,kBAAoB,EAAA,OAAA;AAAA,GAAA,EACjB,KAFoB,CAAA,EAAA;AAAA,IAGvB,MAAA;AAAA,IACA,cAAA;AAAA,GAAA,CAAA,CAAA,CAAA,CAAA;AAIJ,EAAA,MAAM,qBAAqB,gBAAiB,CAAA;AAAA,IAC1C,KAAO,EAAA,MAAA;AAAA,IACP,IAAM,EAAA,SAAA;AAAA,IACN,GACE,EAAA,KAAA,CAAM,YAAa,CAAA,KAAA,CAAM,QAAS,CAAA,UAAA,KAAe,SACjD,IAAA,KAAA,CAAM,YAAa,CAAA,KAAA,CAAM,GAAQ,KAAA,IAAA,GAC7B,OACA,GAAA,KAAA,CAAA;AAAA,IACN,QAAU,EAAA,KAAA,CAAM,YAAa,CAAA,KAAA,CAAM,QAAS,CAAA,UAAA;AAAA,IAC5C,UAAU,KAAM,CAAA,QAAA;AAAA,GAAA,CAAA,CAAA;AAGlB,EAAA,MAAM,EAAE,aAAA,EAAe,eAAiB,EAAA,eAAA,EAAA,GAAoB,YAC1D,KACA,EAAA,KAAA,CAAA,CAAA;AAGF,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,QAAQ,KAAM,CAAA,IAAA;AAAA,MACP,KAAA,OAAA;AACH,QAAA,2CAAQ,iBAAD,EAAA;AAAA,UAAmB,KAAA;AAAA,SAAA,CAAA,CAAA;AAAA,MACvB,KAAA,QAAA;AACH,QAAA,2CAAQ,kBAAD,EAAA;AAAA,UAAoB,KAAA;AAAA,SAAA,CAAA,CAAA;AAAA,MACxB,KAAA,MAAA,CAAA;AAAA,MAAA;AAEH,QAAA,2CACG,gBAAD,EAAA;AAAA,UAAkB,KAAA;AAAA,UAAc,eAAA;AAAA,SAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,CAAA;AAKxC,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,QAAQ,KAAM,CAAA,IAAA;AAAA,MACP,KAAA,MAAA;AACH,QAAA,OAAO,aACL,kBAAmB,CAAA,MAAA,CACjB,MAAM,YAAa,CAAA,KAAA,CAAM,OAAO,KAAM,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA;AAAA,MAGvC,KAAA,QAAA;AACH,QAAA,OAAO,MAAM,WAAY,CAAA,IAAA,CAAA;AAAA,MACtB,KAAA,OAAA;AACH,QAAA,OAAO,aAAa,aAAc,CAAA,MAAA,CAAA,CAAA,CAAA;AAAA,KAAA;AAAA,GAAA,CAAA;AAGxC,EAAA,2CACG,KAAD,EAAA,cAAA,CAAA;AAAA,IACE,WAAW,MAAO,CAAA,mBAAA,CAAA;AAAA,GAAA,EACd,UAAW,CAAA,aAAA,EAAe,cAAe,CAAA,KAAA,CAAA,CAAA,CAAA,sCAE5C,KAAD,EAAA;AAAA,IACE,SAAW,EAAA,IAAA,CACT,MAAO,CAAA,oCAAA,CAAA,EACP,UAAW,CAAA,SAAA,CAAA;AAAA,IAEb,OAAO,UAAW,CAAA,KAAA;AAAA,GAAA,sCAEjB,cAAD,EAAA;AAAA,IACE,eAAA;AAAA,IACA,eAAA;AAAA,GAEC,EAAA,KAAA,CAAM,cACL,mBAAA,KAAA,CAAA,aAAA,CAAC,MAAD,EAAA;AAAA,IACE,SAAS,KAAM,CAAA,WAAA;AAAA,IACf,YAAY,KAAM,CAAA,UAAA;AAAA,IAClB,OAAQ,EAAA,UAAA;AAAA,IACR,UAAW,EAAA,OAAA;AAAA,IACX,IAAK,EAAA,OAAA;AAAA,GAAA,EAEJ,iBAGH,WAGH,EAAA,CAAA,EAAA,KAAA,CAAM,IAAS,KAAA,MAAA,uCACb,qBAAD,EAAA;AAAA,IAAuB,OAAO,KAAM,CAAA,cAAA;AAAA,GAAA,EACjC,UAGH,EAAA,CAAA,GAAA,UAAA,EAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"Calendar.js","sources":["../../../../src/Calendar/src/Calendar.tsx"],"sourcesContent":["import React from 'react';\nimport { createCalendar, DateValue } from '@internationalized/date';\nimport { AriaCalendarProps, useCalendar } from '@react-aria/calendar';\nimport { filterDOMProps, mergeProps } from '@react-aria/utils';\n\nimport {\n  SapphireStyleProps,\n  useSapphireStyleProps,\n  useThemeCheck,\n  Button,\n} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/calendar/calendar.module.css';\n\nimport { CalendarDaysGrid } from './CalendarDaysGrid';\nimport {\n  useDateFormatter,\n  useLocale,\n  useMessageFormatter,\n} from '@react-aria/i18n';\nimport { CalendarMonthsGrid } from './CalendarMonthsGrid';\nimport { CalendarYearsGrid } from './CalendarYearsGrid';\nimport {\n  SapphireCalendarStateOptions,\n  useSapphireCalendarState,\n} from './useSapphireCalendarState';\nimport clsx from 'clsx';\nimport { CalendarHeader } from './CalendarHeader';\nimport {\n  CalendarPageAnimation,\n  useCalendarAnimationState,\n} from './CalendarPageAnimation';\nimport intlMessages from '../i18n';\nimport { sentenceCase } from './utils';\n\nexport interface SapphireCalendarProps<T extends DateValue = DateValue>\n  extends SapphireStyleProps,\n    Omit<AriaCalendarProps<T>, 'validationState' | 'errorMessage'>,\n    Omit<SapphireCalendarStateOptions<T>, 'createCalendar'> {\n  /**\n   * Whether week numbers are visible as a first column\n   */\n  showWeekNumbers?: boolean;\n}\n\n/**\n * Displays a calendar and allows users to select a single date. It displays a grid of days in one\n * month, by default, and the user can navigate to previous and next months. It's also possible\n * to navigate to months and years view, to quickly jump to a date far away from the focused date.\n */\nexport const Calendar = <T extends DateValue = DateValue>({\n  showWeekNumbers,\n  ...props\n}: Omit<SapphireCalendarProps<T>, 'locale'>): JSX.Element => {\n  useThemeCheck();\n  const { locale } = useLocale();\n  const formatMessage = useMessageFormatter(intlMessages);\n\n  const { styleProps } = useSapphireStyleProps(props);\n  const state = useCalendarAnimationState(\n    useSapphireCalendarState({\n      selectionAlignment: 'start',\n      ...props,\n      locale,\n      createCalendar,\n    })\n  );\n\n  const monthDateFormatter = useDateFormatter({\n    month: 'long',\n    year: 'numeric',\n    era:\n      state.visibleRange.start.calendar.identifier === 'gregory' &&\n      state.visibleRange.start.era === 'BC'\n        ? 'short'\n        : undefined,\n    calendar: state.visibleRange.start.calendar.identifier,\n    timeZone: state.timeZone,\n  });\n\n  const { calendarProps, prevButtonProps, nextButtonProps } = useCalendar(\n    props,\n    state\n  );\n\n  const renderGrid = () => {\n    switch (state.view) {\n      case 'years':\n        return <CalendarYearsGrid state={state} />;\n      case 'months':\n        return <CalendarMonthsGrid state={state} />;\n      case 'days':\n      default:\n        return (\n          <CalendarDaysGrid state={state} showWeekNumbers={showWeekNumbers} />\n        );\n    }\n  };\n\n  const renderTitle = () => {\n    switch (state.view) {\n      case 'days':\n        return sentenceCase(\n          monthDateFormatter.format(\n            state.visibleRange.start.toDate(state.timeZone)\n          )\n        );\n      case 'months':\n        return state.focusedDate.year;\n      case 'years':\n        return sentenceCase(formatMessage('year'));\n    }\n  };\n\n  return (\n    <div\n      className={styles['sapphire-calendar']}\n      {...mergeProps(calendarProps, filterDOMProps(props))}\n    >\n      <div\n        className={clsx(\n          styles['sapphire-calendar__table-container'],\n          styleProps.className\n        )}\n        style={styleProps.style}\n      >\n        <CalendarHeader\n          prevButtonProps={prevButtonProps}\n          nextButtonProps={nextButtonProps}\n        >\n          {state.canBroadenView ? (\n            <Button\n              onPress={state.broadenView}\n              isDisabled={state.isDisabled}\n              variant=\"tertiary\"\n              appearance=\"ghost\"\n              size=\"large\"\n            >\n              {renderTitle()}\n            </Button>\n          ) : (\n            renderTitle()\n          )}\n        </CalendarHeader>\n        {state.view === 'days' ? (\n          <CalendarPageAnimation state={state.animationState}>\n            {renderGrid()}\n          </CalendarPageAnimation>\n        ) : (\n          renderGrid()\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/build/esm/Spinner/src/Spinner.js

@@ -20,9 +20,11 @@ var __objRest = (source, exclude) => {
 };
 const Spinner = (_a) => {
   var _b = _a, {
-    size = "m"
+    size = "m",
+    variant = "default"
   } = _b, props = __objRest(_b, [
-    "size"
+    "size",
+    "variant"
   ]);
   useThemeCheck();
   const { styleProps } = useSapphireStyleProps(props);
@@ -30,7 +32,9 @@ const Spinner = (_a) => {
     role: "progressbar",
     "aria-label": "aria-label" in props ? props["aria-label"] : void 0,
     "aria-labelledby": "aria-labelledby" in props ? props["aria-labelledby"] : void 0,
-    className: clsx(styleProps.className, styles["sapphire-spinner"], size !== "m" ? styles[`sapphire-spinner--${size}`] : ""),
+    className: clsx(styleProps.className, styles["sapphire-spinner"], {
+      [styles["sapphire-spinner--inherit"]]: variant === "inherit"
+    }, size !== "m" ? styles[`sapphire-spinner--${size}`] : ""),
     style: styleProps.style,
     viewBox: "0 0 16 16"
   }, /* @__PURE__ */ React.createElement("path", {

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

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../../../../src/Spinner/src/Spinner.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/spinner/spinner.module.css';\nimport {\n  useThemeCheck,\n  SapphireStyleProps,\n  useSapphireStyleProps,\n} from '@danske/sapphire-react';\n\nexport type SpinnerProps = {\n  /**\n   * @default 'm'\n   */\n  size?: 'xxxs' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n} & SapphireStyleProps &\n  ({ 'aria-labelledby': string } | { 'aria-label': string });\n\n/**\n * Animated element that show that some data is still loading or some process\n * is in progress. The hidden label is required for accessibility reasons.\n */\nexport const Spinner = ({\n  size = 'm',\n  ...props\n}: SpinnerProps): JSX.Element => {\n  useThemeCheck();\n\n  const { styleProps } = useSapphireStyleProps(props);\n\n  /**\n   * There is @react-aria/progress but because we only have a \"indeterminate\"\n   * spinner, we only need one prop, the 'role' attr.\n   * Therefore, it seemed like an overkill to use react-aria here.\n   */\n\n  return (\n    <svg\n      role=\"progressbar\"\n      aria-label={'aria-label' in props ? props['aria-label'] : undefined}\n      aria-labelledby={\n        'aria-labelledby' in props ? props['aria-labelledby'] : undefined\n      }\n      className={clsx(\n        styleProps.className,\n        styles['sapphire-spinner'],\n        size !== 'm' ? styles[`sapphire-spinner--${size}` as const] : ''\n      )}\n      style={styleProps.style}\n      viewBox=\"0 0 16 16\"\n    >\n      <path\n        className={styles['sapphire-spinner__track']}\n        d=\"M10.3993 2.13882C10.3295 2.39914 10.4641 2.66858 10.7034 2.79263C11.2238 3.06246 11.7123 3.41501 12.1489 3.85159C14.4401 6.14281 14.4399 9.85728 12.1489 12.1483C9.85783 14.4393 6.14335 14.4395 3.85214 12.1483C3.41556 11.7117 3.06301 11.2232 2.79317 10.7028C2.66913 10.4635 2.39969 10.329 2.13937 10.3987C1.82795 10.4821 1.65738 10.8194 1.80178 11.1077C2.1261 11.7551 2.55778 12.3624 3.09789 12.9026C5.80564 15.6103 10.1955 15.6101 12.9031 12.9026C15.6107 10.195 15.6109 5.80509 12.9031 3.09734C12.363 2.55723 11.7556 2.12555 11.1082 1.80123C10.82 1.65683 10.4827 1.8274 10.3993 2.13882Z\"\n      />\n      <path\n        className={styles['sapphire-spinner__accent']}\n        d=\"M1.72661 8.85304C1.98694 8.78329 2.15316 8.53215 2.14111 8.26291C2.07002 6.67514 2.63971 5.06425 3.85203 3.85193C5.06452 2.63944 6.67527 2.06989 8.26302 2.14101C8.53225 2.15306 8.78337 1.98683 8.85309 1.7265C8.93661 1.41464 8.72921 1.09798 8.4069 1.07913C6.49959 0.96764 4.55516 1.6403 3.09778 3.09768C1.64062 4.55485 0.967813 6.49934 1.07909 8.40676C1.0979 8.72916 1.41467 8.93663 1.72661 8.85304Z\"\n      />\n    </svg>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAqBa,MAAA,OAAA,GAAU,CAAC,EAGS,KAAA;AAHT,EACtB,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAO,IAAA,GAAA,GAAA;AAAA,GADe,GAAA,EAAA,EAEnB,kBAFmB,EAEnB,EAAA;AAAA,IADH,MAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AAEA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAQ7C,EAAA,2CACG,KAAD,EAAA;AAAA,IACE,IAAK,EAAA,aAAA;AAAA,IACL,YAAY,EAAA,YAAA,IAAgB,KAAQ,GAAA,KAAA,CAAM,YAAgB,CAAA,GAAA,KAAA,CAAA;AAAA,IAC1D,iBACE,EAAA,iBAAA,IAAqB,KAAQ,GAAA,KAAA,CAAM,iBAAqB,CAAA,GAAA,KAAA,CAAA;AAAA,IAE1D,SAAA,EAAW,IACT,CAAA,UAAA,CAAW,SACX,EAAA,MAAA,CAAO,qBACP,IAAS,KAAA,GAAA,GAAM,MAAO,CAAA,CAAA,kBAAA,EAAqB,IAAmB,CAAA,CAAA,CAAA,GAAA,EAAA,CAAA;AAAA,IAEhE,OAAO,UAAW,CAAA,KAAA;AAAA,IAClB,OAAQ,EAAA,WAAA;AAAA,GAAA,sCAEP,MAAD,EAAA;AAAA,IACE,WAAW,MAAO,CAAA,yBAAA,CAAA;AAAA,IAClB,CAAE,EAAA,4kBAAA;AAAA,GAAA,CAAA,sCAEH,MAAD,EAAA;AAAA,IACE,WAAW,MAAO,CAAA,0BAAA,CAAA;AAAA,IAClB,CAAE,EAAA,gZAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAAA;;;;"}
+{"version":3,"file":"Spinner.js","sources":["../../../../src/Spinner/src/Spinner.tsx"],"sourcesContent":["import React from 'react';\nimport clsx from 'clsx';\nimport styles from '@danske/sapphire-css/components/spinner/spinner.module.css';\nimport {\n  useThemeCheck,\n  SapphireStyleProps,\n  useSapphireStyleProps,\n} from '@danske/sapphire-react';\n\nexport type SpinnerProps = {\n  /**\n   * @default 'm'\n   */\n  size?: 'xxxs' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';\n  /**\n   * The color variant of the spinner. Using `default` will use predefined colors, while `inherit` will use the text color.\n   * @default 'default'\n   */\n  variant?: 'default' | 'inherit';\n} & SapphireStyleProps &\n  ({ 'aria-labelledby': string } | { 'aria-label': string });\n\n/**\n * Animated element that show that some data is still loading or some process\n * is in progress. The hidden label is required for accessibility reasons.\n */\nexport const Spinner = ({\n  size = 'm',\n  variant = 'default',\n  ...props\n}: SpinnerProps): JSX.Element => {\n  useThemeCheck();\n\n  const { styleProps } = useSapphireStyleProps(props);\n\n  /**\n   * There is @react-aria/progress but because we only have a \"indeterminate\"\n   * spinner, we only need one prop, the 'role' attr.\n   * Therefore, it seemed like an overkill to use react-aria here.\n   */\n\n  return (\n    <svg\n      role=\"progressbar\"\n      aria-label={'aria-label' in props ? props['aria-label'] : undefined}\n      aria-labelledby={\n        'aria-labelledby' in props ? props['aria-labelledby'] : undefined\n      }\n      className={clsx(\n        styleProps.className,\n        styles['sapphire-spinner'],\n        {\n          [styles['sapphire-spinner--inherit']]: variant === 'inherit',\n        },\n        size !== 'm' ? styles[`sapphire-spinner--${size}` as const] : ''\n      )}\n      style={styleProps.style}\n      viewBox=\"0 0 16 16\"\n    >\n      <path\n        className={styles['sapphire-spinner__track']}\n        d=\"M10.3993 2.13882C10.3295 2.39914 10.4641 2.66858 10.7034 2.79263C11.2238 3.06246 11.7123 3.41501 12.1489 3.85159C14.4401 6.14281 14.4399 9.85728 12.1489 12.1483C9.85783 14.4393 6.14335 14.4395 3.85214 12.1483C3.41556 11.7117 3.06301 11.2232 2.79317 10.7028C2.66913 10.4635 2.39969 10.329 2.13937 10.3987C1.82795 10.4821 1.65738 10.8194 1.80178 11.1077C2.1261 11.7551 2.55778 12.3624 3.09789 12.9026C5.80564 15.6103 10.1955 15.6101 12.9031 12.9026C15.6107 10.195 15.6109 5.80509 12.9031 3.09734C12.363 2.55723 11.7556 2.12555 11.1082 1.80123C10.82 1.65683 10.4827 1.8274 10.3993 2.13882Z\"\n      />\n      <path\n        className={styles['sapphire-spinner__accent']}\n        d=\"M1.72661 8.85304C1.98694 8.78329 2.15316 8.53215 2.14111 8.26291C2.07002 6.67514 2.63971 5.06425 3.85203 3.85193C5.06452 2.63944 6.67527 2.06989 8.26302 2.14101C8.53225 2.15306 8.78337 1.98683 8.85309 1.7265C8.93661 1.41464 8.72921 1.09798 8.4069 1.07913C6.49959 0.96764 4.55516 1.6403 3.09778 3.09768C1.64062 4.55485 0.967813 6.49934 1.07909 8.40676C1.0979 8.72916 1.41467 8.93663 1.72661 8.85304Z\"\n      />\n    </svg>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AA0Ba,MAAA,OAAA,GAAU,CAAC,EAIS,KAAA;AAJT,EACtB,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAO,IAAA,GAAA,GAAA;AAAA,IACP,OAAU,GAAA,SAAA;AAAA,GAFY,GAAA,EAAA,EAGnB,kBAHmB,EAGnB,EAAA;AAAA,IAFH,MAAA;AAAA,IACA,SAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,aAAA,EAAA,CAAA;AAEA,EAAM,MAAA,EAAE,eAAe,qBAAsB,CAAA,KAAA,CAAA,CAAA;AAQ7C,EAAA,2CACG,KAAD,EAAA;AAAA,IACE,IAAK,EAAA,aAAA;AAAA,IACL,YAAY,EAAA,YAAA,IAAgB,KAAQ,GAAA,KAAA,CAAM,YAAgB,CAAA,GAAA,KAAA,CAAA;AAAA,IAC1D,iBACE,EAAA,iBAAA,IAAqB,KAAQ,GAAA,KAAA,CAAM,iBAAqB,CAAA,GAAA,KAAA,CAAA;AAAA,IAE1D,SAAW,EAAA,IAAA,CACT,UAAW,CAAA,SAAA,EACX,OAAO,kBACP,CAAA,EAAA;AAAA,MACG,CAAA,MAAA,CAAO,+BAA+B,OAAY,KAAA,SAAA;AAAA,KAAA,EAErD,IAAS,KAAA,GAAA,GAAM,MAAO,CAAA,CAAA,kBAAA,EAAqB,IAAmB,CAAA,CAAA,CAAA,GAAA,EAAA,CAAA;AAAA,IAEhE,OAAO,UAAW,CAAA,KAAA;AAAA,IAClB,OAAQ,EAAA,WAAA;AAAA,GAAA,sCAEP,MAAD,EAAA;AAAA,IACE,WAAW,MAAO,CAAA,yBAAA,CAAA;AAAA,IAClB,CAAE,EAAA,4kBAAA;AAAA,GAAA,CAAA,sCAEH,MAAD,EAAA;AAAA,IACE,WAAW,MAAO,CAAA,0BAAA,CAAA;AAAA,IAClB,CAAE,EAAA,gZAAA;AAAA,GAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

package/build/esm/{Tag → TagGroup}/src/Tag.js

@@ -4,9 +4,10 @@ import { useButton } from '@react-aria/button';
 import { useHover } from '@react-aria/interactions';
 import { useTag } from '@react-aria/tag';
 import { mergeProps } from '@react-aria/utils';
-import { useThemeCheck } from '@danske/sapphire-react';
+import { useThemeCheck, Icon } from '@danske/sapphire-react';
 import { Close, AlertCircle } from '@danske/sapphire-icons/react';
 import styles from '@danske/sapphire-css/components/tag/tag.module.css';
+import { FocusRing } from '@react-aria/focus';
 
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
@@ -45,28 +46,26 @@ function Tag(props) {
   const ref = useRef(null);
   const _a = useTag(props, state, ref), {
     allowsRemoving,
-    allowsSelection,
     gridCellProps,
     isDisabled,
     isFocused,
     isPressed,
-    isSelected,
     removeButtonProps,
     rowProps: _b
   } = _a, _c = _b, { onKeyDown } = _c, rowProps = __objRest(_c, ["onKeyDown"]), otherProps = __objRest(_a, [
     "allowsRemoving",
-    "allowsSelection",
     "gridCellProps",
     "isDisabled",
     "isFocused",
     "isPressed",
-    "isSelected",
     "removeButtonProps",
     "rowProps"
   ]);
   const { hoverProps, isHovered } = useHover({ isDisabled });
   const hasAction = otherProps.hasAction;
-  return /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({
+  return /* @__PURE__ */ React.createElement(FocusRing, {
+    focusRingClass: styles["is-focus"]
+  }, /* @__PURE__ */ React.createElement("div", __spreadValues(__spreadProps(__spreadValues({
     ref
   }, mergeProps({
     onKeyDown: (e) => {
@@ -78,31 +77,30 @@ function Tag(props) {
     }
   }, rowProps, hoverProps)), {
     className: clsx(styles["sapphire-tag"], styles["js-focus"], styles["js-hover"], {
-      [styles["sapphire-tag--error"]]: hasError,
-      [styles["is-active"]]: allowsSelection && isSelected,
+      [styles["sapphire-tag--actionable"]]: hasAction,
       [styles["is-active"]]: hasAction && isPressed,
-      [styles["is-focus"]]: isFocused,
       [styles["is-hover"]]: hasAction && isHovered,
       [styles["is-disabled"]]: isDisabled
-    }),
-    "aria-invalid": hasError
-  }), /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, gridCellProps), {
-    className: styles["sapphire-tag__gridcell"]
-  }), hasError && /* @__PURE__ */ React.createElement(IconError, null), item.rendered, allowsRemoving && /* @__PURE__ */ React.createElement(RemoveButton, __spreadValues({}, removeButtonProps))));
+    })
+  }), hasError ? { "aria-invalid": true } : {}), /* @__PURE__ */ React.createElement("div", __spreadProps(__spreadValues({}, gridCellProps), {
+    className: styles["sapphire-tag__content"]
+  }), hasError && /* @__PURE__ */ React.createElement(IconError, null), item.rendered, allowsRemoving && /* @__PURE__ */ React.createElement(RemoveButton, __spreadValues({}, removeButtonProps)))));
 }
 function RemoveButton(removeButtonProps) {
   const buttonRef = useRef(null);
   const { buttonProps } = useButton(removeButtonProps, buttonRef);
   return /* @__PURE__ */ React.createElement("button", __spreadProps(__spreadValues({}, buttonProps), {
     className: clsx(styles["sapphire-tag__button"], styles["js-focus"])
-  }), /* @__PURE__ */ React.createElement("span", {
-    className: styles["sapphire-tag__icon"]
+  }), /* @__PURE__ */ React.createElement(Icon, {
+    size: "s"
   }, /* @__PURE__ */ React.createElement(Close, null)));
 }
 const IconError = () => {
   return /* @__PURE__ */ React.createElement("span", {
-    className: clsx(styles["sapphire-tag__icon"], styles["sapphire-tag__icon--error"])
-  }, /* @__PURE__ */ React.createElement(AlertCircle, null));
+    className: clsx(styles["sapphire-tag__error-icon"])
+  }, /* @__PURE__ */ React.createElement(Icon, {
+    size: "s"
+  }, /* @__PURE__ */ React.createElement(AlertCircle, null)));
 };
 
 export { Tag };

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

@@ -0,0 +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 } from '@react-aria/utils';\nimport type { ListState } from '@react-stately/list';\nimport type { FocusableElement, Node } from '@react-types/shared';\n\nimport { Icon, useThemeCheck } from '@danske/sapphire-react';\nimport { AlertCircle, Close } 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\nexport function Tag<T>(props: TagProps<T>) {\n  useThemeCheck();\n  const { hasError = false, item, state } = props;\n  const ref = useRef(null);\n  const {\n    allowsRemoving,\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    <FocusRing focusRingClass={styles['is-focus']}>\n      <div\n        ref={ref}\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        )}\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 {...gridCellProps} className={styles['sapphire-tag__content']}>\n          {hasError && <IconError />}\n          {item.rendered}\n          {allowsRemoving && (\n            <RemoveButton {...(removeButtonProps as AriaButtonProps)} />\n          )}\n        </div>\n      </div>\n    </FocusRing>\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=\"s\">\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=\"s\">\n        <AlertCircle />\n      </Icon>\n    </span>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +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} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\n\nimport { Tag } from './Tag';\n\nexport interface TagGroupProps<T>\n  extends CollectionBase<T>,\n    DOMProps,\n    AriaLabelingProps,\n    SapphireStyleProps {\n  /**\n   * A ContextualHelp 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  onRemove?: (keys: Set<Key>) => void;\n}\n\nexport function TagGroup<T extends object>(props: TagGroupProps<T>) {\n  useThemeCheck();\n  const {\n    contextualHelp,\n    errorMessage,\n    label: labelText,\n    labelPlacement = 'above',\n    note,\n    ...otherProps\n  } = props;\n  const ref = useRef(null);\n  const state = useListState(props);\n  const { descriptionProps, gridProps, labelProps, errorMessageProps } =\n    useTagGroup(props, state, ref);\n\n  return (\n    <Field\n      {...otherProps}\n      error={!!errorMessage}\n      labelPlacement={labelPlacement}\n      labelVerticalAlignment=\"top\"\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 {...gridProps} ref={ref} className={styles['sapphire-tag-group']}>\n          {[...state.collection].map((item) => (\n            <Tag\n              key={item.key}\n              item={item}\n              state={state}\n              hasError={item.props.hasError}\n            />\n          ))}\n        </div>\n      </Field.Control>\n      {(note || errorMessage) &&\n        (errorMessage ? (\n          <Field.Footer>\n            <Field.Note {...errorMessageProps}>{errorMessage}</Field.Note>\n          </Field.Footer>\n        ) : (\n          <Field.Footer>\n            <Field.Note {...descriptionProps}>{note}</Field.Note>\n          </Field.Footer>\n        ))}\n    </Field>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsDO,SAAA,QAAA,CAAoC,KAAyB,EAAA;AAClE,EAAA,aAAA,EAAA,CAAA;AACA,EAAA,MAOI,EANF,GAAA,KAAA,EAAA;AAAA,IAAA,cAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,cAAiB,GAAA,OAAA;AAAA,IACjB,IAAA;AAAA,GAEE,GAAA,EAAA,EADC,uBACD,EADC,EAAA;AAAA,IALH,gBAAA;AAAA,IACA,cAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,GAAA,CAAA,CAAA;AAGF,EAAA,MAAM,MAAM,MAAO,CAAA,IAAA,CAAA,CAAA;AACnB,EAAA,MAAM,QAAQ,YAAa,CAAA,KAAA,CAAA,CAAA;AAC3B,EAAA,MAAM,EAAE,gBAAkB,EAAA,SAAA,EAAW,YAAY,iBAC/C,EAAA,GAAA,WAAA,CAAY,OAAO,KAAO,EAAA,GAAA,CAAA,CAAA;AAE5B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,UADN,CAAA,EAAA;AAAA,IAEE,KAAA,EAAO,CAAC,CAAC,YAAA;AAAA,IACT,cAAA;AAAA,IACA,sBAAuB,EAAA,KAAA;AAAA,GAErB,CAAA,EAAA,CAAA,SAAA,IAAa,mCACZ,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,OAAP,IACE,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAAW,UAAX,CAAA,EAAA;AAAA,IAAuB,cAAA;AAAA,GACpB,CAAA,EAAA,SAAA,CAAA,CAAA,sCAIN,KAAM,CAAA,OAAA,EAAP,sBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAD,iCAAS,SAAT,CAAA,EAAA;AAAA,IAAoB,GAAA;AAAA,IAAU,WAAW,MAAO,CAAA,oBAAA,CAAA;AAAA,GAC7C,CAAA,EAAA,CAAC,GAAG,KAAM,CAAA,UAAA,CAAA,CAAY,IAAI,CAAC,IAAA,yCACzB,GAAD,EAAA;AAAA,IACE,KAAK,IAAK,CAAA,GAAA;AAAA,IACV,IAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA,EAAU,KAAK,KAAM,CAAA,QAAA;AAAA,GAK3B,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA,IAAA,IAAQ,kBAEN,YAAA,mBAAA,KAAA,CAAA,aAAA,CAAC,MAAM,MAAP,EAAA,IAAA,sCACG,KAAM,CAAA,IAAA,EAAP,mBAAgB,iBAAoB,CAAA,EAAA,YAAA,CAAA,CAAA,uCAGrC,KAAM,CAAA,MAAA,EAAP,sBACG,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,IAAP,EAAA,cAAA,CAAA,EAAA,EAAgB,gBAAmB,CAAA,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

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

@@ -0,0 +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\nconst TagItem = Item as <T>(props: TagItemProps<T>) => JSX.Element;\n\nexport { TagItem };\n"],"names":[],"mappings":";;AAWA,MAAM,OAAU,GAAA;;;;"}

package/build/esm/index.js

@@ -21,8 +21,8 @@ export { FileDropzone } from './FileDropzone/src/FileDropzone.js';
 export { FileTrigger } from './FileDropzone/src/FileTrigger.js';
 export { AlertDialog } from './AlertDialog/src/AlertDialog.js';
 export { NumberField } from './NumberField/src/NumberField.js';
-export { TagGroup } from './Tag/src/TagGroup.js';
-export { TagItem } from './Tag/src/TagItem.js';
+export { TagGroup } from './TagGroup/src/TagGroup.js';
+export { TagItem } from './TagGroup/src/TagItem.js';
 export { LabeledValue } from './LabeledValue/src/LabeledValue.js';
 export { useLocale } from '@react-aria/i18n';
 //# sourceMappingURL=index.js.map

package/build/index.d.ts

@@ -126,6 +126,11 @@ declare type SpinnerProps = {
      * @default 'm'
      */
     size?: 'xxxs' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+    /**
+     * The color variant of the spinner. Using `default` will use predefined colors, while `inherit` will use the text color.
+     * @default 'default'
+     */
+    variant?: 'default' | 'inherit';
 } & SapphireStyleProps & ({
     'aria-labelledby': string;
 } | {
@@ -135,7 +140,7 @@ declare type SpinnerProps = {
  * Animated element that show that some data is still loading or some process
  * is in progress. The hidden label is required for accessibility reasons.
  */
-declare const Spinner: ({ size, ...props }: SpinnerProps) => JSX.Element;
+declare const Spinner: ({ size, variant, ...props }: SpinnerProps) => JSX.Element;
 
 declare type NotificationBadgeProps = {
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danske/sapphire-react-lab",
-  "version": "0.86.0",
+  "version": "0.86.3",
   "license": "SEE LICENSE IN LICENSE",
   "description": "Experimental React components of the Sapphire Design System from Danske Bank A/S",
   "exports": {
@@ -25,18 +25,18 @@
   },
   "peerDependencies": {
     "@danske/sapphire-icons": "^2.1.0",
-    "@danske/sapphire-react": "^3.34.3",
+    "@danske/sapphire-react": "^3.35.1",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
   },
   "devDependencies": {
     "@danske/sapphire-icons": "^2.1.0",
-    "@danske/sapphire-react": "^3.34.3",
+    "@danske/sapphire-react": "^3.35.1",
     "@types/react-transition-group": "^4.4.5",
     "cross-env": "^7.0.3"
   },
   "dependencies": {
-    "@danske/sapphire-css": "^28.4.0",
+    "@danske/sapphire-css": "^30.0.3",
     "@internationalized/date": "^3.5.2",
     "@internationalized/string": "^3.2.1",
     "@react-aria/accordion": "^3.0.0-alpha.29",
@@ -74,5 +74,5 @@
     "clsx": "^1.1.1",
     "react-transition-group": "^4.4.5"
   },
-  "gitHead": "546502d6671ee7c2ef9802b577b78cd587ba110c"
+  "gitHead": "dff768a601eaacae0e6847fbc1d3739f996f6ab2"
 }

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

@@ -1 +0,0 @@
-{"version":3,"file":"Tag.js","sources":["../../../../src/Tag/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 } from '@react-aria/utils';\nimport type { ListState } from '@react-stately/list';\nimport type { FocusableElement, Node } from '@react-types/shared';\n\nimport { useThemeCheck } from '@danske/sapphire-react';\nimport { AlertCircle, Close } from '@danske/sapphire-icons/react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\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\nexport function Tag<T>(props: TagProps<T>) {\n  useThemeCheck();\n  const { hasError = false, item, state } = props;\n  const ref = useRef(null);\n  const {\n    allowsRemoving,\n    allowsSelection,\n    gridCellProps,\n    isDisabled,\n    isFocused,\n    isPressed,\n    isSelected,\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    <div\n      ref={ref}\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      )}\n      className={clsx(\n        styles['sapphire-tag'],\n        styles['js-focus'],\n        styles['js-hover'],\n        {\n          [styles['sapphire-tag--error']]: hasError,\n          [styles['is-active']]: allowsSelection && isSelected,\n          [styles['is-active']]: hasAction && isPressed,\n          [styles['is-focus']]: isFocused,\n          [styles['is-hover']]: hasAction && isHovered,\n          [styles['is-disabled']]: isDisabled,\n        }\n      )}\n      aria-invalid={hasError}\n    >\n      <div {...gridCellProps} className={styles['sapphire-tag__gridcell']}>\n        {hasError && <IconError />}\n        {item.rendered}\n        {allowsRemoving && (\n          <RemoveButton {...(removeButtonProps as AriaButtonProps)} />\n        )}\n      </div>\n    </div>\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      <span className={styles['sapphire-tag__icon']}>\n        <Close />\n      </span>\n    </button>\n  );\n}\n\nconst IconError = () => {\n  return (\n    <span\n      className={clsx(\n        styles['sapphire-tag__icon'],\n        styles['sapphire-tag__icon--error']\n      )}\n    >\n      <AlertCircle />\n    </span>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"TagGroup.js","sources":["../../../../src/Tag/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} from '@danske/sapphire-react';\nimport styles from '@danske/sapphire-css/components/tag/tag.module.css';\n\nimport { Tag } from './Tag';\n\nexport interface TagGroupProps<T>\n  extends CollectionBase<T>,\n    DOMProps,\n    AriaLabelingProps,\n    SapphireStyleProps {\n  /**\n   * A ContextualHelp 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  onRemove?: (keys: Set<Key>) => void;\n}\n\nexport function TagGroup<T extends object>(props: TagGroupProps<T>) {\n  useThemeCheck();\n  const {\n    contextualHelp,\n    errorMessage,\n    label: labelText,\n    labelPlacement = 'above',\n    note,\n    ...otherProps\n  } = props;\n  const ref = useRef(null);\n  const state = useListState(props);\n  const { descriptionProps, gridProps, labelProps, errorMessageProps } =\n    useTagGroup(props, state, ref);\n\n  return (\n    <Field\n      {...otherProps}\n      error={!!errorMessage}\n      labelPlacement={labelPlacement}\n      labelVerticalAlignment=\"top\"\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 {...gridProps} ref={ref} className={styles['sapphire-tag-group']}>\n          {[...state.collection].map((item) => (\n            <Tag\n              key={item.key}\n              item={item}\n              state={state}\n              hasError={item.props.hasError}\n            />\n          ))}\n        </div>\n      </Field.Control>\n      {(note || errorMessage) &&\n        (errorMessage ? (\n          <Field.Footer>\n            <Field.Note {...errorMessageProps}>{errorMessage}</Field.Note>\n          </Field.Footer>\n        ) : (\n          <Field.Footer>\n            <Field.Note {...descriptionProps}>{note}</Field.Note>\n          </Field.Footer>\n        ))}\n    </Field>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsDO,SAAA,QAAA,CAAoC,KAAyB,EAAA;AAClE,EAAA,aAAA,EAAA,CAAA;AACA,EAAA,MAOI,EANF,GAAA,KAAA,EAAA;AAAA,IAAA,cAAA;AAAA,IACA,YAAA;AAAA,IACA,KAAO,EAAA,SAAA;AAAA,IACP,cAAiB,GAAA,OAAA;AAAA,IACjB,IAAA;AAAA,GAEE,GAAA,EAAA,EADC,uBACD,EADC,EAAA;AAAA,IALH,gBAAA;AAAA,IACA,cAAA;AAAA,IACA,OAAA;AAAA,IACA,gBAAA;AAAA,IACA,MAAA;AAAA,GAAA,CAAA,CAAA;AAGF,EAAA,MAAM,MAAM,MAAO,CAAA,IAAA,CAAA,CAAA;AACnB,EAAA,MAAM,QAAQ,YAAa,CAAA,KAAA,CAAA,CAAA;AAC3B,EAAA,MAAM,EAAE,gBAAkB,EAAA,SAAA,EAAW,YAAY,iBAC/C,EAAA,GAAA,WAAA,CAAY,OAAO,KAAO,EAAA,GAAA,CAAA,CAAA;AAE5B,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACM,UADN,CAAA,EAAA;AAAA,IAEE,KAAA,EAAO,CAAC,CAAC,YAAA;AAAA,IACT,cAAA;AAAA,IACA,sBAAuB,EAAA,KAAA;AAAA,GAErB,CAAA,EAAA,CAAA,SAAA,IAAa,mCACZ,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,OAAP,IACE,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAD,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EAAW,UAAX,CAAA,EAAA;AAAA,IAAuB,cAAA;AAAA,GACpB,CAAA,EAAA,SAAA,CAAA,CAAA,sCAIN,KAAM,CAAA,OAAA,EAAP,sBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAD,iCAAS,SAAT,CAAA,EAAA;AAAA,IAAoB,GAAA;AAAA,IAAU,WAAW,MAAO,CAAA,oBAAA,CAAA;AAAA,GAC7C,CAAA,EAAA,CAAC,GAAG,KAAM,CAAA,UAAA,CAAA,CAAY,IAAI,CAAC,IAAA,yCACzB,GAAD,EAAA;AAAA,IACE,KAAK,IAAK,CAAA,GAAA;AAAA,IACV,IAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA,EAAU,KAAK,KAAM,CAAA,QAAA;AAAA,GAK3B,CAAA,CAAA,CAAA,CAAA,EAAA,CAAA,IAAA,IAAQ,kBAEN,YAAA,mBAAA,KAAA,CAAA,aAAA,CAAC,MAAM,MAAP,EAAA,IAAA,sCACG,KAAM,CAAA,IAAA,EAAP,mBAAgB,iBAAoB,CAAA,EAAA,YAAA,CAAA,CAAA,uCAGrC,KAAM,CAAA,MAAA,EAAP,sBACG,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,IAAP,EAAA,cAAA,CAAA,EAAA,EAAgB,gBAAmB,CAAA,EAAA,IAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA;;;;"}

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

@@ -1 +0,0 @@
-{"version":3,"file":"TagItem.js","sources":["../../../../src/Tag/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\nconst TagItem = Item as <T>(props: TagItemProps<T>) => JSX.Element;\n\nexport { TagItem };\n"],"names":[],"mappings":";;AAWA,MAAM,OAAU,GAAA;;;;"}