@dnb/eufemia 10.12.0 → 10.14.0

package/components/radio/style/themes/dnb-radio-theme-ui.min.css

@@ -1 +1 @@
-.dnb-radio__dot{background-color:var(--color-sea-green);transition:opacity .2s ease-out,transform .2s ease-out}.dnb-radio__input:checked~.dnb-radio__button,.dnb-radio__input[data-checked=true]~.dnb-radio__button{background-color:var(--color-white);border-color:var(--color-sea-green)}.dnb-radio__input:checked~.dnb-radio__dot,.dnb-radio__input[data-checked=true]~.dnb-radio__dot{opacity:1;transform:scale(1)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__dot{opacity:0;transform:scale(.8)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__button{background-color:var(--color-white);border-color:var(--color-sea-green)}.dnb-radio__input[disabled]:checked~.dnb-radio__button,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__button{border-color:var(--color-sea-green-30)}.dnb-radio__input[disabled]:not(:checked):not([data-checked=true])~.dnb-radio__button{border-color:var(--color-mint-green-50)}.dnb-radio__input[disabled]:checked~.dnb-radio__dot,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__dot{background-color:var(--color-sea-green-30)}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__button,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__button{border-color:var(--color-mint-green-50)}.dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):active~.dnb-radio__button{background-color:var(--color-mint-green-50);border-color:transparent}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__dot,.dnb-radio__input:not([disabled]):not(:focus):checked:hover~.dnb-radio__dot,.dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button,.dnb-radio__input:not([disabled]):not(:focus)[data-checked=true]:hover~.dnb-radio__dot,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__dot,html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):focus~.dnb-radio__button{background-color:var(--color-mint-green-50)}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):focus~.dnb-radio__button{border:none}.dnb-radio__input:not([disabled]):active~.dnb-radio__focus,.dnb-radio__input:not([disabled]):focus~.dnb-radio__focus{display:block}.dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):active~.dnb-radio__button,.dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):focus~.dnb-radio__button{background-color:var(--color-mint-green-50)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__button{border:none}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__focus{--border-color:var(--color-fire-red);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color);display:block}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button{background-color:var(--color-fire-red-8)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover):checked~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover)[data-checked=true]~.dnb-radio__dot{background-color:var(--color-fire-red)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):checked:hover~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)[data-checked=true]:hover~.dnb-radio__dot{background-color:var(--color-fire-red-8)}.dnb-radio>.dnb-form-status{transform:translateY(.25rem)}
+.dnb-radio{--radio-color-dot-on:var(--color-sea-green);--radio-color-background-on:var(--color-white);--radio-color-border-on:var(--color-sea-green);--radio-color-background-off:var(--color-white);--radio-color-border-off:var(--color-sea-green);--radio-color-dot-on--disabled:var(--color-sea-green-30);--radio-color-border-on--disabled:var(--color-sea-green-30);--radio-color-border-off--disabled:var(--color-mint-green-50);--radio-color-dot-on--active:var(--color-mint-green-50);--radio-color-border-on--active:var(--color-mint-green-50);--radio-color-background-off--active:var(--color-mint-green-50);--radio-color-border-off--active:transparent;--radio-color-dot-on--hover:var(--color-mint-green-50);--radio-color-background-off--hover:var(--color-mint-green-50);--radio-color-background-on--focus:var(--color-white);--radio-color-background-off--focus:var(--color-mint-green-50);--radio-color-dot-on--error:var(--color-fire-red);--radio-color-border-on--error:var(--color-fire-red);--radio-color-background-off--error:var(--color-fire-red-8);--radio-color-dot-on--error-hover:var(--color-fire-red-8)}

package/components/radio/style/themes/dnb-radio-theme-ui.scss

@@ -3,148 +3,31 @@
 *
 */
 
-@import '../../../../style/core/utilities.scss';
-
 .dnb-radio {
-  &__dot {
-    background-color: var(--color-sea-green);
-    transition:
-      opacity 200ms ease-out,
-      transform 200ms ease-out;
-  }
-
-  // When radio is ON
-  &__input:checked ~ &__button,
-  &__input[data-checked='true'] ~ &__button {
-    background-color: var(--color-white);
-    border-color: var(--color-sea-green);
-  }
-  &__input:checked ~ &__dot,
-  &__input[data-checked='true'] ~ &__dot {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  // When radio is OFF
-  &__input:not(:checked):not([data-checked='true']) ~ &__dot {
-    opacity: 0;
-    transform: scale(0.8);
-  }
-  &__input:not(:checked):not([data-checked='true']) ~ &__button {
-    background-color: var(--color-white);
-    border-color: var(--color-sea-green);
-  }
-
-  // On disabled
-  &__input[disabled]:checked ~ &__button,
-  &__input[disabled][data-checked='true'] ~ &__button {
-    border-color: var(--color-sea-green-30);
-  }
-  &__input[disabled]:not(:checked):not([data-checked='true']) ~ &__button {
-    border-color: var(--color-mint-green-50);
-  }
-  &__input[disabled]:checked ~ &__dot,
-  &__input[disabled][data-checked='true'] ~ &__dot {
-    background-color: var(--color-sea-green-30);
-  }
-
-  // On active
-  &__input:not([disabled]):checked:active ~ &__button,
-  &__input:not([disabled])[data-checked='true']:active ~ &__button {
-    border-color: var(--color-mint-green-50);
-  }
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):active
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-    border-color: transparent;
-  }
-  &__input:not([disabled]):checked:active ~ &__dot,
-  &__input:not([disabled])[data-checked='true']:active ~ &__dot {
-    background-color: var(--color-mint-green-50);
-  }
-
-  // On hover
-  &__input:not([disabled]):not(:focus):not(:checked):not(
-      [data-checked='true']
-    ):hover
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-  }
-  &__input:not([disabled]):not(:focus):checked:hover ~ &__dot,
-  &__input:not([disabled]):not(:focus)[data-checked='true']:hover
-    ~ &__dot {
-    background-color: var(--color-mint-green-50);
-  }
-
-  // On focus
-  /* stylelint-disable */
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):focus
-    ~ &__button {
-    html[data-whatinput='keyboard'] & {
-      background-color: var(--color-mint-green-50);
-    }
-  }
-  &__input:not([disabled]):focus ~ &__button {
-    html[data-whatinput='keyboard'] & {
-      border: none;
-    }
-  }
-  &__input:not([disabled]):focus ~ &__focus,
-  &__input:not([disabled]):active ~ &__focus {
-    display: block;
-  }
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):focus
-    ~ &__button,
-  &__input:not([disabled]):not(:checked):not([data-checked='true']):active
-    ~ &__button {
-    background-color: var(--color-mint-green-50);
-  }
-  /* stylelint-enable */
-
-  // On error state
-  /* stylelint-disable */
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active)
-    ~ &__button {
-    border: none;
-  }
-  /* stylelint-enable */
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active)
-    ~ &__focus {
-    display: block;
-    @include fakeBorder(var(--color-fire-red), var(--focus-ring-width));
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:checked):not(
-      [data-checked='true']
-    ):hover
-    ~ &__button {
-    background-color: var(--color-fire-red-8);
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):not(:hover):checked
-    ~ &__dot,
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):not(
-      :hover
-    )[data-checked='true']
-    ~ &__dot {
-    background-color: var(--color-fire-red);
-  }
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(:active):checked:hover
-    ~ &__dot,
-  &__status--error
-    &__input:not([disabled]):not(:focus):not(
-      :active
-    )[data-checked='true']:hover
-    ~ &__dot {
-    background-color: var(--color-fire-red-8);
-  }
-
-  // adjust the form-status to the inner border for 3px
-  > .dnb-form-status {
-    transform: translateY(0.25rem); /* 4/16 */
-  }
+  // Normal state
+  --radio-color-dot-on: var(--color-sea-green);
+  --radio-color-background-on: var(--color-white);
+  --radio-color-border-on: var(--color-sea-green);
+  --radio-color-background-off: var(--color-white);
+  --radio-color-border-off: var(--color-sea-green);
+  // Disabled state
+  --radio-color-dot-on--disabled: var(--color-sea-green-30);
+  --radio-color-border-on--disabled: var(--color-sea-green-30);
+  --radio-color-border-off--disabled: var(--color-mint-green-50);
+  // Active state
+  --radio-color-dot-on--active: var(--color-mint-green-50);
+  --radio-color-border-on--active: var(--color-mint-green-50);
+  --radio-color-background-off--active: var(--color-mint-green-50);
+  --radio-color-border-off--active: transparent;
+  // Hover state
+  --radio-color-dot-on--hover: var(--color-mint-green-50);
+  --radio-color-background-off--hover: var(--color-mint-green-50);
+  // Focus state
+  --radio-color-background-on--focus: var(--color-white);
+  --radio-color-background-off--focus: var(--color-mint-green-50);
+  // Error state
+  --radio-color-dot-on--error: var(--color-fire-red);
+  --radio-color-border-on--error: var(--color-fire-red);
+  --radio-color-background-off--error: var(--color-fire-red-8);
+  --radio-color-dot-on--error-hover: var(--color-fire-red-8);
 }

