@pega/cosmos-react-core 3.0.0-dev.9.0 → 3.0.0-rc.2

package/lib/components/Number/NumberInput.types.d.ts

@@ -1,7 +1,7 @@
 import { Ref } from 'react';
 import { FormControlProps } from '../FormControl';
 import { BaseProps, NoChildrenProp } from '../../types';
-export default interface NumberInputProps extends BaseProps, NoChildrenProp {
+export interface NumberProps extends BaseProps, NoChildrenProp {
     /**
      * Sets DOM id for the control and associates label element via 'for' attribute.
      * If an id is not pass, a random id will be generated for any render.
@@ -28,27 +28,15 @@ export default interface NumberInputProps extends BaseProps, NoChildrenProp {
     readOnly?: FormControlProps['readOnly'];
     /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */
     name?: FormControlProps['name'];
-    /**
-     * CurrencyInput input value.
-     * Requires an onChange handler to update value.
-     */
-    value?: string;
-    /** Callback fired when input value changes. */
-    onChange: (value: string) => void;
-    /** Callback fired when the component gets focus. */
-    onFocus?: (value: string) => void;
-    /** Callback fired when the component loses focus. */
-    onBlur?: (value: string) => void;
+    /** Button when clicked will show additional information */
+    additionalInfo?: FormControlProps['additionalInfo'];
     /** Defines unit of the number, like 'kg', 'miles' or '%'. */
     unit?: string;
     /**
-     * Determines the placement of the unit.
-     * @default "after"
-     */
-    unitPlacement?: 'before' | 'after';
-    /** Determines whether decimal places should be shown. The value is rounded if true.
-     * @default true
-     */
+    *
+   /** Determines whether decimal places should be shown. The value is rounded if true.
+    * @default true
+    */
     showDecimal?: boolean;
     /** Determines the maximum number of decimal places. The value is rounded to the number of places.
      * @default variable NUMBER_MAX_DECIMAL_PLACES. Recommended minimum: 1.
@@ -78,10 +66,57 @@ export default interface NumberInputProps extends BaseProps, NoChildrenProp {
      * @default 'default'
      */
     variant?: 'default' | 'stepper';
-    /** Ref for the wrapping element. */
-    ref?: Ref<HTMLInputElement>;
     /** Optional manual override for generated aria label */
     'aria-label'?: string;
+    /** Automatically focuses the input on render. */
+    autoFocus?: boolean;
+}
+export interface NumberInputProps extends NumberProps {
+    /**
+     * CurrencyInput input value.
+     * Requires an onChange handler to update value.
+     */
+    value?: string;
+    /** Callback fired when input value changes. */
+    onChange: (value: string) => void;
+    /** Callback fired when the component gets focus. */
+    onFocus?: (value: string) => void;
+    /** Callback fired when the component loses focus. */
+    onBlur?: (value: string) => void;
+    /** Callback fired when AI suggestion is accepted/rejected */
+    onResolveSuggestion?: FormControlProps['onResolveSuggestion'];
+    /** Ref for the wrapping element. */
+    ref?: Ref<HTMLInputElement>;
+}
+export interface NumberRangeInputProps extends NumberProps {
+    /** Range as a tuple of start and end. */
+    value?: {
+        start?: string;
+        end?: string;
+    };
+    /** Callback for any modifications to the range */
+    onChange: (value: {
+        start: string;
+        end: string;
+    }) => void;
+    /** Callback fired when the component loses focus. */
+    onBlur?: (value: {
+        start: string;
+        end: string;
+    }) => void;
+    /** Callback fired when the component gets focus. */
+    onFocus?: (value: {
+        start: string;
+        end: string;
+    }) => void;
+    /** Pass a string or a fragment with an Icon and string for first part of NumberRangeInput. */
+    fromLabel?: FormControlProps['label'];
+    /** Pass a string or a fragment with an Icon and string for second part of NumberRangeInput. */
+    toLabel?: FormControlProps['label'];
+    /** Pass an object with "heading" and "content" properties to show AdditionalInfo for first part of NumberRangeInput. */
+    fromAdditionalInfo?: FormControlProps['additionalInfo'];
+    /** Pass an object with "heading" and "content" properties to show AdditionalInfo for second part of NumberRangeInput. */
+    toAdditionalInfo?: FormControlProps['additionalInfo'];
 }
 /** Maximum fraction digits is 20. */
 export declare const NUMBER_MAX_DECIMAL_PLACES = 20;

package/lib/components/Number/NumberInput.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.types.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAExD,MAAM,CAAC,OAAO,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc;IACzE;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,yFAAyF;IACzF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,qCAAqC;AACrC,eAAO,MAAM,yBAAyB,KAAK,CAAC"}
+{"version":3,"file":"NumberInput.types.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAExD,MAAM,WAAW,WAAY,SAAQ,SAAS,EAAE,cAAc;IAC5D;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,iEAAiE;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,yFAAyF;IACzF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,2DAA2D;IAC3D,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;MAIE;IACF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,wDAAwD;IACxD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iDAAiD;IACjD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACnD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,6DAA6D;IAC7D,mBAAmB,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAC9D,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,MAAM,WAAW,qBAAsB,SAAQ,WAAW;IACxD,yCAAyC;IACzC,KAAK,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,kDAAkD;IAClD,QAAQ,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1D,qDAAqD;IACrD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACzD,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1D,8FAA8F;IAC9F,SAAS,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACtC,+FAA+F;IAC/F,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACpC,wHAAwH;IACxH,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACxD,yHAAyH;IACzH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;CACvD;AAED,qCAAqC;AACrC,eAAO,MAAM,yBAAyB,KAAK,CAAC"}

package/lib/components/Number/NumberInput.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.types.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.types.ts"],"names":[],"mappings":"AAwFA,qCAAqC;AACrC,MAAM,CAAC,MAAM,yBAAyB,GAAG,EAAE,CAAC","sourcesContent":["import { Ref } from 'react';\n\nimport { FormControlProps } from '../FormControl';\nimport { BaseProps, NoChildrenProp } from '../../types';\n\nexport default interface NumberInputProps extends BaseProps, NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /**\n   * Visually hides the label region.\n   * @default false\n   */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Placeholder text. The browser defaults to an empty string. */\n  placeholder?: string;\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the component non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /**\n   * CurrencyInput input value.\n   * Requires an onChange handler to update value.\n   */\n  value?: string;\n  /** Callback fired when input value changes. */\n  onChange: (value: string) => void;\n  /** Callback fired when the component gets focus. */\n  onFocus?: (value: string) => void;\n  /** Callback fired when the component loses focus. */\n  onBlur?: (value: string) => void;\n  /** Defines unit of the number, like 'kg', 'miles' or '%'. */\n  unit?: string;\n  /**\n   * Determines the placement of the unit.\n   * @default \"after\"\n   */\n  unitPlacement?: 'before' | 'after';\n  /** Determines whether decimal places should be shown. The value is rounded if true.\n   * @default true\n   */\n  showDecimal?: boolean;\n  /** Determines the maximum number of decimal places. The value is rounded to the number of places.\n   * @default variable NUMBER_MAX_DECIMAL_PLACES. Recommended minimum: 1.\n   */\n  numberOfDecimals?: number;\n  /** Determines whether group separators should be shown.\n   * @default true\n   */\n  showGroupSeparators?: boolean;\n  /** The minimum value to accept for this input.\n   *  This value must be less than or equal to the value of the max attribute.\n   *  @default Number.MIN_SAFE_INTEGER\n   */\n  min?: number;\n  /**\n   * The maximum value to accept for this input.\n   *  This value must be greater than or equal to the value of the min attribute.\n   *  @default Number.MAX_SAFE_INTEGER\n   */\n  max?: number;\n  /** A stepping interval to use when using up and down arrows to adjust the value.\n   * @default 1\n   */\n  step?: number;\n  /**\n   * Component variation. Might be rendered as regular input or stepper.\n   * @default 'default'\n   */\n  variant?: 'default' | 'stepper';\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLInputElement>;\n  /** Optional manual override for generated aria label */\n  'aria-label'?: string;\n}\n\n/** Maximum fraction digits is 20. */\nexport const NUMBER_MAX_DECIMAL_PLACES = 20;\n"]}
+{"version":3,"file":"NumberInput.types.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.types.ts"],"names":[],"mappings":"AAiHA,qCAAqC;AACrC,MAAM,CAAC,MAAM,yBAAyB,GAAG,EAAE,CAAC","sourcesContent":["import { Ref } from 'react';\n\nimport { FormControlProps } from '../FormControl';\nimport { BaseProps, NoChildrenProp } from '../../types';\n\nexport interface NumberProps extends BaseProps, NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /**\n   * Visually hides the label region.\n   * @default false\n   */\n  labelHidden?: FormControlProps['labelHidden'];\n  /** It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. */\n  info?: FormControlProps['info'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Placeholder text. The browser defaults to an empty string. */\n  placeholder?: string;\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the component non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Button when clicked will show additional information */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** Defines unit of the number, like 'kg', 'miles' or '%'. */\n  unit?: string;\n  /**\n  *\n /** Determines whether decimal places should be shown. The value is rounded if true.\n  * @default true\n  */\n  showDecimal?: boolean;\n  /** Determines the maximum number of decimal places. The value is rounded to the number of places.\n   * @default variable NUMBER_MAX_DECIMAL_PLACES. Recommended minimum: 1.\n   */\n  numberOfDecimals?: number;\n  /** Determines whether group separators should be shown.\n   * @default true\n   */\n  showGroupSeparators?: boolean;\n  /** The minimum value to accept for this input.\n   *  This value must be less than or equal to the value of the max attribute.\n   *  @default Number.MIN_SAFE_INTEGER\n   */\n  min?: number;\n  /**\n   * The maximum value to accept for this input.\n   *  This value must be greater than or equal to the value of the min attribute.\n   *  @default Number.MAX_SAFE_INTEGER\n   */\n  max?: number;\n  /** A stepping interval to use when using up and down arrows to adjust the value.\n   * @default 1\n   */\n  step?: number;\n  /**\n   * Component variation. Might be rendered as regular input or stepper.\n   * @default 'default'\n   */\n  variant?: 'default' | 'stepper';\n  /** Optional manual override for generated aria label */\n  'aria-label'?: string;\n  /** Automatically focuses the input on render. */\n  autoFocus?: boolean;\n}\n\nexport interface NumberInputProps extends NumberProps {\n  /**\n   * CurrencyInput input value.\n   * Requires an onChange handler to update value.\n   */\n  value?: string;\n  /** Callback fired when input value changes. */\n  onChange: (value: string) => void;\n  /** Callback fired when the component gets focus. */\n  onFocus?: (value: string) => void;\n  /** Callback fired when the component loses focus. */\n  onBlur?: (value: string) => void;\n  /** Callback fired when AI suggestion is accepted/rejected */\n  onResolveSuggestion?: FormControlProps['onResolveSuggestion'];\n  /** Ref for the wrapping element. */\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport interface NumberRangeInputProps extends NumberProps {\n  /** Range as a tuple of start and end. */\n  value?: { start?: string; end?: string };\n  /** Callback for any modifications to the range */\n  onChange: (value: { start: string; end: string }) => void;\n  /** Callback fired when the component loses focus. */\n  onBlur?: (value: { start: string; end: string }) => void;\n  /** Callback fired when the component gets focus. */\n  onFocus?: (value: { start: string; end: string }) => void;\n  /** Pass a string or a fragment with an Icon and string for first part of NumberRangeInput. */\n  fromLabel?: FormControlProps['label'];\n  /** Pass a string or a fragment with an Icon and string for second part of NumberRangeInput. */\n  toLabel?: FormControlProps['label'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for first part of NumberRangeInput. */\n  fromAdditionalInfo?: FormControlProps['additionalInfo'];\n  /** Pass an object with \"heading\" and \"content\" properties to show AdditionalInfo for second part of NumberRangeInput. */\n  toAdditionalInfo?: FormControlProps['additionalInfo'];\n}\n\n/** Maximum fraction digits is 20. */\nexport const NUMBER_MAX_DECIMAL_PLACES = 20;\n"]}

package/lib/components/Number/NumberRangeInput.d.ts

@@ -0,0 +1,6 @@
+import { FunctionComponent } from 'react';
+import type { ForwardProps } from '../../types';
+import type { NumberRangeInputProps } from './NumberInput.types';
+declare const NumberRangeInput: FunctionComponent<NumberRangeInputProps & ForwardProps>;
+export default NumberRangeInput;
+//# sourceMappingURL=NumberRangeInput.d.ts.map

package/lib/components/Number/NumberRangeInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAoB,MAAM,OAAO,CAAC;AAExE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAOhD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEjE,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CA0F7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/Number/NumberRangeInput.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useCallback } from 'react';
+import { useConsolidatedRef, useI18n, useFocusWithin } from '../../hooks';
+import { StyledRangeInputContainer } from '../Input/Input.styles';
+import FormField from '../FormField';
+import Flex from '../Flex';
+import NumberInput from './NumberInput';
+const NumberRangeInput = forwardRef(({ value = {}, onChange, onBlur, onFocus, label, fromLabel, toLabel, labelHidden, placeholder, disabled, readOnly, required, unit, showDecimal, numberOfDecimals, showGroupSeparators, min, max, step, variant, fromAdditionalInfo, toAdditionalInfo, autoFocus, ...restProps }, ref) => {
+    const t = useI18n();
+    const onFocusChange = useCallback((focused) => {
+        (focused ? onFocus : onBlur)?.({ start: value.start ?? '', end: value.end ?? '' });
+    }, [onBlur, value.start, value.end]);
+    const containerRef = useConsolidatedRef(ref);
+    useFocusWithin([containerRef], onFocusChange);
+    const commonProps = {
+        placeholder,
+        readOnly,
+        required,
+        unit,
+        showDecimal,
+        numberOfDecimals,
+        showGroupSeparators,
+        min,
+        max,
+        variant
+    };
+    return (_jsx(FormField, { as: 'fieldset', ...restProps, ref: containerRef, container: { wrap: 'nowrap' }, labelHidden: labelHidden, labelAs: 'legend', label: label, disabled: disabled, required: required, readOnly: readOnly, children: _jsxs(Flex, { container: true, as: StyledRangeInputContainer, children: [_jsx(NumberInput, { ...commonProps, value: value.start, onChange: fromValue => onChange({ start: fromValue, end: value.end ?? '' }), label: fromLabel, "aria-label": `${t('range_from_numeric') + (label ? ` - ${label}` : '')}`, additionalInfo: fromAdditionalInfo, autoFocus: autoFocus }), _jsx(NumberInput, { ...commonProps, value: value.end, onChange: toValue => onChange({ start: value.start ?? '', end: toValue }), label: toLabel, "aria-label": `${t('range_to_numeric') + (label ? ` - ${label}` : '')}`, additionalInfo: toAdditionalInfo })] }) }));
+});
+export default NumberRangeInput;
+//# sourceMappingURL=NumberRangeInput.js.map

package/lib/components/Number/NumberRangeInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberRangeInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberRangeInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA0B,WAAW,EAAE,MAAM,OAAO,CAAC;AAGxE,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC1E,OAAO,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,WAAW,MAAM,eAAe,CAAC;AAGxC,MAAM,gBAAgB,GAA4D,UAAU,CAC1F,CACE,EACE,KAAK,GAAG,EAAE,EACV,QAAQ,EACR,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,EACP,WAAW,EACX,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,gBAAgB,EAChB,mBAAmB,EACnB,GAAG,EACH,GAAG,EACH,IAAI,EACJ,OAAO,EACP,kBAAkB,EAClB,gBAAgB,EAChB,SAAS,EACT,GAAG,SAAS,EACU,EACxB,GAAwB,EACxB,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,OAAgB,EAAE,EAAE;QACnB,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,CAAC;IACrF,CAAC,EACD,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,CACjC,CAAC;IAEF,MAAM,YAAY,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC7C,cAAc,CAAC,CAAC,YAAY,CAAC,EAAE,aAAa,CAAC,CAAC;IAE9C,MAAM,WAAW,GAAG;QAClB,WAAW;QACX,QAAQ;QACR,QAAQ;QACR,IAAI;QACJ,WAAW;QACX,gBAAgB;QAChB,mBAAmB;QACnB,GAAG;QACH,GAAG;QACH,OAAO;KACR,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,IACR,EAAE,EAAC,UAAU,KACT,SAAS,EACb,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAC7B,WAAW,EAAE,WAAW,EACxB,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,YAElB,MAAC,IAAI,IAAC,SAAS,QAAC,EAAE,EAAE,yBAAyB,aAC3C,KAAC,WAAW,OACN,WAAW,EACf,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,QAAQ,EAAE,SAAS,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,EAC3E,KAAK,EAAE,SAAS,gBACJ,GAAG,CAAC,CAAC,oBAAoB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EACvE,cAAc,EAAE,kBAAkB,EAClC,SAAS,EAAE,SAAS,GACpB,EACF,KAAC,WAAW,OACN,WAAW,EACf,KAAK,EAAE,KAAK,CAAC,GAAG,EAChB,QAAQ,EAAE,OAAO,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,EACzE,KAAK,EAAE,OAAO,gBACF,GAAG,CAAC,CAAC,kBAAkB,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EACrE,cAAc,EAAE,gBAAgB,GAChC,IACG,GACG,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, useCallback } from 'react';\n\nimport type { ForwardProps } from '../../types';\nimport { useConsolidatedRef, useI18n, useFocusWithin } from '../../hooks';\nimport { StyledRangeInputContainer } from '../Input/Input.styles';\nimport FormField from '../FormField';\nimport Flex from '../Flex';\n\nimport NumberInput from './NumberInput';\nimport type { NumberRangeInputProps } from './NumberInput.types';\n\nconst NumberRangeInput: FunctionComponent<NumberRangeInputProps & ForwardProps> = forwardRef(\n  (\n    {\n      value = {},\n      onChange,\n      onBlur,\n      onFocus,\n      label,\n      fromLabel,\n      toLabel,\n      labelHidden,\n      placeholder,\n      disabled,\n      readOnly,\n      required,\n      unit,\n      showDecimal,\n      numberOfDecimals,\n      showGroupSeparators,\n      min,\n      max,\n      step,\n      variant,\n      fromAdditionalInfo,\n      toAdditionalInfo,\n      autoFocus,\n      ...restProps\n    }: NumberRangeInputProps,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    const t = useI18n();\n\n    const onFocusChange = useCallback(\n      (focused: boolean) => {\n        (focused ? onFocus : onBlur)?.({ start: value.start ?? '', end: value.end ?? '' });\n      },\n      [onBlur, value.start, value.end]\n    );\n\n    const containerRef = useConsolidatedRef(ref);\n    useFocusWithin([containerRef], onFocusChange);\n\n    const commonProps = {\n      placeholder,\n      readOnly,\n      required,\n      unit,\n      showDecimal,\n      numberOfDecimals,\n      showGroupSeparators,\n      min,\n      max,\n      variant\n    };\n\n    return (\n      <FormField\n        as='fieldset'\n        {...restProps}\n        ref={containerRef}\n        container={{ wrap: 'nowrap' }}\n        labelHidden={labelHidden}\n        labelAs='legend'\n        label={label}\n        disabled={disabled}\n        required={required}\n        readOnly={readOnly}\n      >\n        <Flex container as={StyledRangeInputContainer}>\n          <NumberInput\n            {...commonProps}\n            value={value.start}\n            onChange={fromValue => onChange({ start: fromValue, end: value.end ?? '' })}\n            label={fromLabel}\n            aria-label={`${t('range_from_numeric') + (label ? ` - ${label}` : '')}`}\n            additionalInfo={fromAdditionalInfo}\n            autoFocus={autoFocus}\n          />\n          <NumberInput\n            {...commonProps}\n            value={value.end}\n            onChange={toValue => onChange({ start: value.start ?? '', end: toValue })}\n            label={toLabel}\n            aria-label={`${t('range_to_numeric') + (label ? ` - ${label}` : '')}`}\n            additionalInfo={toAdditionalInfo}\n          />\n        </Flex>\n      </FormField>\n    );\n  }\n);\n\nexport default NumberRangeInput;\n"]}