package/components/section/Section.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

package/components/section/Section.js.map

@@ -1 +1 @@
-{"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","defaultProps","element","Section","localProps","context","useContext","props","variant","breakout","roundedCorner","textColor","backgroundColor","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","params","_objectSpread","internalRef","useRef","elementRef","styleObj","computeStyle","value","getColor","String","style","createElement","_extends","test","undefined","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype Attributes = Record<string, unknown> & { style?: React.CSSProperties }\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    element,\n    variant,\n    breakout = true,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const params = {\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    ...attributes,\n  } as Attributes\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n  params.innerRef = elementRef\n\n  const styleObj = {\n    ...computeStyle(\n      breakout,\n      'breakout',\n      (value) => `var(--breakout--${value ? 'on' : 'off'})`\n    ),\n    ...computeStyle(\n      roundedCorner,\n      'rounded-corner',\n      (value) => value && 'var(--rounded-corner--value)'\n    ),\n    ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n    ...computeStyle(backgroundColor, 'background-color', (value) =>\n      getColor(value)\n    ),\n    ...computeStyle(outline, 'outline-color', (value) =>\n      String(value) === 'true'\n        ? 'var(--outline-color--value)'\n        : getColor(value)\n    ),\n    ...params?.style,\n  } as React.CSSProperties\n\n  return (\n    <Space {...params} element={element} style={styleObj}>\n      {children}\n    </Space>\n  )\n}\n\nfunction getColor(value: string) {\n  return value\n    ? !/#|var/.test(value)\n      ? `var(--color-${value})`\n      : value\n    : undefined\n}\n\nfunction computeStyle(\n  property: ResponsiveProp<unknown> | boolean | string,\n  name: string,\n  valueCallback: (value: string) => string | undefined\n) {\n  let media = property as ResponsiveProp<unknown>\n\n  if (media !== null && typeof media !== 'object') {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<unknown>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<unknown>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,SACEC,MAAM,EACNC,sBAAsB,QACjB,+BAA+B;AAMtC,OAAOC,KAAK,MAAM,gBAAgB;AAqGlC,MAAMC,YAAY,GAAG;EACnBC,OAAO,EAAE;AACX,CAAC;AAED,eAAe,SAASC,OAAOA,CAACC,UAA2B,EAAE;EAC3D,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAACT,OAAO,CAAC;EAGzC,MAAMU,KAAK,GAAGR,sBAAsB,CAClCK,UAAU,EACVH,YAAY,EACZI,OAAO,CAACF,OACV,CAAC;EAED,MAAM;MACJD,OAAO;MACPM,OAAO;MACPC,QAAQ,GAAG,IAAI;MACfC,aAAa;MACbC,SAAS;MACTC,eAAe;MACfC,OAAO;MACPC,QAAQ;MAERC,SAAS;MACTC,QAAQ;MAERC,OAAO;MACPC,UAAU;MACVC;IAGF,CAAC,GAAGZ,KAAK;IADJa,UAAU,GAAAC,wBAAA,CACXd,KAAK,EAAAe,SAAA;EAET,MAAMC,MAAM,GAAAC,aAAA;IACVT,SAAS,EAAEnB,UAAU,6BAEHY,OAAO,GAAGA,OAAO,GAAGU,UAAU,IAAI,SAAU,IAG5DH,SAAS,EAFTE,OAAO,IACJ,wBAAuBnB,MAAM,CAACmB,OAAO,CAAC,GAAG,OAAO,GAAGA,OAAQ,EAEhE;EAAC,GACEG,UAAU,CACA;EAEf,MAAMK,WAAW,GAAG9B,KAAK,CAAC+B,MAAM,CAAc,CAAC;EAC/C,MAAMC,UAAU,GAAGb,QAAQ,IAAIK,SAAS,IAAIM,WAAW;EACvDF,MAAM,CAACT,QAAQ,GAAGa,UAAU;EAE5B,MAAMC,QAAQ,GAAAJ,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,KACTK,YAAY,CACbpB,QAAQ,EACR,UAAU,EACTqB,KAAK,IAAM,mBAAkBA,KAAK,GAAG,IAAI,GAAG,KAAM,GACrD,CAAC,GACED,YAAY,CACbnB,aAAa,EACb,gBAAgB,EACfoB,KAAK,IAAKA,KAAK,IAAI,8BACtB,CAAC,GACED,YAAY,CAAClB,SAAS,EAAE,YAAY,EAAGmB,KAAK,IAAKC,QAAQ,CAACD,KAAK,CAAC,CAAC,GACjED,YAAY,CAACjB,eAAe,EAAE,kBAAkB,EAAGkB,KAAK,IACzDC,QAAQ,CAACD,KAAK,CAChB,CAAC,GACED,YAAY,CAAChB,OAAO,EAAE,eAAe,EAAGiB,KAAK,IAC9CE,MAAM,CAACF,KAAK,CAAC,KAAK,MAAM,GACpB,6BAA6B,GAC7BC,QAAQ,CAACD,KAAK,CACpB,CAAC,GACEP,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEU,KAAK,CACM;EAExB,OACEtC,KAAA,CAAAuC,aAAA,CAAClC,KAAK,EAAAmC,QAAA,KAAKZ,MAAM;IAAErB,OAAO,EAAEA,OAAQ;IAAC+B,KAAK,EAAEL;EAAS,IAClDZ,QACI,CAAC;AAEZ;AAEA,SAASe,QAAQA,CAACD,KAAa,EAAE;EAC/B,OAAOA,KAAK,GACR,CAAC,OAAO,CAACM,IAAI,CAACN,KAAK,CAAC,GACjB,eAAcA,KAAM,GAAE,GACvBA,KAAK,GACPO,SAAS;AACf;AAEA,SAASR,YAAYA,CACnBS,QAAoD,EACpDC,IAAY,EACZC,aAAoD,EACpD;EACA,IAAIC,KAAK,GAAGH,QAAmC;EAE/C,IAAIG,KAAK,KAAK,IAAI,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC/CA,KAAK,GAAG;MACNC,KAAK,EAAEJ,QAAQ;MACfK,MAAM,EAAEL,QAAQ;MAChBM,KAAK,EAAEN;IACT,CAA4B;EAC9B;EAEA,MAAMO,MAAM,GAAG,CAAC,CAAC;EAEjB,KAAK,MAAMC,IAAI,IAAIL,KAAK,EAA6B;IAAA,IAAAM,MAAA;IACnD,IAAI,SAAAA,MAAA,GAAON,KAAK,cAAAM,MAAA,uBAALA,MAAA,CAAQD,IAAI,CAAC,MAAK,WAAW,EAAE;MAAA,IAAAE,OAAA;MACxC,MAAMlB,KAAK,GAAGU,aAAa,EAAAQ,OAAA,GAACP,KAAK,cAAAO,OAAA,uBAALA,OAAA,CAAQF,IAAI,CAAC,CAAC;MAC1C,IAAI,OAAOhB,KAAK,KAAK,QAAQ,EAAE;QAC7Be,MAAM,CAAE,KAAIN,IAAK,KAAIO,IAAK,EAAC,CAAC,GAAGhB,KAAK;MACtC;IACF;EACF;EAEA,OAAOe,MAAM;AACf;AAEA1C,OAAO,CAAC8C,KAAK,GAAG,SAAS;AACzB9C,OAAO,CAAC+C,qBAAqB,GAAG,IAAI"}
+{"version":3,"file":"Section.js","names":["React","classnames","Context","isTrue","extendPropsWithContext","Space","defaultProps","element","Section","localProps","context","useContext","props","variant","breakout","roundedCorner","textColor","backgroundColor","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","_objectWithoutProperties","_excluded","params","_objectSpread","internalRef","useRef","elementRef","styleObj","computeStyle","value","getColor","String","style","createElement","_extends","test","undefined","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype Attributes = Record<string, unknown> & { style?: React.CSSProperties }\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    element,\n    variant,\n    breakout = true,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const params = {\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    ...attributes,\n  } as Attributes\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n  params.innerRef = elementRef\n\n  const styleObj = {\n    ...computeStyle(\n      breakout,\n      'breakout',\n      (value) => `var(--breakout--${value ? 'on' : 'off'})`\n    ),\n    ...computeStyle(\n      roundedCorner,\n      'rounded-corner',\n      (value) => value && 'var(--rounded-corner--value)'\n    ),\n    ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n    ...computeStyle(backgroundColor, 'background-color', (value) =>\n      getColor(value)\n    ),\n    ...computeStyle(outline, 'outline-color', (value) =>\n      String(value) === 'true'\n        ? 'var(--outline-color--value)'\n        : getColor(value)\n    ),\n    ...params?.style,\n  } as React.CSSProperties\n\n  return (\n    <Space {...params} element={element} style={styleObj}>\n      {children}\n    </Space>\n  )\n}\n\nfunction getColor(value: string) {\n  return value\n    ? !/#|var/.test(value)\n      ? `var(--color-${value})`\n      : value\n    : undefined\n}\n\nfunction computeStyle(\n  property: ResponsiveProp<unknown> | boolean | string,\n  name: string,\n  valueCallback: (value: string) => string | undefined\n) {\n  let media = property as ResponsiveProp<unknown>\n\n  if (media !== null && typeof media !== 'object') {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<unknown>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<unknown>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":";;;;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,SACEC,MAAM,EACNC,sBAAsB,QACjB,+BAA+B;AAMtC,OAAOC,KAAK,MAAM,gBAAgB;AAqGlC,MAAMC,YAAY,GAAG;EACnBC,OAAO,EAAE;AACX,CAAC;AAED,eAAe,SAASC,OAAOA,CAACC,UAA2B,EAAE;EAC3D,MAAMC,OAAO,GAAGV,KAAK,CAACW,UAAU,CAACT,OAAO,CAAC;EAGzC,MAAMU,KAAK,GAAGR,sBAAsB,CAClCK,UAAU,EACVH,YAAY,EACZI,OAAO,CAACF,OACV,CAAC;EAED,MAAM;MACJD,OAAO;MACPM,OAAO;MACPC,QAAQ,GAAG,IAAI;MACfC,aAAa;MACbC,SAAS;MACTC,eAAe;MACfC,OAAO;MACPC,QAAQ;MAERC,SAAS;MACTC,QAAQ;MAERC,OAAO;MACPC,UAAU;MACVC;IAGF,CAAC,GAAGZ,KAAK;IADJa,UAAU,GAAAC,wBAAA,CACXd,KAAK,EAAAe,SAAA;EAET,MAAMC,MAAM,GAAAC,aAAA;IACVT,SAAS,EAAEnB,UAAU,6BAEHY,OAAO,GAAGA,OAAO,GAAGU,UAAU,IAAI,SAAU,IAG5DH,SAAS,EAFTE,OAAO,IACJ,wBAAuBnB,MAAM,CAACmB,OAAO,CAAC,GAAG,OAAO,GAAGA,OAAQ,EAEhE;EAAC,GACEG,UAAU,CACA;EAEf,MAAMK,WAAW,GAAG9B,KAAK,CAAC+B,MAAM,CAAc,CAAC;EAC/C,MAAMC,UAAU,GAAGb,QAAQ,IAAIK,SAAS,IAAIM,WAAW;EACvDF,MAAM,CAACT,QAAQ,GAAGa,UAAU;EAE5B,MAAMC,QAAQ,GAAAJ,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,KACTK,YAAY,CACbpB,QAAQ,EACR,UAAU,EACTqB,KAAK,IAAM,mBAAkBA,KAAK,GAAG,IAAI,GAAG,KAAM,GACrD,CAAC,GACED,YAAY,CACbnB,aAAa,EACb,gBAAgB,EACfoB,KAAK,IAAKA,KAAK,IAAI,8BACtB,CAAC,GACED,YAAY,CAAClB,SAAS,EAAE,YAAY,EAAGmB,KAAK,IAAKC,QAAQ,CAACD,KAAK,CAAC,CAAC,GACjED,YAAY,CAACjB,eAAe,EAAE,kBAAkB,EAAGkB,KAAK,IACzDC,QAAQ,CAACD,KAAK,CAChB,CAAC,GACED,YAAY,CAAChB,OAAO,EAAE,eAAe,EAAGiB,KAAK,IAC9CE,MAAM,CAACF,KAAK,CAAC,KAAK,MAAM,GACpB,6BAA6B,GAC7BC,QAAQ,CAACD,KAAK,CACpB,CAAC,GACEP,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEU,KAAK,CACM;EAExB,OACEtC,KAAA,CAAAuC,aAAA,CAAClC,KAAK,EAAAmC,QAAA,KAAKZ,MAAM;IAAErB,OAAO,EAAEA,OAAQ;IAAC+B,KAAK,EAAEL;EAAS,IAClDZ,QACI,CAAC;AAEZ;AAEA,SAASe,QAAQA,CAACD,KAAa,EAAE;EAC/B,OAAOA,KAAK,GACR,CAAC,OAAO,CAACM,IAAI,CAACN,KAAK,CAAC,GACjB,eAAcA,KAAM,GAAE,GACvBA,KAAK,GACPO,SAAS;AACf;AAEA,SAASR,YAAYA,CACnBS,QAAoD,EACpDC,IAAY,EACZC,aAAoD,EACpD;EACA,IAAIC,KAAK,GAAGH,QAAmC;EAE/C,IAAIG,KAAK,KAAK,IAAI,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;IAC/CA,KAAK,GAAG;MACNC,KAAK,EAAEJ,QAAQ;MACfK,MAAM,EAAEL,QAAQ;MAChBM,KAAK,EAAEN;IACT,CAA4B;EAC9B;EAEA,MAAMO,MAAM,GAAG,CAAC,CAAC;EAEjB,KAAK,MAAMC,IAAI,IAAIL,KAAK,EAA6B;IAAA,IAAAM,MAAA;IACnD,IAAI,SAAAA,MAAA,GAAON,KAAK,cAAAM,MAAA,uBAALA,MAAA,CAAQD,IAAI,CAAC,MAAK,WAAW,EAAE;MAAA,IAAAE,OAAA;MACxC,MAAMlB,KAAK,GAAGU,aAAa,EAAAQ,OAAA,GAACP,KAAK,cAAAO,OAAA,uBAALA,OAAA,CAAQF,IAAI,CAAC,CAAC;MAC1C,IAAI,OAAOhB,KAAK,KAAK,QAAQ,EAAE;QAC7Be,MAAM,CAAE,KAAIN,IAAK,KAAIO,IAAK,EAAC,CAAC,GAAGhB,KAAK;MACtC;IACF;EACF;EAEA,OAAOe,MAAM;AACf;AAEA1C,OAAO,CAAC8C,KAAK,GAAG,SAAS;AACzB9C,OAAO,CAAC+C,qBAAqB,GAAG,IAAI"}

package/components/skeleton/Skeleton.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","validateDOMAttributes","isTrue","LOCALE","Space","spacingPropTypes","createSpacingClasses","Context","Provider","Skeleton","PureComponent","constructor","props","state","ariaLiveUpdate","componentWillUnmount","clearTimeout","_ariaLiveUpdateTimeout","componentDidUpdate","prevProps","show","setAriaLiveUpdate","getProps","arguments","length","undefined","context","defaultProps","skeleton","no_animation","skeleton_no_animation","getTranslation","setTimeout","aria_busy","aria_ready","newString","setState","render","figure","className","class","_className","children","attributes","_objectWithoutProperties","_excluded","showSkeleton","params","_objectSpread","lang","locale","createElement","_defineProperty","element","process","env","NODE_ENV","propTypes","oneOfType","string","bool","func","node","Exclude","_extends","_supportsSpacingProps"],"sources":["../../../../src/components/skeleton/Skeleton.js"],"sourcesContent":["/**\n * Web Skeleton Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  isTrue,\n} from '../../shared/component-helper'\nimport { LOCALE } from '../../shared/defaults'\nimport Space from '../space/Space'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport Context from '../../shared/Context'\nimport Provider from '../../shared/Provider'\n\nexport default class Skeleton extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    show: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    figure: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    aria_busy: PropTypes.string,\n    aria_ready: PropTypes.string,\n    element: PropTypes.node,\n\n    ...spacingPropTypes,\n\n    class: PropTypes.string,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    show: null,\n    skeleton: null, // only to make sure we process extendPropsWithContextInClassComponent\n    no_animation: null,\n    figure: null,\n    aria_busy: null,\n    aria_ready: null,\n    element: null,\n    class: null,\n    className: null,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n    this.state = { ariaLiveUpdate: null }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._ariaLiveUpdateTimeout)\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.show !== this.props.show) {\n      this.setAriaLiveUpdate()\n    }\n  }\n\n  getProps(props = this.props, context = this.context) {\n    return extendPropsWithContextInClassComponent(\n      props,\n      Skeleton.defaultProps,\n      {\n        skeleton: context.Skeleton || context.skeleton,\n        no_animation: context.skeleton_no_animation,\n      },\n      context.getTranslation(props).Skeleton\n    )\n  }\n\n  setAriaLiveUpdate() {\n    // this is only to make a better screen reader ux\n    clearTimeout(this._ariaLiveUpdateTimeout)\n    this._ariaLiveUpdateTimeout = setTimeout(() => {\n      const { aria_busy, aria_ready } = this.getProps()\n\n      let newString = null\n\n      if (isTrue(this.props.show)) {\n        newString = aria_busy\n      } else {\n        newString = aria_ready\n      }\n\n      if (newString) {\n        this.setState({\n          ariaLiveUpdate: newString,\n        })\n        this._ariaLiveUpdateTimeout = setTimeout(() => {\n          this.setState({\n            ariaLiveUpdate: null,\n          })\n        }, 1e3)\n      }\n    }, 1e3) // so that the input gets read out first, and then the results\n  }\n\n  render() {\n    // consume the skeleton context\n    const props = this.getProps()\n\n    const {\n      show,\n      no_animation,\n      figure,\n      skeleton,\n      aria_busy,\n      aria_ready, // eslint-disable-line\n      className,\n      class: _className,\n      children,\n\n      ...attributes\n    } = props\n\n    const { ariaLiveUpdate } = this.state\n\n    const showSkeleton =\n      typeof show === 'boolean' || typeof show === 'string'\n        ? isTrue(show)\n        : skeleton\n\n    const params = {\n      className: classnames(\n        figure ? 'dnb-skeleton__figure' : 'dnb-skeleton__root',\n        isTrue(showSkeleton) && 'dnb-skeleton',\n        isTrue(no_animation) && 'dnb-skeleton--no-animation',\n        createSpacingClasses(props),\n        className,\n        _className\n      ),\n      // role: 'status',// is not needed as for now\n      'aria-busy': showSkeleton,\n      'aria-label': showSkeleton ? aria_busy : undefined,\n      lang: this.context.locale || LOCALE,\n      ...attributes,\n    }\n\n    validateDOMAttributes(props, params)\n\n    return (\n      <Space {...params}>\n        {figure ? (\n          showSkeleton ? (\n            typeof figure === 'function' ? (\n              figure()\n            ) : (\n              figure\n            )\n          ) : (\n            children\n          )\n        ) : (\n          <Provider\n            skeleton={showSkeleton}\n            skeleton_no_animation={no_animation}\n          >\n            {children}\n          </Provider>\n        )}\n        <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n          {ariaLiveUpdate}\n        </span>\n      </Space>\n    )\n  }\n}\n\nfunction Exclude(props) {\n  return <Provider {...props} skeleton={false} />\n}\n\nSkeleton.Exclude = Exclude\n\nSkeleton._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"Skeleton.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","validateDOMAttributes","isTrue","LOCALE","Space","spacingPropTypes","createSpacingClasses","Context","Provider","Skeleton","PureComponent","constructor","props","state","ariaLiveUpdate","componentWillUnmount","clearTimeout","_ariaLiveUpdateTimeout","componentDidUpdate","prevProps","show","setAriaLiveUpdate","getProps","arguments","length","undefined","context","defaultProps","skeleton","no_animation","skeleton_no_animation","getTranslation","setTimeout","aria_busy","aria_ready","newString","setState","render","figure","className","class","_className","children","attributes","_objectWithoutProperties","_excluded","showSkeleton","params","_objectSpread","lang","locale","createElement","_defineProperty","element","process","env","NODE_ENV","propTypes","oneOfType","string","bool","func","node","Exclude","_extends","_supportsSpacingProps"],"sources":["../../../../src/components/skeleton/Skeleton.js"],"sourcesContent":["/**\n * Web Skeleton Component\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  validateDOMAttributes,\n  isTrue,\n} from '../../shared/component-helper'\nimport { LOCALE } from '../../shared/defaults'\nimport Space from '../space/Space'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport Context from '../../shared/Context'\nimport Provider from '../../shared/Provider'\n\nexport default class Skeleton extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    show: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    no_animation: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    figure: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    aria_busy: PropTypes.string,\n    aria_ready: PropTypes.string,\n    element: PropTypes.node,\n\n    ...spacingPropTypes,\n\n    class: PropTypes.string,\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    show: null,\n    skeleton: null, // only to make sure we process extendPropsWithContextInClassComponent\n    no_animation: null,\n    figure: null,\n    aria_busy: null,\n    aria_ready: null,\n    element: null,\n    class: null,\n    className: null,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n    this.state = { ariaLiveUpdate: null }\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._ariaLiveUpdateTimeout)\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps.show !== this.props.show) {\n      this.setAriaLiveUpdate()\n    }\n  }\n\n  getProps(props = this.props, context = this.context) {\n    return extendPropsWithContextInClassComponent(\n      props,\n      Skeleton.defaultProps,\n      {\n        skeleton: context.Skeleton || context.skeleton,\n        no_animation: context.skeleton_no_animation,\n      },\n      context.getTranslation(props).Skeleton\n    )\n  }\n\n  setAriaLiveUpdate() {\n    // this is only to make a better screen reader ux\n    clearTimeout(this._ariaLiveUpdateTimeout)\n    this._ariaLiveUpdateTimeout = setTimeout(() => {\n      const { aria_busy, aria_ready } = this.getProps()\n\n      let newString = null\n\n      if (isTrue(this.props.show)) {\n        newString = aria_busy\n      } else {\n        newString = aria_ready\n      }\n\n      if (newString) {\n        this.setState({\n          ariaLiveUpdate: newString,\n        })\n        this._ariaLiveUpdateTimeout = setTimeout(() => {\n          this.setState({\n            ariaLiveUpdate: null,\n          })\n        }, 1e3)\n      }\n    }, 1e3) // so that the input gets read out first, and then the results\n  }\n\n  render() {\n    // consume the skeleton context\n    const props = this.getProps()\n\n    const {\n      show,\n      no_animation,\n      figure,\n      skeleton,\n      aria_busy,\n      aria_ready, // eslint-disable-line\n      className,\n      class: _className,\n      children,\n\n      ...attributes\n    } = props\n\n    const { ariaLiveUpdate } = this.state\n\n    const showSkeleton =\n      typeof show === 'boolean' || typeof show === 'string'\n        ? isTrue(show)\n        : skeleton\n\n    const params = {\n      className: classnames(\n        figure ? 'dnb-skeleton__figure' : 'dnb-skeleton__root',\n        isTrue(showSkeleton) && 'dnb-skeleton',\n        isTrue(no_animation) && 'dnb-skeleton--no-animation',\n        createSpacingClasses(props),\n        className,\n        _className\n      ),\n      // role: 'status',// is not needed as for now\n      'aria-busy': showSkeleton,\n      'aria-label': showSkeleton ? aria_busy : undefined,\n      lang: this.context.locale || LOCALE,\n      ...attributes,\n    }\n\n    validateDOMAttributes(props, params)\n\n    return (\n      <Space {...params}>\n        {figure ? (\n          showSkeleton ? (\n            typeof figure === 'function' ? (\n              figure()\n            ) : (\n              figure\n            )\n          ) : (\n            children\n          )\n        ) : (\n          <Provider\n            skeleton={showSkeleton}\n            skeleton_no_animation={no_animation}\n          >\n            {children}\n          </Provider>\n        )}\n        <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n          {ariaLiveUpdate}\n        </span>\n      </Space>\n    )\n  }\n}\n\nfunction Exclude(props) {\n  return <Provider {...props} skeleton={false} />\n}\n\nSkeleton.Exclude = Exclude\n\nSkeleton._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/skeleton/figures/Article.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Article.js.map

@@ -1 +1 @@
-{"version":3,"file":"Article.js","names":["React","PropTypes","Context","SkeletonArticle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Article.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonArticle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Article.js","names":["React","PropTypes","Context","SkeletonArticle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Article.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonArticle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Circle.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Circle.js","names":["React","PropTypes","Context","SkeletonCircle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Circle.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonCircle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,cAAc,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB9DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,cAAc,iBACZD,OAAO;AAAA6B,eAAA,CADT5B,cAAc,kBAWX;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,cAAc,CAE1BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Circle.js","names":["React","PropTypes","Context","SkeletonCircle","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Circle.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonCircle extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,cAAc,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB9DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,cAAc,iBACZD,OAAO;AAAA6B,eAAA,CADT5B,cAAc,kBAWX;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,cAAc,CAE1BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Product.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Product.js.map

@@ -1 +1 @@
-{"version":3,"file":"Product.js","names":["React","PropTypes","Context","SkeletonProduct","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Product.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonProduct extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Product.js","names":["React","PropTypes","Context","SkeletonProduct","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Product.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonProduct extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,eAAe,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB/DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,eAAe,iBACbD,OAAO;AAAA6B,eAAA,CADT5B,eAAe,kBAWZ;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,eAAe,CAE3BgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/skeleton/figures/Table.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

package/components/skeleton/figures/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","names":["React","PropTypes","Context","SkeletonTable","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Table.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonTable extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,aAAa,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB7DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,aAAa,iBACXD,OAAO;AAAA6B,eAAA,CADT5B,aAAa,kBAWV;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,aAAa,CAEzBgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}
+{"version":3,"file":"Table.js","names":["React","PropTypes","Context","SkeletonTable","PureComponent","constructor","props","rows","fill","rowsLength","Array","map","_","i","c","length","concat","reverse","render","_this$props","children","rest","_objectWithoutProperties","_excluded","createElement","_extends","className","style","width","p","key","_defineProperty","process","env","NODE_ENV","propTypes","oneOfType","string","number","func","node"],"sources":["../../../../../src/components/skeleton/figures/Table.js"],"sourcesContent":["/**\n * Web Skeleton Figure\n *\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport Context from '../../../shared/Context'\nimport classnames from 'classnames'\n\nexport default class SkeletonTable extends React.PureComponent {\n  static contextType = Context\n  static propTypes = {\n    rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n  }\n\n  static defaultProps = {\n    rows: 3,\n    children: null,\n  }\n\n  constructor(props) {\n    super(props)\n\n    const { rows } = props\n\n    // Do this so we get the same result each time\n    // because of static generated markup\n    const fill = [70, 80, 60, 40, 50, 20, 0]\n    this.rowsLength = new Array(rows).fill(true).map((_, i) => {\n      const c = i % fill.length\n      if (c === fill.length - 1) {\n        fill.concat(fill.reverse())\n      }\n      return fill[c]\n    })\n  }\n\n  render() {\n    const {\n      rows, // eslint-disable-line\n      children,\n      ...rest\n    } = this.props\n\n    return (\n      <div\n        className={classnames(\n          'dnb-skeleton__figure',\n          'dnb-skeleton__figure--show'\n        )}\n        aria-busy\n        {...rest}\n      >\n        <div\n          className={classnames(\n            'dnb-h--xx-large',\n            'dnb-skeleton',\n            'dnb-skeleton--shape',\n            'dnb-space__bottom--large'\n          )}\n          aria-hidden\n          style={{\n            width: '50%',\n          }}\n        >\n          &zwnj;\n        </div>\n\n        {this.rowsLength.map((p, i) => (\n          <div\n            key={i}\n            className={classnames(\n              'dnb-p',\n              'dnb-skeleton',\n              'dnb-skeleton--shape',\n              'dnb-space__top--x-small'\n            )}\n            style={{\n              width: `${p}%`,\n            }}\n          >\n            &zwnj;\n          </div>\n        ))}\n\n        {children}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,OAAO,MAAM,yBAAyB;AAG7C,eAAe,MAAMC,aAAa,SAASH,KAAK,CAACI,aAAa,CAAC;EAgB7DC,WAAWA,CAACC,KAAK,EAAE;IACjB,KAAK,CAACA,KAAK,CAAC;IAEZ,MAAM;MAAEC;IAAK,CAAC,GAAGD,KAAK;IAItB,MAAME,IAAI,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;IACxC,IAAI,CAACC,UAAU,GAAG,IAAIC,KAAK,CAACH,IAAI,CAAC,CAACC,IAAI,CAAC,IAAI,CAAC,CAACG,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAK;MACzD,MAAMC,CAAC,GAAGD,CAAC,GAAGL,IAAI,CAACO,MAAM;MACzB,IAAID,CAAC,KAAKN,IAAI,CAACO,MAAM,GAAG,CAAC,EAAE;QACzBP,IAAI,CAACQ,MAAM,CAACR,IAAI,CAACS,OAAO,CAAC,CAAC,CAAC;MAC7B;MACA,OAAOT,IAAI,CAACM,CAAC,CAAC;IAChB,CAAC,CAAC;EACJ;EAEAI,MAAMA,CAAA,EAAG;IACP,MAAAC,WAAA,GAII,IAAI,CAACb,KAAK;MAJR;QACJC,IAAI;QACJa;MAEF,CAAC,GAAAD,WAAA;MADIE,IAAI,GAAAC,wBAAA,CAAAH,WAAA,EAAAI,SAAA;IAGT,OACEvB,KAAA,CAAAwB,aAAA,QAAAC,QAAA;MACEC,SAAS,mDAGP;MACF;IAAS,GACLL,IAAI,GAERrB,KAAA,CAAAwB,aAAA;MACEE,SAAS,6EAKP;MACF,mBAAW;MACXC,KAAK,EAAE;QACLC,KAAK,EAAE;MACT;IAAE,GACH,QAEI,CAAC,EAEL,IAAI,CAACnB,UAAU,CAACE,GAAG,CAAC,CAACkB,CAAC,EAAEhB,CAAC,KACxBb,KAAA,CAAAwB,aAAA;MACEM,GAAG,EAAEjB,CAAE;MACPa,SAAS,kEAKP;MACFC,KAAK,EAAE;QACLC,KAAK,EAAG,GAAEC,CAAE;MACd;IAAE,GACH,QAEI,CACN,CAAC,EAEDT,QACE,CAAC;EAEV;AACF;AAACW,eAAA,CArFoB5B,aAAa,iBACXD,OAAO;AAAA6B,eAAA,CADT5B,aAAa,kBAWV;EACpBI,IAAI,EAAE,CAAC;EACPa,QAAQ,EAAE;AACZ,CAAC;AAAAY,OAAA,CAAAC,GAAA,CAAAC,QAAA,oBAdkB/B,aAAa,CAEzBgC,SAAS,GAAG;EACjB5B,IAAI,EAAEN,SAAS,CAACmC,SAAS,CAAC,CAACnC,SAAS,CAACoC,MAAM,EAAEpC,SAAS,CAACqC,MAAM,CAAC,CAAC;EAC/DlB,QAAQ,EAAEnB,SAAS,CAACmC,SAAS,CAAC,CAC5BnC,SAAS,CAACoC,MAAM,EAChBpC,SAAS,CAACsC,IAAI,EACdtC,SAAS,CAACuC,IAAI,CACf;AACH,CAAC"}

package/components/slider/Slider.d.ts

@@ -6,6 +6,7 @@ import type { SliderAllProps } from './types';
 export * from './types';
 declare function Slider(localProps: SliderAllProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Slider {
+    var _formElement: boolean;
     var _supportsSpacingProps: boolean;
 }
 export default Slider;

package/components/slider/Slider.js

@@ -6,6 +6,7 @@ export * from './types';
 function Slider(localProps) {
   return React.createElement(SliderProvider, localProps, _SliderInstance || (_SliderInstance = React.createElement(SliderInstance, null)));
 }
+Slider._formElement = true;
 Slider._supportsSpacingProps = true;
 export default Slider;
 //# sourceMappingURL=Slider.js.map

package/components/slider/Slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.js","names":["React","SliderProvider","SliderInstance","Slider","localProps","createElement","_SliderInstance","_supportsSpacingProps"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\n\nimport { SliderProvider } from './SliderProvider'\nimport { SliderInstance } from './SliderInstance'\n\nimport type { SliderAllProps } from './types'\n\nexport * from './types'\n\nfunction Slider(localProps: SliderAllProps) {\n  return (\n    <SliderProvider {...localProps}>\n      <SliderInstance />\n    </SliderProvider>\n  )\n}\n\nSlider._supportsSpacingProps = true\n\nexport default Slider\n"],"mappings":";AAKA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,cAAc,QAAQ,kBAAkB;AAIjD,cAAc,SAAS;AAEvB,SAASC,MAAMA,CAACC,UAA0B,EAAE;EAC1C,OACEJ,KAAA,CAAAK,aAAA,CAACJ,cAAc,EAAKG,UAAU,EAAAE,eAAA,KAAAA,eAAA,GAC5BN,KAAA,CAAAK,aAAA,CAACH,cAAc,MAAE,CAAC,CACJ,CAAC;AAErB;AAEAC,MAAM,CAACI,qBAAqB,GAAG,IAAI;AAEnC,eAAeJ,MAAM"}
+{"version":3,"file":"Slider.js","names":["React","SliderProvider","SliderInstance","Slider","localProps","createElement","_SliderInstance","_formElement","_supportsSpacingProps"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\n\nimport { SliderProvider } from './SliderProvider'\nimport { SliderInstance } from './SliderInstance'\n\nimport type { SliderAllProps } from './types'\n\nexport * from './types'\n\nfunction Slider(localProps: SliderAllProps) {\n  return (\n    <SliderProvider {...localProps}>\n      <SliderInstance />\n    </SliderProvider>\n  )\n}\n\nSlider._formElement = true\nSlider._supportsSpacingProps = true\n\nexport default Slider\n"],"mappings":";AAKA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,cAAc,QAAQ,kBAAkB;AAIjD,cAAc,SAAS;AAEvB,SAASC,MAAMA,CAACC,UAA0B,EAAE;EAC1C,OACEJ,KAAA,CAAAK,aAAA,CAACJ,cAAc,EAAKG,UAAU,EAAAE,eAAA,KAAAA,eAAA,GAC5BN,KAAA,CAAAK,aAAA,CAACH,cAAc,MAAE,CAAC,CACJ,CAAC;AAErB;AAEAC,MAAM,CAACI,YAAY,GAAG,IAAI;AAC1BJ,MAAM,CAACK,qBAAqB,GAAG,IAAI;AAEnC,eAAeL,MAAM"}

package/components/slider/SliderInstance.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 var _SubtractButton, _AddButton, _AlignmentHelper, _SliderMainTrack, _SliderSuffix;
 import React from 'react';

package/components/slider/SliderInstance.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderInstance.js","names":["React","classnames","isTrue","AlignmentHelper","createSpacingClasses","createSkeletonClass","skeletonDOMAttributes","Context","Suffix","Button","FormLabel","FormStatus","SliderMainTrack","SliderTrackBefore","SliderTrackAfter","SliderThumb","useSliderProps","clamp","getFormattedNumber","SliderInstance","context","useContext","isReverse","isVertical","showButtons","showStatus","shouldAnimate","allProps","id","label","labelSrOnly","labelDirection","status","statusProps","statusState","statusNoAnimation","globalStatus","stretch","skeleton","disabled","className","mainParams","subtractButton","_SubtractButton","createElement","SubtractButton","addButton","_AddButton","AddButton","text","label_direction","sr_only","_AlignmentHelper","_extends","show","text_id","state","no_animation","_SliderMainTrack","_SliderSuffix","SliderSuffix","suffix","emitChange","value","attributes","step","min","max","subtractTitle","numberFormat","onSubtractClickHandler","event","subtractParams","humanNumber","variant","icon","size","replace","aria","String","on_click","addTitle","onAddClickHandler","addParams"],"sources":["../../../../src/components/slider/SliderInstance.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { isTrue } from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n  createSkeletonClass,\n  skeletonDOMAttributes,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport Button from '../button/Button'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\nimport {\n  SliderMainTrack,\n  SliderTrackBefore,\n  SliderTrackAfter,\n} from './SliderTrack'\nimport { SliderThumb } from './SliderThumb'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderInstance() {\n  const context = React.useContext(Context)\n\n  const {\n    isReverse,\n    isVertical,\n    showButtons,\n    showStatus,\n    shouldAnimate,\n    allProps,\n  } = useSliderProps()\n\n  const {\n    id,\n    label,\n    labelSrOnly,\n    labelDirection,\n    status,\n    statusProps,\n    statusState,\n    statusNoAnimation,\n    globalStatus,\n    stretch,\n    skeleton,\n    disabled,\n    className,\n  } = allProps\n\n  const mainParams = {\n    className: classnames(\n      'dnb-slider',\n      isVertical && 'dnb-slider--vertical',\n      disabled && 'dnb-slider__state--disabled',\n      shouldAnimate && 'dnb-slider__state--animate',\n      !showButtons && 'dnb-slider--no-buttons',\n      isTrue(stretch) && 'dnb-slider--stretch',\n      label && labelDirection && `dnb-slider__label--${labelDirection}`,\n      showStatus && 'dnb-slider__form-status',\n      status && `dnb-slider__status--${statusState}`,\n      'dnb-form-component',\n      createSkeletonClass(null, skeleton),\n      createSpacingClasses(allProps),\n      className\n    ),\n  }\n\n  const subtractButton = showButtons ? <SubtractButton /> : null\n  const addButton = showButtons ? <AddButton /> : null\n\n  skeletonDOMAttributes(mainParams, skeleton, context)\n\n  return (\n    <span {...mainParams}>\n      {label && (\n        // do not use \"for_id\" as the ID element is not a fo\n        <FormLabel\n          id={id + '-label'}\n          text={label}\n          disabled={disabled}\n          skeleton={skeleton}\n          label_direction={labelDirection}\n          sr_only={labelSrOnly}\n        />\n      )}\n\n      <span className=\"dnb-slider__wrapper\">\n        <AlignmentHelper />\n\n        <FormStatus\n          show={showStatus}\n          id={id + '-form-status'}\n          globalStatus={globalStatus}\n          text_id={id + '-status'} // used for \"aria-describedby\"\n          text={status}\n          state={statusState}\n          no_animation={statusNoAnimation}\n          skeleton={skeleton}\n          {...statusProps}\n        />\n\n        <span className=\"dnb-slider__inner\">\n          {showButtons && (isReverse ? addButton : subtractButton)}\n\n          <SliderMainTrack>\n            <SliderThumb />\n            <SliderTrackBefore />\n            <SliderTrackAfter />\n          </SliderMainTrack>\n\n          {showButtons && (isReverse ? subtractButton : addButton)}\n\n          <SliderSuffix />\n        </span>\n      </span>\n    </span>\n  )\n}\n\nfunction SliderSuffix() {\n  const { allProps } = useSliderProps()\n  const { id, suffix } = allProps\n\n  return suffix ? (\n    <Suffix\n      className=\"dnb-slider__suffix\"\n      id={id + '-suffix'} // used for \"aria-describedby\"\n      context={allProps}\n    >\n      {suffix}\n    </Suffix>\n  ) : null\n}\n\nfunction SubtractButton() {\n  const { emitChange, value, attributes, allProps } = useSliderProps()\n  const {\n    step,\n    min,\n    max,\n    disabled,\n    skeleton,\n    subtractTitle,\n    numberFormat,\n  } = allProps\n\n  const onSubtractClickHandler = (event: MouseEvent | TouchEvent) => {\n    emitChange(event, clamp((value as number) - (step || 1), min, max))\n  }\n\n  const subtractParams = {}\n\n  if (typeof attributes['aria-hidden'] !== 'undefined') {\n    subtractParams['aria-hidden'] = attributes['aria-hidden']\n  }\n\n  const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n  return (\n    <Button\n      className=\"dnb-slider__button dnb-slider__button--subtract\"\n      variant=\"secondary\"\n      icon=\"subtract\"\n      size=\"small\"\n      aria-label={subtractTitle?.replace(\n        '%s',\n        humanNumber.aria || String(value)\n      )}\n      on_click={onSubtractClickHandler}\n      disabled={disabled}\n      skeleton={skeleton}\n      {...subtractParams}\n    />\n  )\n}\n\nfunction AddButton() {\n  const { emitChange, value, attributes, allProps } = useSliderProps()\n  const { step, min, max, disabled, skeleton, addTitle, numberFormat } =\n    allProps\n\n  const onAddClickHandler = (event: MouseEvent | TouchEvent) => {\n    emitChange(event, clamp((value as number) + (step || 1), min, max))\n  }\n\n  const addParams = {}\n\n  if (typeof attributes['aria-hidden'] !== 'undefined') {\n    addParams['aria-hidden'] = attributes['aria-hidden']\n  }\n\n  const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n  return (\n    <Button\n      className=\"dnb-slider__button dnb-slider__button--add\"\n      variant=\"secondary\"\n      icon=\"add\"\n      size=\"small\"\n      aria-label={addTitle?.replace(\n        '%s',\n        humanNumber.aria || String(value)\n      )}\n      on_click={onAddClickHandler}\n      disabled={disabled}\n      skeleton={skeleton}\n      {...addParams}\n    />\n  )\n}\n"],"mappings":";;AAKA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,MAAM,QAAQ,+BAA+B;AACtD,OAAOC,eAAe,MAAM,8BAA8B;AAC1D,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SACEC,mBAAmB,EACnBC,qBAAqB,QAChB,4BAA4B;AAEnC,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,OAAOC,MAAM,MAAM,6BAA6B;AAChD,OAAOC,MAAM,MAAM,kBAAkB;AACrC,OAAOC,SAAS,MAAM,yBAAyB;AAC/C,OAAOC,UAAU,MAAM,2BAA2B;AAElD,SACEC,eAAe,EACfC,iBAAiB,EACjBC,gBAAgB,QACX,eAAe;AACtB,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,cAAc,QAAQ,wBAAwB;AACvD,SAASC,KAAK,EAAEC,kBAAkB,QAAQ,iBAAiB;AAE3D,OAAO,SAASC,cAAcA,CAAA,EAAG;EAC/B,MAAMC,OAAO,GAAGpB,KAAK,CAACqB,UAAU,CAACd,OAAO,CAAC;EAEzC,MAAM;IACJe,SAAS;IACTC,UAAU;IACVC,WAAW;IACXC,UAAU;IACVC,aAAa;IACbC;EACF,CAAC,GAAGX,cAAc,CAAC,CAAC;EAEpB,MAAM;IACJY,EAAE;IACFC,KAAK;IACLC,WAAW;IACXC,cAAc;IACdC,MAAM;IACNC,WAAW;IACXC,WAAW;IACXC,iBAAiB;IACjBC,YAAY;IACZC,OAAO;IACPC,QAAQ;IACRC,QAAQ;IACRC;EACF,CAAC,GAAGb,QAAQ;EAEZ,MAAMc,UAAU,GAAG;IACjBD,SAAS,EAAEvC,UAAU,kCAWnBI,mBAAmB,CAAC,IAAI,EAAEiC,QAAQ,CAAC,EACnClC,oBAAoB,CAACuB,QAAQ,CAAC,EAC9Ba,SAAS,EAXTjB,UAAU,IAAI,sBAAsB,EACpCgB,QAAQ,IAAI,6BAA6B,EACzCb,aAAa,IAAI,4BAA4B,EAC7C,CAACF,WAAW,IAAI,wBAAwB,EACxCtB,MAAM,CAACmC,OAAO,CAAC,IAAI,qBAAqB,EACxCR,KAAK,IAAIE,cAAc,IAAK,sBAAqBA,cAAe,EAAC,EACjEN,UAAU,IAAI,yBAAyB,EACvCO,MAAM,IAAK,uBAAsBE,WAAY,EAK/C;EACF,CAAC;EAED,MAAMQ,cAAc,GAAGlB,WAAW,GAAAmB,eAAA,KAAAA,eAAA,GAAG3C,KAAA,CAAA4C,aAAA,CAACC,cAAc,MAAE,CAAC,IAAG,IAAI;EAC9D,MAAMC,SAAS,GAAGtB,WAAW,GAAAuB,UAAA,KAAAA,UAAA,GAAG/C,KAAA,CAAA4C,aAAA,CAACI,SAAS,MAAE,CAAC,IAAG,IAAI;EAEpD1C,qBAAqB,CAACmC,UAAU,EAAEH,QAAQ,EAAElB,OAAO,CAAC;EAEpD,OACEpB,KAAA,CAAA4C,aAAA,SAAUH,UAAU,EACjBZ,KAAK,IAEJ7B,KAAA,CAAA4C,aAAA,CAAClC,SAAS;IACRkB,EAAE,EAAEA,EAAE,GAAG,QAAS;IAClBqB,IAAI,EAAEpB,KAAM;IACZU,QAAQ,EAAEA,QAAS;IACnBD,QAAQ,EAAEA,QAAS;IACnBY,eAAe,EAAEnB,cAAe;IAChCoB,OAAO,EAAErB;EAAY,CACtB,CACF,EAED9B,KAAA,CAAA4C,aAAA;IAAMJ,SAAS,EAAC;EAAqB,GAAAY,gBAAA,KAAAA,gBAAA,GACnCpD,KAAA,CAAA4C,aAAA,CAACzC,eAAe,MAAE,CAAC,GAEnBH,KAAA,CAAA4C,aAAA,CAACjC,UAAU,EAAA0C,QAAA;IACTC,IAAI,EAAE7B,UAAW;IACjBG,EAAE,EAAEA,EAAE,GAAG,cAAe;IACxBQ,YAAY,EAAEA,YAAa;IAC3BmB,OAAO,EAAE3B,EAAE,GAAG,SAAU;IACxBqB,IAAI,EAAEjB,MAAO;IACbwB,KAAK,EAAEtB,WAAY;IACnBuB,YAAY,EAAEtB,iBAAkB;IAChCG,QAAQ,EAAEA;EAAS,GACfL,WAAW,CAChB,CAAC,EAEFjC,KAAA,CAAA4C,aAAA;IAAMJ,SAAS,EAAC;EAAmB,GAChChB,WAAW,KAAKF,SAAS,GAAGwB,SAAS,GAAGJ,cAAc,CAAC,EAAAgB,gBAAA,KAAAA,gBAAA,GAExD1D,KAAA,CAAA4C,aAAA,CAAChC,eAAe,QACdZ,KAAA,CAAA4C,aAAA,CAAC7B,WAAW,MAAE,CAAC,EACff,KAAA,CAAA4C,aAAA,CAAC/B,iBAAiB,MAAE,CAAC,EACrBb,KAAA,CAAA4C,aAAA,CAAC9B,gBAAgB,MAAE,CACJ,CAAC,GAEjBU,WAAW,KAAKF,SAAS,GAAGoB,cAAc,GAAGI,SAAS,CAAC,EAAAa,aAAA,KAAAA,aAAA,GAExD3D,KAAA,CAAA4C,aAAA,CAACgB,YAAY,MAAE,CAAC,CACZ,CACF,CACF,CAAC;AAEX;AAEA,SAASA,YAAYA,CAAA,EAAG;EACtB,MAAM;IAAEjC;EAAS,CAAC,GAAGX,cAAc,CAAC,CAAC;EACrC,MAAM;IAAEY,EAAE;IAAEiC;EAAO,CAAC,GAAGlC,QAAQ;EAE/B,OAAOkC,MAAM,GACX7D,KAAA,CAAA4C,aAAA,CAACpC,MAAM;IACLgC,SAAS,EAAC,oBAAoB;IAC9BZ,EAAE,EAAEA,EAAE,GAAG,SAAU;IACnBR,OAAO,EAAEO;EAAS,GAEjBkC,MACK,CAAC,GACP,IAAI;AACV;AAEA,SAAShB,cAAcA,CAAA,EAAG;EACxB,MAAM;IAAEiB,UAAU;IAAEC,KAAK;IAAEC,UAAU;IAAErC;EAAS,CAAC,GAAGX,cAAc,CAAC,CAAC;EACpE,MAAM;IACJiD,IAAI;IACJC,GAAG;IACHC,GAAG;IACH5B,QAAQ;IACRD,QAAQ;IACR8B,aAAa;IACbC;EACF,CAAC,GAAG1C,QAAQ;EAEZ,MAAM2C,sBAAsB,GAAIC,KAA8B,IAAK;IACjET,UAAU,CAACS,KAAK,EAAEtD,KAAK,CAAE8C,KAAK,IAAeE,IAAI,IAAI,CAAC,CAAC,EAAEC,GAAG,EAAEC,GAAG,CAAC,CAAC;EACrE,CAAC;EAED,MAAMK,cAAc,GAAG,CAAC,CAAC;EAEzB,IAAI,OAAOR,UAAU,CAAC,aAAa,CAAC,KAAK,WAAW,EAAE;IACpDQ,cAAc,CAAC,aAAa,CAAC,GAAGR,UAAU,CAAC,aAAa,CAAC;EAC3D;EAEA,MAAMS,WAAW,GAAGvD,kBAAkB,CAAC6C,KAAK,EAAYM,YAAY,CAAC;EAErE,OACErE,KAAA,CAAA4C,aAAA,CAACnC,MAAM,EAAA4C,QAAA;IACLb,SAAS,EAAC,iDAAiD;IAC3DkC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,UAAU;IACfC,IAAI,EAAC,OAAO;IACZ,cAAYR,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAES,OAAO,CAChC,IAAI,EACJJ,WAAW,CAACK,IAAI,IAAIC,MAAM,CAAChB,KAAK,CAClC,CAAE;IACFiB,QAAQ,EAAEV,sBAAuB;IACjC/B,QAAQ,EAAEA,QAAS;IACnBD,QAAQ,EAAEA;EAAS,GACfkC,cAAc,CACnB,CAAC;AAEN;AAEA,SAASxB,SAASA,CAAA,EAAG;EACnB,MAAM;IAAEc,UAAU;IAAEC,KAAK;IAAEC,UAAU;IAAErC;EAAS,CAAC,GAAGX,cAAc,CAAC,CAAC;EACpE,MAAM;IAAEiD,IAAI;IAAEC,GAAG;IAAEC,GAAG;IAAE5B,QAAQ;IAAED,QAAQ;IAAE2C,QAAQ;IAAEZ;EAAa,CAAC,GAClE1C,QAAQ;EAEV,MAAMuD,iBAAiB,GAAIX,KAA8B,IAAK;IAC5DT,UAAU,CAACS,KAAK,EAAEtD,KAAK,CAAE8C,KAAK,IAAeE,IAAI,IAAI,CAAC,CAAC,EAAEC,GAAG,EAAEC,GAAG,CAAC,CAAC;EACrE,CAAC;EAED,MAAMgB,SAAS,GAAG,CAAC,CAAC;EAEpB,IAAI,OAAOnB,UAAU,CAAC,aAAa,CAAC,KAAK,WAAW,EAAE;IACpDmB,SAAS,CAAC,aAAa,CAAC,GAAGnB,UAAU,CAAC,aAAa,CAAC;EACtD;EAEA,MAAMS,WAAW,GAAGvD,kBAAkB,CAAC6C,KAAK,EAAYM,YAAY,CAAC;EAErE,OACErE,KAAA,CAAA4C,aAAA,CAACnC,MAAM,EAAA4C,QAAA;IACLb,SAAS,EAAC,4CAA4C;IACtDkC,OAAO,EAAC,WAAW;IACnBC,IAAI,EAAC,KAAK;IACVC,IAAI,EAAC,OAAO;IACZ,cAAYK,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEJ,OAAO,CAC3B,IAAI,EACJJ,WAAW,CAACK,IAAI,IAAIC,MAAM,CAAChB,KAAK,CAClC,CAAE;IACFiB,QAAQ,EAAEE,iBAAkB;IAC5B3C,QAAQ,EAAEA,QAAS;IACnBD,QAAQ,EAAEA;EAAS,GACf6C,SAAS,CACd,CAAC;AAEN"}
+{"version":3,"file":"SliderInstance.js","names":["React","classnames","isTrue","AlignmentHelper","createSpacingClasses","createSkeletonClass","skeletonDOMAttributes","Context","Suffix","Button","FormLabel","FormStatus","SliderMainTrack","SliderTrackBefore","SliderTrackAfter","SliderThumb","useSliderProps","clamp","getFormattedNumber","SliderInstance","context","useContext","isReverse","isVertical","showButtons","showStatus","shouldAnimate","allProps","id","label","labelSrOnly","labelDirection","status","statusProps","statusState","statusNoAnimation","globalStatus","stretch","skeleton","disabled","className","mainParams","subtractButton","_SubtractButton","createElement","SubtractButton","addButton","_AddButton","AddButton","text","label_direction","sr_only","_AlignmentHelper","_extends","show","text_id","state","no_animation","_SliderMainTrack","_SliderSuffix","SliderSuffix","suffix","emitChange","value","attributes","step","min","max","subtractTitle","numberFormat","onSubtractClickHandler","event","subtractParams","humanNumber","variant","icon","size","replace","aria","String","on_click","addTitle","onAddClickHandler","addParams"],"sources":["../../../../src/components/slider/SliderInstance.tsx"],"sourcesContent":["/**\n * Web Slider Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { isTrue } from '../../shared/component-helper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n  createSkeletonClass,\n  skeletonDOMAttributes,\n} from '../skeleton/SkeletonHelper'\n\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport Button from '../button/Button'\nimport FormLabel from '../form-label/FormLabel'\nimport FormStatus from '../form-status/FormStatus'\n\nimport {\n  SliderMainTrack,\n  SliderTrackBefore,\n  SliderTrackAfter,\n} from './SliderTrack'\nimport { SliderThumb } from './SliderThumb'\nimport { useSliderProps } from './hooks/useSliderProps'\nimport { clamp, getFormattedNumber } from './SliderHelpers'\n\nexport function SliderInstance() {\n  const context = React.useContext(Context)\n\n  const {\n    isReverse,\n    isVertical,\n    showButtons,\n    showStatus,\n    shouldAnimate,\n    allProps,\n  } = useSliderProps()\n\n  const {\n    id,\n    label,\n    labelSrOnly,\n    labelDirection,\n    status,\n    statusProps,\n    statusState,\n    statusNoAnimation,\n    globalStatus,\n    stretch,\n    skeleton,\n    disabled,\n    className,\n  } = allProps\n\n  const mainParams = {\n    className: classnames(\n      'dnb-slider',\n      isVertical && 'dnb-slider--vertical',\n      disabled && 'dnb-slider__state--disabled',\n      shouldAnimate && 'dnb-slider__state--animate',\n      !showButtons && 'dnb-slider--no-buttons',\n      isTrue(stretch) && 'dnb-slider--stretch',\n      label && labelDirection && `dnb-slider__label--${labelDirection}`,\n      showStatus && 'dnb-slider__form-status',\n      status && `dnb-slider__status--${statusState}`,\n      'dnb-form-component',\n      createSkeletonClass(null, skeleton),\n      createSpacingClasses(allProps),\n      className\n    ),\n  }\n\n  const subtractButton = showButtons ? <SubtractButton /> : null\n  const addButton = showButtons ? <AddButton /> : null\n\n  skeletonDOMAttributes(mainParams, skeleton, context)\n\n  return (\n    <span {...mainParams}>\n      {label && (\n        // do not use \"for_id\" as the ID element is not a fo\n        <FormLabel\n          id={id + '-label'}\n          text={label}\n          disabled={disabled}\n          skeleton={skeleton}\n          label_direction={labelDirection}\n          sr_only={labelSrOnly}\n        />\n      )}\n\n      <span className=\"dnb-slider__wrapper\">\n        <AlignmentHelper />\n\n        <FormStatus\n          show={showStatus}\n          id={id + '-form-status'}\n          globalStatus={globalStatus}\n          text_id={id + '-status'} // used for \"aria-describedby\"\n          text={status}\n          state={statusState}\n          no_animation={statusNoAnimation}\n          skeleton={skeleton}\n          {...statusProps}\n        />\n\n        <span className=\"dnb-slider__inner\">\n          {showButtons && (isReverse ? addButton : subtractButton)}\n\n          <SliderMainTrack>\n            <SliderThumb />\n            <SliderTrackBefore />\n            <SliderTrackAfter />\n          </SliderMainTrack>\n\n          {showButtons && (isReverse ? subtractButton : addButton)}\n\n          <SliderSuffix />\n        </span>\n      </span>\n    </span>\n  )\n}\n\nfunction SliderSuffix() {\n  const { allProps } = useSliderProps()\n  const { id, suffix } = allProps\n\n  return suffix ? (\n    <Suffix\n      className=\"dnb-slider__suffix\"\n      id={id + '-suffix'} // used for \"aria-describedby\"\n      context={allProps}\n    >\n      {suffix}\n    </Suffix>\n  ) : null\n}\n\nfunction SubtractButton() {\n  const { emitChange, value, attributes, allProps } = useSliderProps()\n  const {\n    step,\n    min,\n    max,\n    disabled,\n    skeleton,\n    subtractTitle,\n    numberFormat,\n  } = allProps\n\n  const onSubtractClickHandler = (event: MouseEvent | TouchEvent) => {\n    emitChange(event, clamp((value as number) - (step || 1), min, max))\n  }\n\n  const subtractParams = {}\n\n  if (typeof attributes['aria-hidden'] !== 'undefined') {\n    subtractParams['aria-hidden'] = attributes['aria-hidden']\n  }\n\n  const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n  return (\n    <Button\n      className=\"dnb-slider__button dnb-slider__button--subtract\"\n      variant=\"secondary\"\n      icon=\"subtract\"\n      size=\"small\"\n      aria-label={subtractTitle?.replace(\n        '%s',\n        humanNumber.aria || String(value)\n      )}\n      on_click={onSubtractClickHandler}\n      disabled={disabled}\n      skeleton={skeleton}\n      {...subtractParams}\n    />\n  )\n}\n\nfunction AddButton() {\n  const { emitChange, value, attributes, allProps } = useSliderProps()\n  const { step, min, max, disabled, skeleton, addTitle, numberFormat } =\n    allProps\n\n  const onAddClickHandler = (event: MouseEvent | TouchEvent) => {\n    emitChange(event, clamp((value as number) + (step || 1), min, max))\n  }\n\n  const addParams = {}\n\n  if (typeof attributes['aria-hidden'] !== 'undefined') {\n    addParams['aria-hidden'] = attributes['aria-hidden']\n  }\n\n  const humanNumber = getFormattedNumber(value as number, numberFormat)\n\n  return (\n    <Button\n      className=\"dnb-slider__button dnb-slider__button--add\"\n      variant=\"secondary\"\n      icon=\"add\"\n      size=\"small\"\n      aria-label={addTitle?.replace(\n        '%s',\n        humanNumber.aria || String(value)\n      )}\n      on_click={onAddClickHandler}\n      disabled={disabled}\n      skeleton={skeleton}\n      {...addParams}\n    />\n  )\n}\n"],"mappings":"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"}

package/components/slider/SliderProvider.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["step", "label", "labelDirection", "labelSrOnly", "status", "statusState", "statusProps", "statusNoAnimation", "globalStatus", "stretch", "suffix", "thumbTitle", "subtractTitle", "addTitle", "hideButtons", "multiThumbBehavior", "numberFormat", "tooltip", "alwaysShowTooltip", "skeleton", "max", "min", "disabled", "className", "id", "onChange", "onDragStart", "onDragEnd", "vertical", "reverse", "value", "children"];
 import React from 'react';