package/lib/components/Number/index.d.ts

@@ -1,6 +1,7 @@
 export { default as NumberInput } from './NumberInput';
-export { default as NumberInputProps } from './NumberInput.types';
+export type { NumberInputProps, NumberRangeInputProps } from './NumberInput.types';
 export { default as NumberDisplay } from './NumberDisplay';
-export { NumberDisplayProps } from './NumberDisplay';
+export type { NumberDisplayProps } from './NumberDisplay';
 export { formatNumber } from './utils';
+export { default as NumberRangeInput } from './NumberRangeInput';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Number/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,YAAY,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC"}

package/lib/components/Number/index.js

@@ -1,4 +1,5 @@
 export { default as NumberInput } from './NumberInput';
 export { default as NumberDisplay } from './NumberDisplay';
 export { formatNumber } from './utils';
+export { default as NumberRangeInput } from './NumberRangeInput';
 //# sourceMappingURL=index.js.map

package/lib/components/Number/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC","sourcesContent":["export { default as NumberInput } from './NumberInput';\nexport { default as NumberInputProps } from './NumberInput.types';\nexport { default as NumberDisplay } from './NumberDisplay';\nexport { NumberDisplayProps } from './NumberDisplay';\nexport { formatNumber } from './utils';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Number/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AAEvD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC","sourcesContent":["export { default as NumberInput } from './NumberInput';\nexport type { NumberInputProps, NumberRangeInputProps } from './NumberInput.types';\nexport { default as NumberDisplay } from './NumberDisplay';\nexport type { NumberDisplayProps } from './NumberDisplay';\nexport { formatNumber } from './utils';\nexport { default as NumberRangeInput } from './NumberRangeInput';\n"]}

package/lib/components/Number/utils.d.ts

@@ -1,9 +1,8 @@
-export declare function getInteger(value: string): string;
-export declare function getDecimal(locale: string, options?: Intl.NumberFormatOptions): string;
+export declare function getDecimalSign(locale: string, options?: Intl.NumberFormatOptions): string;
 export declare function getFraction(value: string): string;
 export declare function getCleanedValue(value: string, decimalSign: string, maximumFractionDigits: number): string;
-export declare function getFormattedValue(value: string, locale: string, showGroupSeparators: boolean, maximumFractionDigits?: number): string;
-export declare function isValueInRange(value: number, min: number | undefined, max: number | undefined): boolean;
+export declare const getFormattedValue: (value: string, locale: string, unit?: string, { notation, useGrouping, maximumFractionDigits, minimumFractionDigits }?: Pick<Intl.NumberFormatOptions, 'notation' | 'useGrouping' | 'maximumFractionDigits' | 'minimumFractionDigits'>) => string;
+export declare function isValueInRange(value: number, min?: number, max?: number): boolean;
 export declare function getIncrementedValue(value: string, min: number, max: number, step: number): string;
 export declare function getDecrementedValue(value: string, min: number, max: number, step: number): string;
 interface NumberFormatOptions {

package/lib/components/Number/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"AAEA,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAIhD;AAED,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,UAM5E;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,UAIxC;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,MAAM,EACnB,qBAAqB,EAAE,MAAM,GAC5B,MAAM,CAUR;AAED,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,mBAAmB,EAAE,OAAO,EAC5B,qBAAqB,GAAE,MAAU,GAChC,MAAM,CAcR;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,GAAG,SAAS,EACvB,GAAG,EAAE,MAAM,GAAG,SAAS,GACtB,OAAO,CAET;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;CACpC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,mBAAmB,UAI5F"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"AAEA,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,GAAG,MAAM,CAMzF;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,UAIxC;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,MAAM,EACnB,qBAAqB,EAAE,MAAM,GAC5B,MAAM,CAQR;AAYD,eAAO,MAAM,iBAAiB,UACrB,MAAM,UACL,MAAM,SACP,MAAM,4EAMV,KACD,wBAAwB,EACxB,UAAU,GAAG,aAAa,GAAG,uBAAuB,GAAG,uBAAuB,CAC/E,WAqCF,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,GAAG,OAAO,CAEjF;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;CACpC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,mBAAmB,UAI5F"}

package/lib/components/Number/utils.js

@@ -1,10 +1,5 @@
 import BigNumber from 'bignumber.js';
-export function getInteger(value) {
-    const decPos = value.indexOf('.');
-    const substrLength = decPos === -1 ? value.length : decPos;
-    return value.substring(0, substrLength);
-}
-export function getDecimal(locale, options) {
+export function getDecimalSign(locale, options) {
     return (new Intl.NumberFormat(locale, options)
         .formatToParts(0.1)
         .filter((part) => part.type === 'decimal')[0]?.value || '');
@@ -18,29 +13,54 @@ export function getCleanedValue(value, decimalSign, maximumFractionDigits) {
     let rawValue = value.replace(new RegExp(`[^${decimalSign}\\d-]+`, 'gu'), '');
     if (decimalSign && decimalSign !== '.')
         rawValue = rawValue.replace(decimalSign, '.');
-    if (rawValue.startsWith('.'))
-        rawValue = `0${value}`;
-    if (rawValue.startsWith('-.'))
-        rawValue = `-0${value.substring(1)}`;
     const match = rawValue.match(new RegExp(`-?\\d*(\\.\\d{0,${maximumFractionDigits}})?`));
     if (match && match.length > 0) {
         rawValue = match[0];
     }
     return rawValue;
 }
-export function getFormattedValue(value, locale, showGroupSeparators, maximumFractionDigits = 0) {
-    let valueNumber;
-    const integer = getInteger(value);
-    const decimal = getDecimal(locale);
-    const fractionPart = getFraction(value).replace('.', decimal);
+const isValidUnit = (unit) => {
+    try {
+        // eslint-disable-next-line no-new
+        new Intl.NumberFormat(undefined, { style: 'unit', unit });
+        return true;
+    }
+    catch {
+        return false;
+    }
+};
+export const getFormattedValue = (value, locale, unit, { notation = 'standard', useGrouping = false, maximumFractionDigits, minimumFractionDigits } = {}) => {
+    const isUnit = unit ? isValidUnit(unit) : false;
+    const [integer, fractionPart] = value.split('.', 2);
+    const formatter = new Intl.NumberFormat(locale, {
+        notation,
+        useGrouping,
+        minimumFractionDigits: minimumFractionDigits ?? Math.min(maximumFractionDigits ?? 0, fractionPart?.length ?? 0),
+        maximumFractionDigits,
+        style: isUnit ? 'unit' : undefined,
+        unit: isUnit ? unit : undefined
+    });
+    let formatted = value;
     if (value && !Number.isNaN(parseFloat(integer))) {
-        valueNumber = BigInt(integer);
-        return (new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })
-            .format(valueNumber)
-            .trim() + (maximumFractionDigits ? fractionPart : ''));
+        const endsWithDot = fractionPart === '';
+        const valueNumber = Number(endsWithDot ? `${value}1` : value);
+        formatted =
+            formatter.formatToParts(valueNumber).reduce((result, { type, value: part }) => {
+                if (type === 'fraction' && endsWithDot)
+                    return result;
+                return result + part;
+            }, '') + (!isUnit && unit ? `\u00a0${unit}` : '');
     }
-    return value;
-}
+    else if (unit) {
+        if (isUnit)
+            formatted = formatter
+                .formatToParts(value.startsWith('-') ? -1 : 1)
+                .reduce((result, { type, value: part }) => ['unit', 'minusSign'].includes(type) ? result + part : result, '');
+        else
+            formatted = value.startsWith('-') ? `- ${unit}` : unit;
+    }
+    return formatted;
+};
 export function isValueInRange(value, min, max) {
     return !((min !== undefined && value < min) || (max !== undefined && value > max));
 }

package/lib/components/Number/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import BigNumber from 'bignumber.js';\n\nexport function getInteger(value: string): string {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(0, substrLength);\n}\n\nexport function getDecimal(locale: string, options?: Intl.NumberFormatOptions) {\n  return (\n    new Intl.NumberFormat(locale, options)\n      .formatToParts(0.1)\n      .filter((part: { type: string; value: string }) => part.type === 'decimal')[0]?.value || ''\n  );\n}\n\nexport function getFraction(value: string) {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(substrLength);\n}\n\nexport function getCleanedValue(\n  value: string,\n  decimalSign: string,\n  maximumFractionDigits: number\n): string {\n  let rawValue = value.replace(new RegExp(`[^${decimalSign}\\\\d-]+`, 'gu'), '');\n  if (decimalSign && decimalSign !== '.') rawValue = rawValue.replace(decimalSign, '.');\n  if (rawValue.startsWith('.')) rawValue = `0${value}`;\n  if (rawValue.startsWith('-.')) rawValue = `-0${value.substring(1)}`;\n  const match = rawValue.match(new RegExp(`-?\\\\d*(\\\\.\\\\d{0,${maximumFractionDigits}})?`));\n  if (match && match.length > 0) {\n    rawValue = match[0];\n  }\n  return rawValue;\n}\n\nexport function getFormattedValue(\n  value: string,\n  locale: string,\n  showGroupSeparators: boolean,\n  maximumFractionDigits: number = 0\n): string {\n  let valueNumber;\n  const integer = getInteger(value);\n  const decimal = getDecimal(locale);\n  const fractionPart = getFraction(value).replace('.', decimal);\n  if (value && !Number.isNaN(parseFloat(integer))) {\n    valueNumber = BigInt(integer);\n    return (\n      new Intl.NumberFormat(locale, { useGrouping: showGroupSeparators })\n        .format(valueNumber)\n        .trim() + (maximumFractionDigits ? fractionPart : '')\n    );\n  }\n  return value;\n}\n\nexport function isValueInRange(\n  value: number,\n  min: number | undefined,\n  max: number | undefined\n): boolean {\n  return !((min !== undefined && value < min) || (max !== undefined && value > max));\n}\n\nexport function getIncrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).plus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (min !== undefined && newValue.toNumber() < min) {\n    return min.toString();\n  }\n  return value;\n}\n\nexport function getDecrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).minus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (max !== undefined && newValue.toNumber() > max) {\n    return max.toString();\n  }\n  return value;\n}\n\ninterface NumberFormatOptions {\n  locale: string;\n  options?: Intl.NumberFormatOptions;\n}\n\nexport function formatNumber(value: number | bigint, { locale, options }: NumberFormatOptions) {\n  const formatter = new Intl.NumberFormat(locale, options);\n\n  return formatter.format(value);\n}\n"]}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import BigNumber from 'bignumber.js';\n\nexport function getDecimalSign(locale: string, options?: Intl.NumberFormatOptions): string {\n  return (\n    new Intl.NumberFormat(locale, options)\n      .formatToParts(0.1)\n      .filter((part: { type: string; value: string }) => part.type === 'decimal')[0]?.value || ''\n  );\n}\n\nexport function getFraction(value: string) {\n  const decPos = value.indexOf('.');\n  const substrLength = decPos === -1 ? value.length : decPos;\n  return value.substring(substrLength);\n}\n\nexport function getCleanedValue(\n  value: string,\n  decimalSign: string,\n  maximumFractionDigits: number\n): string {\n  let rawValue = value.replace(new RegExp(`[^${decimalSign}\\\\d-]+`, 'gu'), '');\n  if (decimalSign && decimalSign !== '.') rawValue = rawValue.replace(decimalSign, '.');\n  const match = rawValue.match(new RegExp(`-?\\\\d*(\\\\.\\\\d{0,${maximumFractionDigits}})?`));\n  if (match && match.length > 0) {\n    rawValue = match[0];\n  }\n  return rawValue;\n}\n\nconst isValidUnit = (unit: string) => {\n  try {\n    // eslint-disable-next-line no-new\n    new Intl.NumberFormat(undefined, { style: 'unit', unit });\n    return true;\n  } catch {\n    return false;\n  }\n};\n\nexport const getFormattedValue = (\n  value: string,\n  locale: string,\n  unit?: string,\n  {\n    notation = 'standard',\n    useGrouping = false,\n    maximumFractionDigits,\n    minimumFractionDigits\n  }: Pick<\n    Intl.NumberFormatOptions,\n    'notation' | 'useGrouping' | 'maximumFractionDigits' | 'minimumFractionDigits'\n  > = {}\n) => {\n  const isUnit = unit ? isValidUnit(unit) : false;\n  const [integer, fractionPart] = value.split('.', 2) as [string, string?];\n\n  const formatter = new Intl.NumberFormat(locale, {\n    notation,\n    useGrouping,\n    minimumFractionDigits:\n      minimumFractionDigits ?? Math.min(maximumFractionDigits ?? 0, fractionPart?.length ?? 0),\n    maximumFractionDigits,\n    style: isUnit ? 'unit' : undefined,\n    unit: isUnit ? unit : undefined\n  });\n\n  let formatted = value;\n\n  if (value && !Number.isNaN(parseFloat(integer))) {\n    const endsWithDot = fractionPart === '';\n    const valueNumber = Number(endsWithDot ? `${value}1` : value);\n    formatted =\n      formatter.formatToParts(valueNumber).reduce((result, { type, value: part }) => {\n        if (type === 'fraction' && endsWithDot) return result;\n        return result + part;\n      }, '') + (!isUnit && unit ? `\\u00a0${unit}` : '');\n  } else if (unit) {\n    if (isUnit)\n      formatted = formatter\n        .formatToParts(value.startsWith('-') ? -1 : 1)\n        .reduce(\n          (result, { type, value: part }) =>\n            ['unit', 'minusSign'].includes(type) ? result + part : result,\n          ''\n        );\n    else formatted = value.startsWith('-') ? `- ${unit}` : unit;\n  }\n  return formatted;\n};\n\nexport function isValueInRange(value: number, min?: number, max?: number): boolean {\n  return !((min !== undefined && value < min) || (max !== undefined && value > max));\n}\n\nexport function getIncrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).plus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (min !== undefined && newValue.toNumber() < min) {\n    return min.toString();\n  }\n  return value;\n}\n\nexport function getDecrementedValue(value: string, min: number, max: number, step: number): string {\n  const numberValue = parseFloat(value) || 0;\n  const newValue = new BigNumber(numberValue).minus(step);\n  if (isValueInRange(newValue.toNumber(), min, max)) {\n    return newValue.toFixed();\n  }\n  if (max !== undefined && newValue.toNumber() > max) {\n    return max.toString();\n  }\n  return value;\n}\n\ninterface NumberFormatOptions {\n  locale: string;\n  options?: Intl.NumberFormatOptions;\n}\n\nexport function formatNumber(value: number | bigint, { locale, options }: NumberFormatOptions) {\n  const formatter = new Intl.NumberFormat(locale, options);\n\n  return formatter.format(value);\n}\n"]}

package/lib/components/PageTemplates/CategorySubPage.d.ts

@@ -1,17 +1,17 @@
 import { Ref, FunctionComponent, ReactNode, MouseEventHandler } from 'react';
 import { ButtonProps } from '../Button';
 import { Action, ForwardProps } from '../../types';
-interface NavItemType extends ForwardProps {
+export interface NavItemType extends ForwardProps {
     text: string;
     active?: boolean;
     onClick?: MouseEventHandler;
     href?: string;
 }
-interface NavGroupType {
+export interface NavGroupType {
     title?: string;
     items: NavItemType[];
 }
-interface PageAction extends Pick<Action, 'id' | 'icon' | 'href' | 'onClick' | 'disabled'>, Pick<ButtonProps, 'variant' | 'label' | 'aria-label' | 'loading'>, ForwardProps {
+export interface PageAction extends Pick<Action, 'id' | 'icon' | 'href' | 'onClick' | 'disabled'>, Pick<ButtonProps, 'variant' | 'label' | 'aria-label' | 'loading'>, ForwardProps {
     /** Optional text to replace required text string in Action type */
     text?: string;
 }

package/lib/components/PageTemplates/CategorySubPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CategorySubPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,GAAG,EAGH,iBAAiB,EACjB,SAAS,EAGT,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAIf,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAMhD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqBnD,UAAU,WAAY,SAAQ,YAAY;IACxC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,UAAU,YAAY;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,WAAW,EAAE,CAAC;CACtB;AAED,UAAU,UACR,SAAQ,IAAI,CAAC,MAAM,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC,EACnE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,OAAO,GAAG,YAAY,GAAG,SAAS,CAAC,EACjE,YAAY;IACd,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,0EAA0E;IAC1E,qBAAqB;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uDAAuD;IACvD,QAAQ,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,+HAA+H;IAC/H,iBAAiB;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kCAAkC;IAClC,MAAM,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AA4DD,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAsIpE,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"CategorySubPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,GAAG,EAGH,iBAAiB,EACjB,SAAS,EAGT,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAIf,OAAe,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAMhD,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqBnD,MAAM,WAAW,WAAY,SAAQ,YAAY;IAC/C,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,YAAY;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,WAAW,EAAE,CAAC;CACtB;AAED,MAAM,WAAW,UACf,SAAQ,IAAI,CAAC,MAAM,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,UAAU,CAAC,EACnE,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,OAAO,GAAG,YAAY,GAAG,SAAS,CAAC,EACjE,YAAY;IACd,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,0EAA0E;IAC1E,qBAAqB;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,uDAAuD;IACvD,QAAQ,EAAE,MAAM,CAAC;IACjB,2BAA2B;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,+HAA+H;IAC/H,iBAAiB;IACjB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kCAAkC;IAClC,MAAM,EAAE,SAAS,CAAC;IAClB,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AA4DD,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,aAAa,GAAG,YAAY,CAsIpE,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/PageTemplates/CategorySubPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategorySubPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createRef,\n  Ref,\n  forwardRef,\n  PropsWithoutRef,\n  FunctionComponent,\n  ReactNode,\n  useCallback,\n  useMemo,\n  MouseEventHandler\n} from 'react';\n\nimport { hasProp } from '../../utils';\nimport { useConsolidatedRef, useUID } from '../../hooks';\nimport Button, { ButtonProps } from '../Button';\nimport Flex from '../Flex';\nimport Icon from '../Icon';\nimport MenuButton from '../MenuButton';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport { Action, ForwardProps } from '../../types';\n\nimport {\n  StyledTemplate,\n  StyledTemplateRow,\n  StyledPageArticle,\n  StyledArticleHeader,\n  StyledPageActionCol,\n  StyledPageTitle,\n  StyledMenuColumn,\n  StyledCategoryHeadingRow,\n  StyledCategoryIconBlock,\n  StyledNav,\n  StyledNavList,\n  StyledNavGroup,\n  StyledNavGroupList,\n  StyledNavGroupHeader,\n  StyledNavItem,\n  StyledSkipNavigation\n} from './CategorySubPage.styles';\n\ninterface NavItemType extends ForwardProps {\n  text: string;\n  active?: boolean;\n  onClick?: MouseEventHandler;\n  href?: string;\n}\n\ninterface NavGroupType {\n  title?: string;\n  items: NavItemType[];\n}\n\ninterface PageAction\n  extends Pick<Action, 'id' | 'icon' | 'href' | 'onClick' | 'disabled'>,\n    Pick<ButtonProps, 'variant' | 'label' | 'aria-label' | 'loading'>,\n    ForwardProps {\n  /** Optional text to replace required text string in Action type */\n  text?: string;\n}\n\nexport interface TemplateProps {\n  /** Indicates that the primary view for the page cannot yet be rendered */\n  /** @default false */\n  viewLoading?: boolean;\n  /** Parent Category of page and all navigation items */\n  category: string;\n  /** Parent Category icon */\n  categoryIcon?: string;\n  navItemGroups: NavGroupType[];\n  pageTitle?: string;\n  /** Actions to render in fixed page header. Ordered by priority */\n  pageActions?: PageAction[];\n  /** Maximum top-level action buttons to render in header. Actions passed exceeding this limit will render in an action menu. */\n  /** @default 3 */\n  maxActions?: number;\n  /** Primary page content region */\n  region: ReactNode;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst NavItem = ({ item: { href, text, active, ...restProps } }: { item: NavItemType }) => {\n  const isAnchor = !!href;\n\n  return (\n    <StyledNavItem\n      as='li'\n      selected={!!active}\n      tabType='horizontal'\n      inverted={false}\n      aria-current={active ? 'page' : undefined}\n    >\n      <Button {...restProps} href={isAnchor ? href : undefined} variant='text'>\n        {text}\n      </Button>\n    </StyledNavItem>\n  );\n};\n\nconst NavGroup = ({ item }: { item: NavGroupType }) => {\n  const mappedGroupedItems = useMemo(() => {\n    return item.items.map(groupedItem => {\n      const key = groupedItem.text;\n      return <NavItem item={groupedItem} key={key} />;\n    });\n  }, [item.items]);\n\n  const titledGroup: boolean = useMemo(() => {\n    return !!item.title && !!item.items.length;\n  }, [item.title, item.items]);\n\n  const anonGroup: boolean = useMemo(() => {\n    return !item.title && item.items.length > 1;\n  }, [item.title, item.items]);\n\n  const groupLabelId = useUID();\n  if (titledGroup) {\n    return (\n      <StyledNavGroup as='li'>\n        <StyledNavGroupHeader variant='h3' id={groupLabelId}>\n          {(item as NavGroupType).title}\n        </StyledNavGroupHeader>\n\n        <StyledNavGroupList aria-labelledby={groupLabelId}>{mappedGroupedItems}</StyledNavGroupList>\n      </StyledNavGroup>\n    );\n  }\n\n  if (anonGroup) {\n    return <StyledNavGroup>{mappedGroupedItems}</StyledNavGroup>;\n  }\n\n  if (item.items.length === 1) {\n    return <NavItem item={item.items[0]} />;\n  }\n\n  return null;\n};\n\nconst CategorySubPage: FunctionComponent<TemplateProps & ForwardProps> = forwardRef(\n  (\n    {\n      viewLoading = false,\n      category,\n      categoryIcon,\n      navItemGroups,\n      pageTitle,\n      pageActions,\n      region,\n      maxActions = 3,\n      ...restProps\n    }: PropsWithoutRef<TemplateProps>,\n    ref: TemplateProps['ref']\n  ) => {\n    const articleRef = createRef<HTMLElement>();\n    const templateRef = useConsolidatedRef(ref);\n\n    const mappedAction = useCallback((action: PageAction) => {\n      const { id, text, icon, label, ...rest } = action;\n\n      return (\n        <Button {...rest} key={id} icon={!!icon && !text} label={label || text}>\n          {!!icon && <Icon name={icon} />}\n          {!!text && text}\n        </Button>\n      );\n    }, []);\n\n    return (\n      <StyledTemplate>\n        <Flex\n          {...restProps}\n          ref={templateRef}\n          as={StyledTemplateRow}\n          container={{ alignItems: 'stretch', wrap: 'nowrap' }}\n        >\n          <StyledMenuColumn>\n            <StyledSkipNavigation\n              onClick={() => {\n                if (articleRef.current) articleRef.current.focus();\n              }}\n            >\n              Skip to page content\n            </StyledSkipNavigation>\n\n            <Flex as={StyledCategoryHeadingRow} container={{ alignItems: 'center' }}>\n              {categoryIcon && (\n                <Flex\n                  as={StyledCategoryIconBlock}\n                  container={{ alignItems: 'center', justify: 'center' }}\n                >\n                  <Icon name={categoryIcon} />\n                </Flex>\n              )}\n              <Text variant='h1'>{category}</Text>\n            </Flex>\n\n            <StyledNav>\n              <StyledNavList>\n                {navItemGroups.map((navItem, index) => {\n                  const key = hasProp(navItem, 'title') ? navItem.title : `navItem${index}`;\n\n                  return <NavGroup key={key} item={navItem} />;\n                })}\n              </StyledNavList>\n            </StyledNav>\n          </StyledMenuColumn>\n\n          <Flex\n            as={StyledPageArticle}\n            item={{ grow: 1 }}\n            ref={articleRef}\n            aria-label={pageTitle || 'Main Content'}\n            tabIndex={0}\n          >\n            {viewLoading && <Progress placement='local' />}\n\n            {!viewLoading && (\n              <>\n                {(pageTitle || pageActions) && (\n                  <Flex\n                    as={StyledArticleHeader}\n                    container={{\n                      justify: 'between',\n                      alignItems: 'center',\n                      wrap: 'wrap'\n                    }}\n                  >\n                    {pageTitle && <StyledPageTitle>{pageTitle}</StyledPageTitle>}\n\n                    {pageActions && !!pageActions.length && (\n                      <>\n                        {pageActions.length <= maxActions && (\n                          <StyledPageActionCol>\n                            {pageActions.reverse().map(mappedAction)}\n                          </StyledPageActionCol>\n                        )}\n\n                        {pageActions.length > maxActions && (\n                          <StyledPageActionCol>\n                            <MenuButton\n                              text='Actions'\n                              menu={{\n                                items: (pageActions as Action[])\n                                  .slice(maxActions - 1)\n                                  .map(({ id, text, onClick, ...rest }) => ({\n                                    id,\n                                    primary: text,\n                                    onClick,\n                                    ...rest\n                                  }))\n                              }}\n                            />\n\n                            {pageActions\n                              .slice(0, maxActions - 1)\n                              .reverse()\n                              .map(mappedAction)}\n                          </StyledPageActionCol>\n                        )}\n                      </>\n                    )}\n                  </Flex>\n                )}\n\n                {region}\n              </>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTemplate>\n    );\n  }\n);\n\nexport default CategorySubPage;\n"]}
+{"version":3,"file":"CategorySubPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/CategorySubPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  createRef,\n  Ref,\n  forwardRef,\n  PropsWithoutRef,\n  FunctionComponent,\n  ReactNode,\n  useCallback,\n  useMemo,\n  MouseEventHandler\n} from 'react';\n\nimport { hasProp } from '../../utils';\nimport { useConsolidatedRef, useUID } from '../../hooks';\nimport Button, { ButtonProps } from '../Button';\nimport Flex from '../Flex';\nimport Icon from '../Icon';\nimport MenuButton from '../MenuButton';\nimport Text from '../Text';\nimport Progress from '../Progress';\nimport { Action, ForwardProps } from '../../types';\n\nimport {\n  StyledTemplate,\n  StyledTemplateRow,\n  StyledPageArticle,\n  StyledArticleHeader,\n  StyledPageActionCol,\n  StyledPageTitle,\n  StyledMenuColumn,\n  StyledCategoryHeadingRow,\n  StyledCategoryIconBlock,\n  StyledNav,\n  StyledNavList,\n  StyledNavGroup,\n  StyledNavGroupList,\n  StyledNavGroupHeader,\n  StyledNavItem,\n  StyledSkipNavigation\n} from './CategorySubPage.styles';\n\nexport interface NavItemType extends ForwardProps {\n  text: string;\n  active?: boolean;\n  onClick?: MouseEventHandler;\n  href?: string;\n}\n\nexport interface NavGroupType {\n  title?: string;\n  items: NavItemType[];\n}\n\nexport interface PageAction\n  extends Pick<Action, 'id' | 'icon' | 'href' | 'onClick' | 'disabled'>,\n    Pick<ButtonProps, 'variant' | 'label' | 'aria-label' | 'loading'>,\n    ForwardProps {\n  /** Optional text to replace required text string in Action type */\n  text?: string;\n}\n\nexport interface TemplateProps {\n  /** Indicates that the primary view for the page cannot yet be rendered */\n  /** @default false */\n  viewLoading?: boolean;\n  /** Parent Category of page and all navigation items */\n  category: string;\n  /** Parent Category icon */\n  categoryIcon?: string;\n  navItemGroups: NavGroupType[];\n  pageTitle?: string;\n  /** Actions to render in fixed page header. Ordered by priority */\n  pageActions?: PageAction[];\n  /** Maximum top-level action buttons to render in header. Actions passed exceeding this limit will render in an action menu. */\n  /** @default 3 */\n  maxActions?: number;\n  /** Primary page content region */\n  region: ReactNode;\n  /** Ref forwarded to the wrapping element. */\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst NavItem = ({ item: { href, text, active, ...restProps } }: { item: NavItemType }) => {\n  const isAnchor = !!href;\n\n  return (\n    <StyledNavItem\n      as='li'\n      selected={!!active}\n      tabType='horizontal'\n      inverted={false}\n      aria-current={active ? 'page' : undefined}\n    >\n      <Button {...restProps} href={isAnchor ? href : undefined} variant='text'>\n        {text}\n      </Button>\n    </StyledNavItem>\n  );\n};\n\nconst NavGroup = ({ item }: { item: NavGroupType }) => {\n  const mappedGroupedItems = useMemo(() => {\n    return item.items.map(groupedItem => {\n      const key = groupedItem.text;\n      return <NavItem item={groupedItem} key={key} />;\n    });\n  }, [item.items]);\n\n  const titledGroup: boolean = useMemo(() => {\n    return !!item.title && !!item.items.length;\n  }, [item.title, item.items]);\n\n  const anonGroup: boolean = useMemo(() => {\n    return !item.title && item.items.length > 1;\n  }, [item.title, item.items]);\n\n  const groupLabelId = useUID();\n  if (titledGroup) {\n    return (\n      <StyledNavGroup as='li'>\n        <StyledNavGroupHeader variant='h3' id={groupLabelId}>\n          {(item as NavGroupType).title}\n        </StyledNavGroupHeader>\n\n        <StyledNavGroupList aria-labelledby={groupLabelId}>{mappedGroupedItems}</StyledNavGroupList>\n      </StyledNavGroup>\n    );\n  }\n\n  if (anonGroup) {\n    return <StyledNavGroup>{mappedGroupedItems}</StyledNavGroup>;\n  }\n\n  if (item.items.length === 1) {\n    return <NavItem item={item.items[0]} />;\n  }\n\n  return null;\n};\n\nconst CategorySubPage: FunctionComponent<TemplateProps & ForwardProps> = forwardRef(\n  (\n    {\n      viewLoading = false,\n      category,\n      categoryIcon,\n      navItemGroups,\n      pageTitle,\n      pageActions,\n      region,\n      maxActions = 3,\n      ...restProps\n    }: PropsWithoutRef<TemplateProps>,\n    ref: TemplateProps['ref']\n  ) => {\n    const articleRef = createRef<HTMLElement>();\n    const templateRef = useConsolidatedRef(ref);\n\n    const mappedAction = useCallback((action: PageAction) => {\n      const { id, text, icon, label, ...rest } = action;\n\n      return (\n        <Button {...rest} key={id} icon={!!icon && !text} label={label || text}>\n          {!!icon && <Icon name={icon} />}\n          {!!text && text}\n        </Button>\n      );\n    }, []);\n\n    return (\n      <StyledTemplate>\n        <Flex\n          {...restProps}\n          ref={templateRef}\n          as={StyledTemplateRow}\n          container={{ alignItems: 'stretch', wrap: 'nowrap' }}\n        >\n          <StyledMenuColumn>\n            <StyledSkipNavigation\n              onClick={() => {\n                if (articleRef.current) articleRef.current.focus();\n              }}\n            >\n              Skip to page content\n            </StyledSkipNavigation>\n\n            <Flex as={StyledCategoryHeadingRow} container={{ alignItems: 'center' }}>\n              {categoryIcon && (\n                <Flex\n                  as={StyledCategoryIconBlock}\n                  container={{ alignItems: 'center', justify: 'center' }}\n                >\n                  <Icon name={categoryIcon} />\n                </Flex>\n              )}\n              <Text variant='h1'>{category}</Text>\n            </Flex>\n\n            <StyledNav>\n              <StyledNavList>\n                {navItemGroups.map((navItem, index) => {\n                  const key = hasProp(navItem, 'title') ? navItem.title : `navItem${index}`;\n\n                  return <NavGroup key={key} item={navItem} />;\n                })}\n              </StyledNavList>\n            </StyledNav>\n          </StyledMenuColumn>\n\n          <Flex\n            as={StyledPageArticle}\n            item={{ grow: 1 }}\n            ref={articleRef}\n            aria-label={pageTitle || 'Main Content'}\n            tabIndex={0}\n          >\n            {viewLoading && <Progress placement='local' />}\n\n            {!viewLoading && (\n              <>\n                {(pageTitle || pageActions) && (\n                  <Flex\n                    as={StyledArticleHeader}\n                    container={{\n                      justify: 'between',\n                      alignItems: 'center',\n                      wrap: 'wrap'\n                    }}\n                  >\n                    {pageTitle && <StyledPageTitle>{pageTitle}</StyledPageTitle>}\n\n                    {pageActions && !!pageActions.length && (\n                      <>\n                        {pageActions.length <= maxActions && (\n                          <StyledPageActionCol>\n                            {pageActions.reverse().map(mappedAction)}\n                          </StyledPageActionCol>\n                        )}\n\n                        {pageActions.length > maxActions && (\n                          <StyledPageActionCol>\n                            <MenuButton\n                              text='Actions'\n                              menu={{\n                                items: (pageActions as Action[])\n                                  .slice(maxActions - 1)\n                                  .map(({ id, text, onClick, ...rest }) => ({\n                                    id,\n                                    primary: text,\n                                    onClick,\n                                    ...rest\n                                  }))\n                              }}\n                            />\n\n                            {pageActions\n                              .slice(0, maxActions - 1)\n                              .reverse()\n                              .map(mappedAction)}\n                          </StyledPageActionCol>\n                        )}\n                      </>\n                    )}\n                  </Flex>\n                )}\n\n                {region}\n              </>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTemplate>\n    );\n  }\n);\n\nexport default CategorySubPage;\n"]}

package/lib/components/PageTemplates/DashboardPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,iBAAiB,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIhG,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAQ3C,OAAO,EACL,iBAAiB,EACjB,eAAe,EAKhB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,eAAe;IAC/D,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,cAAc,CAAC,EAAE,aAAa,GAAG,cAAc,GAAG,YAAY,CAAC;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,SAAS,EAAE,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,yGAAyB,CAAC;AAIzD,eAAO,MAAM,qBAAqB,yGAEjC,CAAC;AAIF,eAAO,MAAM,yBAAyB;;;qDAYpC,CAAC;AA+LH,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAiBvE,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"DashboardPage.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,iBAAiB,EAAwB,SAAS,EAAE,MAAM,OAAO,CAAC;AAIhG,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAQ3C,OAAO,EACL,iBAAiB,EACjB,eAAe,EAKhB,MAAM,iBAAiB,CAAC;AAEzB,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;IAC3D,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,CAAC,EAAE,SAAS,CAAC;IACb,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,eAAe;IAC/D,OAAO,CAAC,EAAE,SAAS,EAAE,CAAC;IACtB,cAAc,CAAC,EAAE,aAAa,GAAG,cAAc,GAAG,YAAY,CAAC;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,EAAE,SAAS,EAAE,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,yGAAyB,CAAC;AAIzD,eAAO,MAAM,qBAAqB,yGAEjC,CAAC;AAIF,eAAO,MAAM,yBAAyB;;;qDAYpC,CAAC;AA4LH,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CAiBvE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/PageTemplates/DashboardPage.js

@@ -74,10 +74,7 @@ const DashboardPageLayout = forwardRef(({ regions, regionFullWidth, cols = `repe
             }
             return banners ? 'auto auto 1fr 1fr' : 'auto 1fr 1fr';
         }
-        if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {
-            return banners ? 'auto auto auto auto auto' : 'auto auto auto auto';
-        }
-        return banners ? 'auto auto auto auto' : 'auto auto auto';
+        return 'fit-content(100%)';
     }, [filterPosition, banners]);
     if (filterPosition === 'inline-start' && filters && Object.keys(filters).length !== 0) {
         cols = '1fr 2fr 2fr';

package/lib/components/PageTemplates/DashboardPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, FunctionComponent, PropsWithoutRef, Ref, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon from '../Icon';\nimport Breadcrumbs from '../Breadcrumbs';\n\nimport {\n  PageTemplateProps,\n  PageLayoutProps,\n  StyledPageHeader,\n  StyledPageLayout,\n  StyledPageIcon,\n  StyledRegion\n} from './PageTemplates';\n\nexport interface DashboardPageProps extends PageTemplateProps {\n  a: ReactNode;\n  b: ReactNode;\n  c: ReactNode;\n  filters?: ReactNode[];\n  fitToViewport?: boolean;\n}\n\nexport interface DashboardPageLayoutProps extends PageLayoutProps {\n  filters?: ReactNode[];\n  filterPosition?: 'block-start' | 'inline-start' | 'inline-end';\n  fitToViewport?: boolean;\n  regionFullWidth: ReactNode[];\n}\n\nexport const StyledFilterRegion = styled(StyledRegion)``;\n\nStyledFilterRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardRegion = styled(StyledRegion)`\n  overflow: auto;\n`;\n\nStyledDashboardRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardPageLayout = styled(StyledPageLayout)<\n  Pick<DashboardPageProps, 'fitToViewport'>\n>(({ fitToViewport }) => {\n  const height = 'calc(100vh - var(--appshell-offset, 0))';\n\n  return css`\n    min-height: ${height};\n    ${fitToViewport &&\n    css`\n      height: ${height};\n    `}\n  `;\n});\n\nStyledDashboardPageLayout.defaultProps = defaultThemeProp;\n\nconst DashboardPageLayout: FunctionComponent<DashboardPageLayoutProps & ForwardProps> = forwardRef(\n  (\n    {\n      regions,\n      regionFullWidth,\n      cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n      filters,\n      filterPosition = 'block-start',\n      fitToViewport = false,\n      title,\n      icon,\n      actions,\n      banners,\n      path,\n      as,\n      ...restProps\n    }: PropsWithoutRef<DashboardPageLayoutProps>,\n    ref: PageLayoutProps['ref']\n  ) => {\n    const headerArea = useMemo(() => {\n      if (filterPosition === 'block-start' || !filters || Object.keys(filters).length === 0) {\n        return `'${Array.from({ length: regions.length }, () => 'header').join(' ')}'`;\n      }\n      return `'${Array.from({ length: regions.length + 1 }, () => 'header').join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const bannerArea = `'${Array.from({ length: regions.length }, () => 'banner').join(' ')}'`;\n    const filterArea = `'${Array.from({ length: regions.length }, () => 'filter').join(' ')}'`;\n\n    const regionArea = useMemo(() => {\n      if (filters && Object.keys(filters).length !== 0) {\n        if (filterPosition === 'inline-start') {\n          return `'filter ${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n            ' '\n          )}'`;\n        }\n        if (filterPosition === 'inline-end') {\n          return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n            ' '\n          )} filter'`;\n        }\n      }\n      return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const regionFullWidthArea = useMemo(() => {\n      if (filters && Object.keys(filters).length !== 0) {\n        if (filterPosition === 'inline-start') {\n          return `'filter ${Array.from({ length: regions.length }, () => 'col-full-width').join(\n            ' '\n          )}'`;\n        }\n        if (filterPosition === 'inline-end') {\n          return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(\n            ' '\n          )} filter'`;\n        }\n      }\n      return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const gridAreas = useMemo(() => {\n      if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n        return banners\n          ? `${headerArea}\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`\n          : `${headerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n      }\n      return banners\n        ? `${headerArea}\\n${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`\n        : `${headerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n    }, [filterPosition, filters, banners]);\n\n    const pageRows = useMemo(() => {\n      if (fitToViewport) {\n        if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n          return banners ? 'auto auto auto 1fr 1fr' : 'auto auto 1fr 1fr';\n        }\n        return banners ? 'auto auto 1fr 1fr' : 'auto 1fr 1fr';\n      }\n      if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n        return banners ? 'auto auto auto auto auto' : 'auto auto auto auto';\n      }\n      return banners ? 'auto auto auto auto' : 'auto auto auto';\n    }, [filterPosition, banners]);\n\n    if (filterPosition === 'inline-start' && filters && Object.keys(filters).length !== 0) {\n      cols = '1fr 2fr 2fr';\n    }\n\n    if (filterPosition === 'inline-end' && filters && Object.keys(filters).length !== 0) {\n      cols = '2fr 2fr 1fr';\n    }\n\n    return (\n      <Grid\n        {...restProps}\n        as={StyledDashboardPageLayout}\n        forwardedAs={as}\n        fitToViewport={fitToViewport}\n        container={{\n          autoRows: 'max-content',\n          cols: '1fr',\n          gap: 2,\n          pad: 2\n        }}\n        md={{\n          container: {\n            areas: gridAreas,\n            rows: pageRows,\n            cols\n          }\n        }}\n        ref={ref}\n      >\n        <Grid as={StyledPageHeader} md={{ item: { area: 'header' } }}>\n          {path && path.length > 0 && <Breadcrumbs path={...path} />}\n          <SummaryItem\n            visual={\n              icon && (\n                <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n                  <Icon name={icon} />\n                </StyledPageIcon>\n              )\n            }\n            primary={<Text variant='h1'>{title}</Text>}\n            actions={actions}\n          />\n        </Grid>\n        {banners && <Grid md={{ item: { area: 'banner' } }}>{banners}</Grid>}\n        {filters && Object.keys(filters).length !== 0 && (\n          <Grid\n            as={StyledFilterRegion}\n            container={{\n              autoRows: 'max-content',\n              gap: 2\n            }}\n            md={{\n              container: {\n                cols:\n                  filterPosition === 'block-start'\n                    ? 'repeat(4, minmax(min(20ch, 100%), 1fr))'\n                    : 'repeat(auto-fit, minmax(min(20ch, 100%), 1fr))'\n              },\n              item: { area: 'filter' }\n            }}\n          >\n            {filters}\n          </Grid>\n        )}\n        {regions.map((colItems: ReactNode, i: number) => {\n          const key = `${i}`;\n          return (\n            <Flex\n              container={{\n                direction: 'column',\n                justify: 'start',\n                gap: 2\n              }}\n              as={StyledDashboardRegion}\n              key={key}\n            >\n              {colItems}\n            </Flex>\n          );\n        })}\n        {regionFullWidth.map((colItems: ReactNode, i: number) => {\n          const key = `${i}`;\n          return (\n            <Grid\n              container={{\n                cols: 'minmax(0, 1fr)',\n                alignItems: 'start',\n                gap: 2\n              }}\n              md={{ item: { area: 'col-full-width' } }}\n              as={StyledDashboardRegion}\n              key={key}\n            >\n              {colItems}\n            </Grid>\n          );\n        })}\n      </Grid>\n    );\n  }\n);\n\nconst DashboardPage: FunctionComponent<DashboardPageProps & ForwardProps> = forwardRef(\n  (\n    { a, b, c, filters, fitToViewport, ...restProps }: PropsWithoutRef<DashboardPageProps>,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    return (\n      <DashboardPageLayout\n        {...restProps}\n        cols='1fr 1fr'\n        filters={filters}\n        fitToViewport={fitToViewport}\n        regions={[a, b]}\n        regionFullWidth={[c]}\n        ref={ref}\n      />\n    );\n  }\n);\n\nexport default DashboardPage;\n"]}
+{"version":3,"file":"DashboardPage.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/DashboardPage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, FunctionComponent, PropsWithoutRef, Ref, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport Flex from '../Flex';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon from '../Icon';\nimport Breadcrumbs from '../Breadcrumbs';\n\nimport {\n  PageTemplateProps,\n  PageLayoutProps,\n  StyledPageHeader,\n  StyledPageLayout,\n  StyledPageIcon,\n  StyledRegion\n} from './PageTemplates';\n\nexport interface DashboardPageProps extends PageTemplateProps {\n  a: ReactNode;\n  b: ReactNode;\n  c: ReactNode;\n  filters?: ReactNode[];\n  fitToViewport?: boolean;\n}\n\nexport interface DashboardPageLayoutProps extends PageLayoutProps {\n  filters?: ReactNode[];\n  filterPosition?: 'block-start' | 'inline-start' | 'inline-end';\n  fitToViewport?: boolean;\n  regionFullWidth: ReactNode[];\n}\n\nexport const StyledFilterRegion = styled(StyledRegion)``;\n\nStyledFilterRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardRegion = styled(StyledRegion)`\n  overflow: auto;\n`;\n\nStyledDashboardRegion.defaultProps = defaultThemeProp;\n\nexport const StyledDashboardPageLayout = styled(StyledPageLayout)<\n  Pick<DashboardPageProps, 'fitToViewport'>\n>(({ fitToViewport }) => {\n  const height = 'calc(100vh - var(--appshell-offset, 0))';\n\n  return css`\n    min-height: ${height};\n    ${fitToViewport &&\n    css`\n      height: ${height};\n    `}\n  `;\n});\n\nStyledDashboardPageLayout.defaultProps = defaultThemeProp;\n\nconst DashboardPageLayout: FunctionComponent<DashboardPageLayoutProps & ForwardProps> = forwardRef(\n  (\n    {\n      regions,\n      regionFullWidth,\n      cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n      filters,\n      filterPosition = 'block-start',\n      fitToViewport = false,\n      title,\n      icon,\n      actions,\n      banners,\n      path,\n      as,\n      ...restProps\n    }: PropsWithoutRef<DashboardPageLayoutProps>,\n    ref: PageLayoutProps['ref']\n  ) => {\n    const headerArea = useMemo(() => {\n      if (filterPosition === 'block-start' || !filters || Object.keys(filters).length === 0) {\n        return `'${Array.from({ length: regions.length }, () => 'header').join(' ')}'`;\n      }\n      return `'${Array.from({ length: regions.length + 1 }, () => 'header').join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const bannerArea = `'${Array.from({ length: regions.length }, () => 'banner').join(' ')}'`;\n    const filterArea = `'${Array.from({ length: regions.length }, () => 'filter').join(' ')}'`;\n\n    const regionArea = useMemo(() => {\n      if (filters && Object.keys(filters).length !== 0) {\n        if (filterPosition === 'inline-start') {\n          return `'filter ${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n            ' '\n          )}'`;\n        }\n        if (filterPosition === 'inline-end') {\n          return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n            ' '\n          )} filter'`;\n        }\n      }\n      return `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const regionFullWidthArea = useMemo(() => {\n      if (filters && Object.keys(filters).length !== 0) {\n        if (filterPosition === 'inline-start') {\n          return `'filter ${Array.from({ length: regions.length }, () => 'col-full-width').join(\n            ' '\n          )}'`;\n        }\n        if (filterPosition === 'inline-end') {\n          return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(\n            ' '\n          )} filter'`;\n        }\n      }\n      return `'${Array.from({ length: regions.length }, () => 'col-full-width').join(' ')}'`;\n    }, [filterPosition, filters, regions.length]);\n\n    const gridAreas = useMemo(() => {\n      if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n        return banners\n          ? `${headerArea}\\n${bannerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`\n          : `${headerArea}\\n${filterArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n      }\n      return banners\n        ? `${headerArea}\\n${bannerArea}\\n${regionArea}\\n${regionFullWidthArea}`\n        : `${headerArea}\\n${regionArea}\\n${regionFullWidthArea}`;\n    }, [filterPosition, filters, banners]);\n\n    const pageRows = useMemo(() => {\n      if (fitToViewport) {\n        if (filterPosition === 'block-start' && filters && Object.keys(filters).length !== 0) {\n          return banners ? 'auto auto auto 1fr 1fr' : 'auto auto 1fr 1fr';\n        }\n        return banners ? 'auto auto 1fr 1fr' : 'auto 1fr 1fr';\n      }\n      return 'fit-content(100%)';\n    }, [filterPosition, banners]);\n\n    if (filterPosition === 'inline-start' && filters && Object.keys(filters).length !== 0) {\n      cols = '1fr 2fr 2fr';\n    }\n\n    if (filterPosition === 'inline-end' && filters && Object.keys(filters).length !== 0) {\n      cols = '2fr 2fr 1fr';\n    }\n\n    return (\n      <Grid\n        {...restProps}\n        as={StyledDashboardPageLayout}\n        forwardedAs={as}\n        fitToViewport={fitToViewport}\n        container={{\n          autoRows: 'max-content',\n          cols: '1fr',\n          gap: 2,\n          pad: 2\n        }}\n        md={{\n          container: {\n            areas: gridAreas,\n            rows: pageRows,\n            cols\n          }\n        }}\n        ref={ref}\n      >\n        <Grid as={StyledPageHeader} md={{ item: { area: 'header' } }}>\n          {path && path.length > 0 && <Breadcrumbs path={...path} />}\n          <SummaryItem\n            visual={\n              icon && (\n                <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n                  <Icon name={icon} />\n                </StyledPageIcon>\n              )\n            }\n            primary={<Text variant='h1'>{title}</Text>}\n            actions={actions}\n          />\n        </Grid>\n        {banners && <Grid md={{ item: { area: 'banner' } }}>{banners}</Grid>}\n        {filters && Object.keys(filters).length !== 0 && (\n          <Grid\n            as={StyledFilterRegion}\n            container={{\n              autoRows: 'max-content',\n              gap: 2\n            }}\n            md={{\n              container: {\n                cols:\n                  filterPosition === 'block-start'\n                    ? 'repeat(4, minmax(min(20ch, 100%), 1fr))'\n                    : 'repeat(auto-fit, minmax(min(20ch, 100%), 1fr))'\n              },\n              item: { area: 'filter' }\n            }}\n          >\n            {filters}\n          </Grid>\n        )}\n        {regions.map((colItems: ReactNode, i: number) => {\n          const key = `${i}`;\n          return (\n            <Flex\n              container={{\n                direction: 'column',\n                justify: 'start',\n                gap: 2\n              }}\n              as={StyledDashboardRegion}\n              key={key}\n            >\n              {colItems}\n            </Flex>\n          );\n        })}\n        {regionFullWidth.map((colItems: ReactNode, i: number) => {\n          const key = `${i}`;\n          return (\n            <Grid\n              container={{\n                cols: 'minmax(0, 1fr)',\n                alignItems: 'start',\n                gap: 2\n              }}\n              md={{ item: { area: 'col-full-width' } }}\n              as={StyledDashboardRegion}\n              key={key}\n            >\n              {colItems}\n            </Grid>\n          );\n        })}\n      </Grid>\n    );\n  }\n);\n\nconst DashboardPage: FunctionComponent<DashboardPageProps & ForwardProps> = forwardRef(\n  (\n    { a, b, c, filters, fitToViewport, ...restProps }: PropsWithoutRef<DashboardPageProps>,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    return (\n      <DashboardPageLayout\n        {...restProps}\n        cols='1fr 1fr'\n        filters={filters}\n        fitToViewport={fitToViewport}\n        regions={[a, b]}\n        regionFullWidth={[c]}\n        ref={ref}\n      />\n    );\n  }\n);\n\nexport default DashboardPage;\n"]}