@digigov/react-core 2.0.0-113e6661 → 2.0.0-36b707c1

package/Base/index.web.d.ts

@@ -12,53 +12,53 @@ type PolymorphicComponentPropWithRef<C extends React.ElementType, Props = Record
  */
 export type BaseProps<C extends React.ElementType> = PolymorphicComponentPropWithRef<C, {
     /** margin is optional. It has not a default value. */
-    margin?: spacingValues;
+    margin?: SpacingValues | SpacingMediaValues;
     /** marginTop is optional. It has not a default value. */
-    marginTop?: spacingValues;
+    marginTop?: SpacingValues | SpacingMediaValues;
     /** marginBottom is optional. It has not a default value. */
-    marginBottom?: spacingValues;
+    marginBottom?: SpacingValues | SpacingMediaValues;
     /** marginLeft is optional. It has not a default value. */
-    marginLeft?: spacingValues;
+    marginLeft?: SpacingValues | SpacingMediaValues;
     /** marginRight is optional. It has not a default value. */
-    marginRight?: spacingValues;
+    marginRight?: SpacingValues | SpacingMediaValues;
     /** Alternative for margin. Margin is optional. It has not a default value. */
-    m?: spacingValues;
+    m?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginTop. MarginTop is optional. It has not a default value. */
-    mt?: spacingValues;
+    mt?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginBottom. MarginBottom is optional. It has not a default value. */
-    mb?: spacingValues;
+    mb?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginLeft. MarginLeft is optional. It has not a default value. */
-    ml?: spacingValues;
+    ml?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginRight. MarginRight is optional. It has not a default value. */
-    mr?: spacingValues;
+    mr?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginX. MarginX is optional. It has not a default value. */
-    mx?: spacingValues;
+    mx?: SpacingValues | SpacingMediaValues;
     /** Alternative for marginY. MarginY is optional. It has not a default value. */
-    my?: spacingValues;
+    my?: SpacingValues | SpacingMediaValues;
     /** padding is optional. It has not a default value. */
-    padding?: spacingValues;
+    padding?: SpacingValues | SpacingMediaValues;
     /** paddingTop is optional. It has not a default value. */
-    paddingTop?: spacingValues;
+    paddingTop?: SpacingValues | SpacingMediaValues;
     /** paddingBottom is optional. It has not a default value. */
-    paddingBottom?: spacingValues;
+    paddingBottom?: SpacingValues | SpacingMediaValues;
     /** paddingLeft is optional. It has not a default value. */
-    paddingLeft?: spacingValues;
+    paddingLeft?: SpacingValues | SpacingMediaValues;
     /** paddingRight is optional. It has not a default value. */
-    paddingRight?: spacingValues;
+    paddingRight?: SpacingValues | SpacingMediaValues;
     /** Alternative for padding. Padding is optional. It has not a default value. */
-    p?: spacingValues;
+    p?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingTop. PaddingTop is optional. It has not a default value. */
-    pt?: spacingValues;
+    pt?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingBottom. PaddingBottom is optional. It has not a default value. */
-    pb?: spacingValues;
+    pb?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingLeft. PaddingLeft is optional. It has not a default value. */
-    pl?: spacingValues;
+    pl?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingRight. PaddingRight is optional. It has not a default value. */
-    pr?: spacingValues;
+    pr?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingX. PaddingX is optional. It has not a default value. */
-    px?: spacingValues;
+    px?: SpacingValues | SpacingMediaValues;
     /** Alternative for paddingY. PaddingY is optional. It has not a default value. */
-    py?: spacingValues;
+    py?: SpacingValues | SpacingMediaValues;
     /**  printHidden is optional. Default value is false. When true, the component is hidden at print. */
     printHidden?: boolean;
     /**  printVisible is optional. When block, the component is displayed as block. When inline, the component is displayed as inline.*/
@@ -88,7 +88,14 @@ export type BaseProps<C extends React.ElementType> = PolymorphicComponentPropWit
     /**  display is optional. It has not a default value. */
     display?: 'flex' | 'block' | 'none';
 }>;
-type spacingValues = 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 14 | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 52 | 56 | 60 | 64 | 72 | 80 | 96;
+export type SpacingValues = 0 | 0.5 | 1 | 1.5 | 2 | 2.5 | 3 | 3.5 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 14 | 16 | 20 | 24 | 28 | 32 | 36 | 40 | 44 | 48 | 52 | 56 | 60 | 64 | 72 | 80 | 96;
+export type SpacingMediaValues = {
+    xs?: SpacingValues;
+    sm?: SpacingValues;
+    md?: SpacingValues;
+    lg?: SpacingValues;
+    xl?: SpacingValues;
+};
 /**
  * This is the type used in the type annotation for the component
  */

package/Base/index.web.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Base/index.web.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { basePropGenerator } from '@digigov/react-core/Base/utils';\n\ntype AsProp<C extends React.ElementType> = {\n  as?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// This is the first reusable type utility we built\ntype PolymorphicComponentProp<\n  C extends React.ElementType,\n  Props = Record<string, unknown>,\n> = React.PropsWithChildren<Props & AsProp<C>> &\n  Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;\n\n// This is a new type utitlity with ref!\ntype PolymorphicComponentPropWithRef<\n  C extends React.ElementType,\n  Props = Record<string, unknown>,\n> = PolymorphicComponentProp<C, Props> & { ref?: any };\n\n// This is the type for the \"ref\" only\ntype PolymorphicRef<C extends React.ElementType> =\n  React.ComponentPropsWithRef<C>['ref'];\n\n/**\n * This is the updated component props using PolymorphicComponentPropWithRef\n */\nexport type BaseProps<C extends React.ElementType> =\n  PolymorphicComponentPropWithRef<\n    C,\n    {\n      /** margin is optional. It has not a default value. */\n      margin?: spacingValues;\n      /** marginTop is optional. It has not a default value. */\n      marginTop?: spacingValues;\n      /** marginBottom is optional. It has not a default value. */\n      marginBottom?: spacingValues;\n      /** marginLeft is optional. It has not a default value. */\n      marginLeft?: spacingValues;\n      /** marginRight is optional. It has not a default value. */\n      marginRight?: spacingValues;\n      /** Alternative for margin. Margin is optional. It has not a default value. */\n      m?: spacingValues;\n      /** Alternative for marginTop. MarginTop is optional. It has not a default value. */\n      mt?: spacingValues;\n      /** Alternative for marginBottom. MarginBottom is optional. It has not a default value. */\n      mb?: spacingValues;\n      /** Alternative for marginLeft. MarginLeft is optional. It has not a default value. */\n      ml?: spacingValues;\n      /** Alternative for marginRight. MarginRight is optional. It has not a default value. */\n      mr?: spacingValues;\n      /** Alternative for marginX. MarginX is optional. It has not a default value. */\n      mx?: spacingValues;\n      /** Alternative for marginY. MarginY is optional. It has not a default value. */\n      my?: spacingValues;\n      /** padding is optional. It has not a default value. */\n      padding?: spacingValues;\n      /** paddingTop is optional. It has not a default value. */\n      paddingTop?: spacingValues;\n      /** paddingBottom is optional. It has not a default value. */\n      paddingBottom?: spacingValues;\n      /** paddingLeft is optional. It has not a default value. */\n      paddingLeft?: spacingValues;\n      /** paddingRight is optional. It has not a default value. */\n      paddingRight?: spacingValues;\n      /** Alternative for padding. Padding is optional. It has not a default value. */\n      p?: spacingValues;\n      /** Alternative for paddingTop. PaddingTop is optional. It has not a default value. */\n      pt?: spacingValues;\n      /** Alternative for paddingBottom. PaddingBottom is optional. It has not a default value. */\n      pb?: spacingValues;\n      /** Alternative for paddingLeft. PaddingLeft is optional. It has not a default value. */\n      pl?: spacingValues;\n      /** Alternative for paddingRight. PaddingRight is optional. It has not a default value. */\n      pr?: spacingValues;\n      /** Alternative for paddingX. PaddingX is optional. It has not a default value. */\n      px?: spacingValues;\n      /** Alternative for paddingY. PaddingY is optional. It has not a default value. */\n      py?: spacingValues;\n      /**  printHidden is optional. Default value is false. When true, the component is hidden at print. */\n      printHidden?: boolean;\n      /**  printVisible is optional. When block, the component is displayed as block. When inline, the component is displayed as inline.*/\n      printVisible?: 'block' | 'inline';\n      /** Components will be hidden at all screen sizes. */\n      hidden?: boolean;\n      /** Components will be hidden from 'xs' screen size and up. */\n      xsUpHidden?: boolean;\n      /** Components will be hidden from 'sm' screen size and up. */\n      smUpHidden?: boolean;\n      /** Components will be hidden from 'md' screen size and up. */\n      mdUpHidden?: boolean;\n      /** Components will be hidden from 'lg' screen size and up. */\n      lgUpHidden?: boolean;\n      /** Components will be hidden from 'xl' screen size and up. */\n      xlUpHidden?: boolean;\n      /** Components will be hidden between xs and sm screen size. */\n      xsHidden?: boolean;\n      /** Components will be hidden between sm and md screen size. */\n      smHidden?: boolean;\n      /** Components will be hidden between md and lg screen size. */\n      mdHidden?: boolean;\n      /** Components will be hidden between lg and xl screen size. */\n      lgHidden?: boolean;\n      /** Components will be hidden between xl and 2xl screen size. */\n      xlHidden?: boolean;\n      /**  display is optional. It has not a default value. */\n      display?: 'flex' | 'block' | 'none'\n    }\n  >;\n\ntype spacingValues =\n  | 0\n  | 0.5\n  | 1\n  | 1.5\n  | 2\n  | 2.5\n  | 3\n  | 3.5\n  | 4\n  | 5\n  | 6\n  | 7\n  | 8\n  | 9\n  | 10\n  | 11\n  | 12\n  | 14\n  | 16\n  | 20\n  | 24\n  | 28\n  | 32\n  | 36\n  | 40\n  | 44\n  | 48\n  | 52\n  | 56\n  | 60\n  | 64\n  | 72\n  | 80\n  | 96;\n\n/**\n * This is the type used in the type annotation for the component\n */\ntype BaseComponent = <C extends React.ElementType = 'span'>(\n  props: BaseProps<C>\n) => React.ReactNode | null;\n\nexport const Base: BaseComponent = React.forwardRef(function Base<\n  C extends React.ElementType = 'span',\n>(\n  {\n    as,\n    display,\n    margin,\n    marginTop,\n    marginBottom,\n    marginLeft,\n    marginRight,\n    m,\n    mt,\n    mb,\n    ml,\n    mr,\n    mx,\n    my,\n    padding,\n    paddingTop,\n    paddingBottom,\n    paddingLeft,\n    paddingRight,\n    p,\n    pt,\n    pb,\n    pr,\n    pl,\n    px,\n    py,\n    printHidden,\n    printVisible,\n    hidden,\n    xsUpHidden,\n    smUpHidden,\n    mdUpHidden,\n    lgUpHidden,\n    xlUpHidden,\n    xsHidden,\n    smHidden,\n    mdHidden,\n    lgHidden,\n    xlHidden,\n    children,\n    className,\n    ...props\n  }: BaseProps<C>,\n  ref?: PolymorphicRef<C>\n) {\n  const Component = as || 'span';\n\n  return (\n    <Component\n      as={as}\n      className={basePropGenerator({\n        display,\n        margin,\n        marginTop,\n        marginBottom,\n        marginLeft,\n        marginRight,\n        m,\n        mt,\n        mb,\n        ml,\n        mr,\n        mx,\n        my,\n        padding,\n        paddingTop,\n        paddingBottom,\n        paddingLeft,\n        paddingRight,\n        p,\n        pt,\n        pb,\n        pr,\n        pl,\n        px,\n        py,\n        printHidden,\n        printVisible,\n        hidden,\n        xsUpHidden,\n        smUpHidden,\n        mdUpHidden,\n        lgUpHidden,\n        xlUpHidden,\n        xsHidden,\n        smHidden,\n        mdHidden,\n        lgHidden,\n        xlHidden,\n        className,\n      })}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n});\n\nexport default Base;\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,yBAAyB;AA0J3B,MAAM,OAAsB,MAAM,WAAW,SAASA,MAG3D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,YAAY,MAAM;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,kBAAkB;AAAA,QAC3B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACD;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,oBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport { basePropGenerator } from '@digigov/react-core/Base/utils';\n\ntype AsProp<C extends React.ElementType> = {\n  as?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// This is the first reusable type utility we built\ntype PolymorphicComponentProp<\n  C extends React.ElementType,\n  Props = Record<string, unknown>,\n> = React.PropsWithChildren<Props & AsProp<C>> &\n  Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;\n\n// This is a new type utitlity with ref!\ntype PolymorphicComponentPropWithRef<\n  C extends React.ElementType,\n  Props = Record<string, unknown>,\n> = PolymorphicComponentProp<C, Props> & { ref?: any };\n\n// This is the type for the \"ref\" only\ntype PolymorphicRef<C extends React.ElementType> =\n  React.ComponentPropsWithRef<C>['ref'];\n\n/**\n * This is the updated component props using PolymorphicComponentPropWithRef\n */\nexport type BaseProps<C extends React.ElementType> =\n  PolymorphicComponentPropWithRef<\n    C,\n    {\n      /** margin is optional. It has not a default value. */\n      margin?: SpacingValues | SpacingMediaValues;\n      /** marginTop is optional. It has not a default value. */\n      marginTop?: SpacingValues | SpacingMediaValues;\n      /** marginBottom is optional. It has not a default value. */\n      marginBottom?: SpacingValues | SpacingMediaValues;\n      /** marginLeft is optional. It has not a default value. */\n      marginLeft?: SpacingValues | SpacingMediaValues;\n      /** marginRight is optional. It has not a default value. */\n      marginRight?: SpacingValues | SpacingMediaValues;\n      /** Alternative for margin. Margin is optional. It has not a default value. */\n      m?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginTop. MarginTop is optional. It has not a default value. */\n      mt?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginBottom. MarginBottom is optional. It has not a default value. */\n      mb?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginLeft. MarginLeft is optional. It has not a default value. */\n      ml?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginRight. MarginRight is optional. It has not a default value. */\n      mr?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginX. MarginX is optional. It has not a default value. */\n      mx?: SpacingValues | SpacingMediaValues;\n      /** Alternative for marginY. MarginY is optional. It has not a default value. */\n      my?: SpacingValues | SpacingMediaValues;\n      /** padding is optional. It has not a default value. */\n      padding?: SpacingValues | SpacingMediaValues;\n      /** paddingTop is optional. It has not a default value. */\n      paddingTop?: SpacingValues | SpacingMediaValues;\n      /** paddingBottom is optional. It has not a default value. */\n      paddingBottom?: SpacingValues | SpacingMediaValues;\n      /** paddingLeft is optional. It has not a default value. */\n      paddingLeft?: SpacingValues | SpacingMediaValues;\n      /** paddingRight is optional. It has not a default value. */\n      paddingRight?: SpacingValues | SpacingMediaValues;\n      /** Alternative for padding. Padding is optional. It has not a default value. */\n      p?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingTop. PaddingTop is optional. It has not a default value. */\n      pt?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingBottom. PaddingBottom is optional. It has not a default value. */\n      pb?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingLeft. PaddingLeft is optional. It has not a default value. */\n      pl?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingRight. PaddingRight is optional. It has not a default value. */\n      pr?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingX. PaddingX is optional. It has not a default value. */\n      px?: SpacingValues | SpacingMediaValues;\n      /** Alternative for paddingY. PaddingY is optional. It has not a default value. */\n      py?: SpacingValues | SpacingMediaValues;\n      /**  printHidden is optional. Default value is false. When true, the component is hidden at print. */\n      printHidden?: boolean;\n      /**  printVisible is optional. When block, the component is displayed as block. When inline, the component is displayed as inline.*/\n      printVisible?: 'block' | 'inline';\n      /** Components will be hidden at all screen sizes. */\n      hidden?: boolean;\n      /** Components will be hidden from 'xs' screen size and up. */\n      xsUpHidden?: boolean;\n      /** Components will be hidden from 'sm' screen size and up. */\n      smUpHidden?: boolean;\n      /** Components will be hidden from 'md' screen size and up. */\n      mdUpHidden?: boolean;\n      /** Components will be hidden from 'lg' screen size and up. */\n      lgUpHidden?: boolean;\n      /** Components will be hidden from 'xl' screen size and up. */\n      xlUpHidden?: boolean;\n      /** Components will be hidden between xs and sm screen size. */\n      xsHidden?: boolean;\n      /** Components will be hidden between sm and md screen size. */\n      smHidden?: boolean;\n      /** Components will be hidden between md and lg screen size. */\n      mdHidden?: boolean;\n      /** Components will be hidden between lg and xl screen size. */\n      lgHidden?: boolean;\n      /** Components will be hidden between xl and 2xl screen size. */\n      xlHidden?: boolean;\n      /**  display is optional. It has not a default value. */\n      display?: 'flex' | 'block' | 'none'\n    }\n  >;\n\nexport type SpacingValues =\n  | 0\n  | 0.5\n  | 1\n  | 1.5\n  | 2\n  | 2.5\n  | 3\n  | 3.5\n  | 4\n  | 5\n  | 6\n  | 7\n  | 8\n  | 9\n  | 10\n  | 11\n  | 12\n  | 14\n  | 16\n  | 20\n  | 24\n  | 28\n  | 32\n  | 36\n  | 40\n  | 44\n  | 48\n  | 52\n  | 56\n  | 60\n  | 64\n  | 72\n  | 80\n  | 96;\n\nexport type SpacingMediaValues = {\n  xs?: SpacingValues;\n  sm?: SpacingValues;\n  md?: SpacingValues;\n  lg?: SpacingValues;\n  xl?: SpacingValues;\n};\n\n/**\n * This is the type used in the type annotation for the component\n */\ntype BaseComponent = <C extends React.ElementType = 'span'>(\n  props: BaseProps<C>\n) => React.ReactNode | null;\n\nexport const Base: BaseComponent = React.forwardRef(function Base<\n  C extends React.ElementType = 'span',\n>(\n  {\n    as,\n    display,\n    margin,\n    marginTop,\n    marginBottom,\n    marginLeft,\n    marginRight,\n    m,\n    mt,\n    mb,\n    ml,\n    mr,\n    mx,\n    my,\n    padding,\n    paddingTop,\n    paddingBottom,\n    paddingLeft,\n    paddingRight,\n    p,\n    pt,\n    pb,\n    pr,\n    pl,\n    px,\n    py,\n    printHidden,\n    printVisible,\n    hidden,\n    xsUpHidden,\n    smUpHidden,\n    mdUpHidden,\n    lgUpHidden,\n    xlUpHidden,\n    xsHidden,\n    smHidden,\n    mdHidden,\n    lgHidden,\n    xlHidden,\n    children,\n    className,\n    ...props\n  }: BaseProps<C>,\n  ref?: PolymorphicRef<C>\n) {\n  const Component = as || 'span';\n\n  return (\n    <Component\n      as={as}\n      className={basePropGenerator({\n        display,\n        margin,\n        marginTop,\n        marginBottom,\n        marginLeft,\n        marginRight,\n        m,\n        mt,\n        mb,\n        ml,\n        mr,\n        mx,\n        my,\n        padding,\n        paddingTop,\n        paddingBottom,\n        paddingLeft,\n        paddingRight,\n        p,\n        pt,\n        pb,\n        pr,\n        pl,\n        px,\n        py,\n        printHidden,\n        printVisible,\n        hidden,\n        xsUpHidden,\n        smUpHidden,\n        mdUpHidden,\n        lgUpHidden,\n        xlUpHidden,\n        xsHidden,\n        smHidden,\n        mdHidden,\n        lgHidden,\n        xlHidden,\n        className,\n      })}\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n});\n\nexport default Base;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,SAAS,yBAAyB;AAkK3B,MAAM,OAAsB,MAAM,WAAW,SAASA,MAG3D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,YAAY,MAAM;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,kBAAkB;AAAA,QAC3B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAAA,MACD;AAAA,MACC,GAAG;AAAA;AAAA,IAEH;AAAA,EACH;AAEJ,CAAC;AAED,IAAO,oBAAQ;",
   "names": ["Base"]
 }

package/Base/utils/index.js

@@ -1,4 +1,20 @@
 import clsx from "clsx";
+const generateSpacingClasses = (prefix, spacing) => {
+  if (typeof spacing === "object") {
+    return {
+      [`${prefix}-xs-${spacing?.xs}`]: spacing?.xs !== void 0,
+      [`${prefix}-sm-${spacing?.sm}`]: spacing?.sm !== void 0,
+      [`${prefix}-md-${spacing?.md}`]: spacing?.md !== void 0,
+      [`${prefix}-lg-${spacing?.lg}`]: spacing?.lg !== void 0,
+      [`${prefix}-xl-${spacing?.xl}`]: spacing?.xl !== void 0
+    };
+  } else if (spacing !== void 0) {
+    return {
+      [`${prefix}-${spacing}`]: true
+    };
+  }
+  return {};
+};
 const basePropGenerator = ({
   display,
   margin,
@@ -39,47 +55,39 @@ const basePropGenerator = ({
   lgHidden,
   xlHidden,
   className
-}) => clsx(className, {
-  [`ds-display-${display}`]: display !== void 0 ? true : void 0,
-  [`ds-m-${margin}`]: margin !== void 0 ? true : void 0,
-  [`ds-mt-${marginTop}`]: marginTop !== void 0 ? true : void 0,
-  [`ds-mb-${marginBottom}`]: marginBottom !== void 0 ? true : void 0,
-  [`ds-mr-${marginRight}`]: marginRight !== void 0 ? true : void 0,
-  [`ds-ml-${marginLeft}`]: marginLeft !== void 0 ? true : void 0,
-  [`ds-m-${m}`]: m !== void 0 ? true : void 0,
-  [`ds-mt-${mt}`]: mt !== void 0 ? true : void 0,
-  [`ds-mb-${mb}`]: mb !== void 0 ? true : void 0,
-  [`ds-mr-${mr}`]: mr !== void 0 ? true : void 0,
-  [`ds-ml-${ml}`]: ml !== void 0 ? true : void 0,
-  [`ds-mx-${mx}`]: mx !== void 0 ? true : void 0,
-  [`ds-my-${my}`]: my !== void 0 ? true : void 0,
-  [`ds-p-${padding}`]: padding !== void 0 ? true : void 0,
-  [`ds-pt-${paddingTop}`]: paddingTop !== void 0 ? true : void 0,
-  [`ds-pb-${paddingBottom}`]: paddingBottom !== void 0 ? true : void 0,
-  [`ds-pr-${paddingRight}`]: paddingRight !== void 0 ? true : void 0,
-  [`ds-pl-${paddingLeft}`]: paddingLeft !== void 0 ? true : void 0,
-  [`ds-p-${p}`]: p !== void 0 ? true : void 0,
-  [`ds-pt-${pt}`]: pt !== void 0 ? true : void 0,
-  [`ds-pb-${pb}`]: pb !== void 0 ? true : void 0,
-  [`ds-pr-${pr}`]: pr !== void 0 ? true : void 0,
-  [`ds-pl-${pl}`]: pl !== void 0 ? true : void 0,
-  [`ds-px-${px}`]: px !== void 0 ? true : void 0,
-  [`ds-py-${py}`]: py !== void 0 ? true : void 0,
-  "ds-print-hidden": !!printHidden,
-  "ds-print-visible-block": printVisible === "block",
-  "ds-print-visible-inline": printVisible === "inline",
-  "ds-hidden": !!hidden,
-  "ds-hidden-xs-up": !!xsUpHidden,
-  "ds-hidden-sm-up": !!smUpHidden,
-  "ds-hidden-md-up": !!mdUpHidden,
-  "ds-hidden-lg-up": !!lgUpHidden,
-  "ds-hidden-xl-up": !!xlUpHidden,
-  "ds-hidden-xs": !!xsHidden,
-  "ds-hidden-sm": !!smHidden,
-  "ds-hidden-md": !!mdHidden,
-  "ds-hidden-lg": !!lgHidden,
-  "ds-hidden-xl": !!xlHidden
-});
+}) => {
+  return clsx(className, {
+    [`ds-display-${display}`]: display !== void 0,
+    ...generateSpacingClasses("ds-m", m ?? margin),
+    ...generateSpacingClasses("ds-mt", mt ?? marginTop),
+    ...generateSpacingClasses("ds-mb", mb ?? marginBottom),
+    ...generateSpacingClasses("ds-mr", mr ?? marginRight),
+    ...generateSpacingClasses("ds-ml", ml ?? marginLeft),
+    ...generateSpacingClasses("ds-mx", mx),
+    ...generateSpacingClasses("ds-my", my),
+    ...generateSpacingClasses("ds-p", p ?? padding),
+    ...generateSpacingClasses("ds-pt", pt ?? paddingTop),
+    ...generateSpacingClasses("ds-pb", pb ?? paddingBottom),
+    ...generateSpacingClasses("ds-pr", pr ?? paddingRight),
+    ...generateSpacingClasses("ds-pl", pl ?? paddingLeft),
+    ...generateSpacingClasses("ds-px", px),
+    ...generateSpacingClasses("ds-py", py),
+    "ds-print-hidden": !!printHidden,
+    "ds-print-visible-block": printVisible === "block",
+    "ds-print-visible-inline": printVisible === "inline",
+    "ds-hidden": !!hidden,
+    "ds-hidden-xs-up": !!xsUpHidden,
+    "ds-hidden-sm-up": !!smUpHidden,
+    "ds-hidden-md-up": !!mdUpHidden,
+    "ds-hidden-lg-up": !!lgUpHidden,
+    "ds-hidden-xl-up": !!xlUpHidden,
+    "ds-hidden-xs": !!xsHidden,
+    "ds-hidden-sm": !!smHidden,
+    "ds-hidden-md": !!mdHidden,
+    "ds-hidden-lg": !!lgHidden,
+    "ds-hidden-xl": !!xlHidden
+  });
+};
 export {
   basePropGenerator
 };

package/Base/utils.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Base/utils.ts"],
-  "sourcesContent": ["import clsx from 'clsx';\n\nexport const basePropGenerator = ({\n  display,\n  margin,\n  marginTop,\n  marginBottom,\n  marginLeft,\n  marginRight,\n  m,\n  mt,\n  mb,\n  ml,\n  mr,\n  mx,\n  my,\n  padding,\n  paddingTop,\n  paddingBottom,\n  paddingLeft,\n  paddingRight,\n  p,\n  pt,\n  pb,\n  pr,\n  pl,\n  px,\n  py,\n  printHidden,\n  printVisible,\n  hidden,\n  xsUpHidden,\n  smUpHidden,\n  mdUpHidden,\n  lgUpHidden,\n  xlUpHidden,\n  xsHidden,\n  smHidden,\n  mdHidden,\n  lgHidden,\n  xlHidden,\n  className,\n}) =>\n  clsx(className, {\n    [`ds-display-${display}`]: display !== undefined ? true : undefined,\n    [`ds-m-${margin}`]: margin !== undefined ? true : undefined,\n    [`ds-mt-${marginTop}`]: marginTop !== undefined ? true : undefined,\n    [`ds-mb-${marginBottom}`]: marginBottom !== undefined ? true : undefined,\n    [`ds-mr-${marginRight}`]: marginRight !== undefined ? true : undefined,\n    [`ds-ml-${marginLeft}`]: marginLeft !== undefined ? true : undefined,\n    [`ds-m-${m}`]: m !== undefined ? true : undefined,\n    [`ds-mt-${mt}`]: mt !== undefined ? true : undefined,\n    [`ds-mb-${mb}`]: mb !== undefined ? true : undefined,\n    [`ds-mr-${mr}`]: mr !== undefined ? true : undefined,\n    [`ds-ml-${ml}`]: ml !== undefined ? true : undefined,\n    [`ds-mx-${mx}`]: mx !== undefined ? true : undefined,\n    [`ds-my-${my}`]: my !== undefined ? true : undefined,\n    [`ds-p-${padding}`]: padding !== undefined ? true : undefined,\n    [`ds-pt-${paddingTop}`]: paddingTop !== undefined ? true : undefined,\n    [`ds-pb-${paddingBottom}`]: paddingBottom !== undefined ? true : undefined,\n    [`ds-pr-${paddingRight}`]: paddingRight !== undefined ? true : undefined,\n    [`ds-pl-${paddingLeft}`]: paddingLeft !== undefined ? true : undefined,\n    [`ds-p-${p}`]: p !== undefined ? true : undefined,\n    [`ds-pt-${pt}`]: pt !== undefined ? true : undefined,\n    [`ds-pb-${pb}`]: pb !== undefined ? true : undefined,\n    [`ds-pr-${pr}`]: pr !== undefined ? true : undefined,\n    [`ds-pl-${pl}`]: pl !== undefined ? true : undefined,\n    [`ds-px-${px}`]: px !== undefined ? true : undefined,\n    [`ds-py-${py}`]: py !== undefined ? true : undefined,\n    'ds-print-hidden': !!printHidden,\n    'ds-print-visible-block': printVisible === 'block',\n    'ds-print-visible-inline': printVisible === 'inline',\n    'ds-hidden': !!hidden,\n    'ds-hidden-xs-up': !!xsUpHidden,\n    'ds-hidden-sm-up': !!smUpHidden,\n    'ds-hidden-md-up': !!mdUpHidden,\n    'ds-hidden-lg-up': !!lgUpHidden,\n    'ds-hidden-xl-up': !!xlUpHidden,\n    'ds-hidden-xs': !!xsHidden,\n    'ds-hidden-sm': !!smHidden,\n    'ds-hidden-md': !!mdHidden,\n    'ds-hidden-lg': !!lgHidden,\n    'ds-hidden-xl': !!xlHidden,\n  });\n"],
-  "mappings": "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",
+  "sourcesContent": ["import clsx from 'clsx';\n\n// Helper function to handle both SpacingValues and SpacingMediaValues\nconst generateSpacingClasses = (prefix, spacing) => {\n  if (typeof spacing === 'object') {\n    // It's a SpacingMediaValues (media-specific)\n    return {\n      [`${prefix}-xs-${spacing?.xs}`]: spacing?.xs !== undefined,\n      [`${prefix}-sm-${spacing?.sm}`]: spacing?.sm !== undefined,\n      [`${prefix}-md-${spacing?.md}`]: spacing?.md !== undefined,\n      [`${prefix}-lg-${spacing?.lg}`]: spacing?.lg !== undefined,\n      [`${prefix}-xl-${spacing?.xl}`]: spacing?.xl !== undefined,\n    };\n  } else if (spacing !== undefined) {\n    // It's a regular SpacingValues\n    return {\n      [`${prefix}-${spacing}`]: true,\n    };\n  }\n  return {};\n};\n\nexport const basePropGenerator = ({\n  display,\n  margin,\n  marginTop,\n  marginBottom,\n  marginLeft,\n  marginRight,\n  m,\n  mt,\n  mb,\n  ml,\n  mr,\n  mx,\n  my,\n  padding,\n  paddingTop,\n  paddingBottom,\n  paddingLeft,\n  paddingRight,\n  p,\n  pt,\n  pb,\n  pr,\n  pl,\n  px,\n  py,\n  printHidden,\n  printVisible,\n  hidden,\n  xsUpHidden,\n  smUpHidden,\n  mdUpHidden,\n  lgUpHidden,\n  xlUpHidden,\n  xsHidden,\n  smHidden,\n  mdHidden,\n  lgHidden,\n  xlHidden,\n  className,\n}) => {\n  return clsx(className, {\n    [`ds-display-${display}`]: display !== undefined,\n    ...generateSpacingClasses('ds-m', m ?? margin),\n    ...generateSpacingClasses('ds-mt', mt ?? marginTop),\n    ...generateSpacingClasses('ds-mb', mb ?? marginBottom),\n    ...generateSpacingClasses('ds-mr', mr ?? marginRight),\n    ...generateSpacingClasses('ds-ml', ml ?? marginLeft),\n    ...generateSpacingClasses('ds-mx', mx),\n    ...generateSpacingClasses('ds-my', my),\n    ...generateSpacingClasses('ds-p', p ?? padding),\n    ...generateSpacingClasses('ds-pt', pt ?? paddingTop),\n    ...generateSpacingClasses('ds-pb', pb ?? paddingBottom),\n    ...generateSpacingClasses('ds-pr', pr ?? paddingRight),\n    ...generateSpacingClasses('ds-pl', pl ?? paddingLeft),\n    ...generateSpacingClasses('ds-px', px),\n    ...generateSpacingClasses('ds-py', py),\n    'ds-print-hidden': !!printHidden,\n    'ds-print-visible-block': printVisible === 'block',\n    'ds-print-visible-inline': printVisible === 'inline',\n    'ds-hidden': !!hidden,\n    'ds-hidden-xs-up': !!xsUpHidden,\n    'ds-hidden-sm-up': !!smUpHidden,\n    'ds-hidden-md-up': !!mdUpHidden,\n    'ds-hidden-lg-up': !!lgUpHidden,\n    'ds-hidden-xl-up': !!xlUpHidden,\n    'ds-hidden-xs': !!xsHidden,\n    'ds-hidden-sm': !!smHidden,\n    'ds-hidden-md': !!mdHidden,\n    'ds-hidden-lg': !!lgHidden,\n    'ds-hidden-xl': !!xlHidden,\n  });\n};\n"],
+  "mappings": "AAAA,OAAO,UAAU;AAGjB,MAAM,yBAAyB,CAAC,QAAQ,YAAY;AAClD,MAAI,OAAO,YAAY,UAAU;AAE/B,WAAO;AAAA,MACL,CAAC,GAAG,MAAM,OAAO,SAAS,EAAE,EAAE,GAAG,SAAS,OAAO;AAAA,MACjD,CAAC,GAAG,MAAM,OAAO,SAAS,EAAE,EAAE,GAAG,SAAS,OAAO;AAAA,MACjD,CAAC,GAAG,MAAM,OAAO,SAAS,EAAE,EAAE,GAAG,SAAS,OAAO;AAAA,MACjD,CAAC,GAAG,MAAM,OAAO,SAAS,EAAE,EAAE,GAAG,SAAS,OAAO;AAAA,MACjD,CAAC,GAAG,MAAM,OAAO,SAAS,EAAE,EAAE,GAAG,SAAS,OAAO;AAAA,IACnD;AAAA,EACF,WAAW,YAAY,QAAW;AAEhC,WAAO;AAAA,MACL,CAAC,GAAG,MAAM,IAAI,OAAO,EAAE,GAAG;AAAA,IAC5B;AAAA,EACF;AACA,SAAO,CAAC;AACV;AAEO,MAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,SAAO,KAAK,WAAW;AAAA,IACrB,CAAC,cAAc,OAAO,EAAE,GAAG,YAAY;AAAA,IACvC,GAAG,uBAAuB,QAAQ,KAAK,MAAM;AAAA,IAC7C,GAAG,uBAAuB,SAAS,MAAM,SAAS;AAAA,IAClD,GAAG,uBAAuB,SAAS,MAAM,YAAY;AAAA,IACrD,GAAG,uBAAuB,SAAS,MAAM,WAAW;AAAA,IACpD,GAAG,uBAAuB,SAAS,MAAM,UAAU;AAAA,IACnD,GAAG,uBAAuB,SAAS,EAAE;AAAA,IACrC,GAAG,uBAAuB,SAAS,EAAE;AAAA,IACrC,GAAG,uBAAuB,QAAQ,KAAK,OAAO;AAAA,IAC9C,GAAG,uBAAuB,SAAS,MAAM,UAAU;AAAA,IACnD,GAAG,uBAAuB,SAAS,MAAM,aAAa;AAAA,IACtD,GAAG,uBAAuB,SAAS,MAAM,YAAY;AAAA,IACrD,GAAG,uBAAuB,SAAS,MAAM,WAAW;AAAA,IACpD,GAAG,uBAAuB,SAAS,EAAE;AAAA,IACrC,GAAG,uBAAuB,SAAS,EAAE;AAAA,IACrC,mBAAmB,CAAC,CAAC;AAAA,IACrB,0BAA0B,iBAAiB;AAAA,IAC3C,2BAA2B,iBAAiB;AAAA,IAC5C,aAAa,CAAC,CAAC;AAAA,IACf,mBAAmB,CAAC,CAAC;AAAA,IACrB,mBAAmB,CAAC,CAAC;AAAA,IACrB,mBAAmB,CAAC,CAAC;AAAA,IACrB,mBAAmB,CAAC,CAAC;AAAA,IACrB,mBAAmB,CAAC,CAAC;AAAA,IACrB,gBAAgB,CAAC,CAAC;AAAA,IAClB,gBAAgB,CAAC,CAAC;AAAA,IAClB,gBAAgB,CAAC,CAAC;AAAA,IAClB,gBAAgB,CAAC,CAAC;AAAA,IAClB,gBAAgB,CAAC,CAAC;AAAA,EACpB,CAAC;AACH;",
   "names": []
 }

package/ModalContainer/index.js

@@ -14,13 +14,7 @@ const ModalContainer = React.forwardRef(function ModalContainer2({ className, ga
       }),
       ...props
     },
-    /* @__PURE__ */ React.createElement("div", { className: "ds-modal__body" }, gaps ? /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        className: "ds-modal__container"
-      },
-      children
-    ) : children)
+    /* @__PURE__ */ React.createElement(Base, { as: "div", className: "ds-modal__body" }, gaps ? /* @__PURE__ */ React.createElement(Base, { as: "div", className: "ds-modal__container" }, children) : children)
   );
 });
 var ModalContainer_default = ModalContainer;

package/ModalContainer/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/ModalContainer/index.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface ModalContainerProps extends BaseProps<'div'> {\n  /**\n   * @value true\n   * @value false\n   */\n  open?: boolean;\n  /**\n   * dense is optional.\n   * @value true ModalContainer and its children will be dense.\n   * @value false\n   * @default false\n   */\n  dense?: boolean;\n  /**\n   * gaps is optional.\n   * @value false there will be no extra gaps among children components.\n   * @value true\n   * @default true\n   */\n  gaps?: boolean;\n}\n/**\n * Modals can be used to open a pop-up dialog box and provide critical information\n * or ask for a decision. Modals disable all app functionality when they appear, and\n * remain on screen until confirmed, dismissed, or a required action has been taken\n * Use Modal as parent component to wrap ModalHeading, ModalText and ModalAction components\n */\nexport const ModalContainer = React.forwardRef<\n  HTMLDivElement,\n  ModalContainerProps\n>(function ModalContainer({ className, gaps = true, children, open, dense, ...props }, ref) {\n  return (\n    <Base\n      ref={ref}\n      as=\"div\"\n      className={clsx(className, {\n        'ds-modal': true,\n        'ds-modal--open': open,\n        'ds-modal--dense': dense,\n      })}\n      {...props}\n    >\n      <div className='ds-modal__body'>\n        {gaps ?\n          <div\n            className='ds-modal__container'\n          >\n            {children}\n          </div>\n          :\n          children}\n      </div>\n    </Base>\n  );\n});\n\nexport default ModalContainer;\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,UAAyB;AA6BzB,MAAM,iBAAiB,MAAM,WAGlC,SAASA,gBAAe,EAAE,WAAW,OAAO,MAAM,UAAU,MAAM,OAAO,GAAG,MAAM,GAAG,KAAK;AAC1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAG;AAAA,MACH,WAAW,KAAK,WAAW;AAAA,QACzB,YAAY;AAAA,QACZ,kBAAkB;AAAA,QAClB,mBAAmB;AAAA,MACrB,CAAC;AAAA,MACA,GAAG;AAAA;AAAA,IAEJ,oCAAC,SAAI,WAAU,oBACZ,OACC;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA;AAAA,MAET;AAAA,IACH,IAEA,QACJ;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,yBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface ModalContainerProps extends BaseProps<'div'> {\n  /**\n   * @value true\n   * @value false\n   */\n  open?: boolean;\n  /**\n   * dense is optional.\n   * @value true ModalContainer and its children will be dense.\n   * @value false\n   * @default false\n   */\n  dense?: boolean;\n  /**\n   * gaps is optional.\n   * @value false there will be no extra gaps among children components.\n   * @value true\n   * @default true\n   */\n  gaps?: boolean;\n}\n/**\n * Modals can be used to open a pop-up dialog box and provide critical information\n * or ask for a decision. Modals disable all app functionality when they appear, and\n * remain on screen until confirmed, dismissed, or a required action has been taken\n * Use Modal as parent component to wrap ModalHeading, ModalText and ModalAction components\n */\nexport const ModalContainer = React.forwardRef<\n  HTMLDivElement,\n  ModalContainerProps\n>(function ModalContainer(\n  { className, gaps = true, children, open, dense, ...props },\n  ref\n) {\n  return (\n    <Base\n      ref={ref}\n      as=\"div\"\n      className={clsx(className, {\n        'ds-modal': true,\n        'ds-modal--open': open,\n        'ds-modal--dense': dense,\n      })}\n      {...props}\n    >\n      <Base as=\"div\" className=\"ds-modal__body\">\n        {gaps ? (\n          <Base as=\"div\" className=\"ds-modal__container\">\n            {children}\n          </Base>\n        ) : (\n          children\n        )}\n      </Base>\n    </Base>\n  );\n});\n\nexport default ModalContainer;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,UAAyB;AA6BzB,MAAM,iBAAiB,MAAM,WAGlC,SAASA,gBACT,EAAE,WAAW,OAAO,MAAM,UAAU,MAAM,OAAO,GAAG,MAAM,GAC1D,KACA;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAG;AAAA,MACH,WAAW,KAAK,WAAW;AAAA,QACzB,YAAY;AAAA,QACZ,kBAAkB;AAAA,QAClB,mBAAmB;AAAA,MACrB,CAAC;AAAA,MACA,GAAG;AAAA;AAAA,IAEJ,oCAAC,QAAK,IAAG,OAAM,WAAU,oBACtB,OACC,oCAAC,QAAK,IAAG,OAAM,WAAU,yBACtB,QACH,IAEA,QAEJ;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,yBAAQ;",
   "names": ["ModalContainer"]
 }

package/Stack/index.d.ts

@@ -20,12 +20,20 @@ export interface StackProps extends BaseProps<'div'> {
     /**
      * spacing is optional. Set to the number you want the space to be.
      */
-    spacing?: 1 | 2 | 4 | 6 | 8 | 10 | 12;
+    spacing?: SpacingValues | SpacingMediaValues;
     /**
      * flexWrap is optional. The default value is 'wrap'.
      */
     flexWrap?: 'wrap' | 'nowrap';
 }
+type SpacingValues = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 11 | 12;
+type SpacingMediaValues = {
+    xs?: SpacingValues;
+    sm?: SpacingValues;
+    md?: SpacingValues;
+    lg?: SpacingValues;
+    xl?: SpacingValues;
+};
 /**
  * ...
  */

package/Stack/index.js

@@ -25,7 +25,12 @@ const Stack = React.forwardRef(
           [`ds-stack--align-${alignItems}`]: alignItems,
           [`ds-stack--content-${alignContent}`]: alignContent,
           "ds-stack--nowrap": flexWrap === "nowrap",
-          [`ds-gap-${spacing}`]: spacing !== void 0
+          [`ds-gap-${spacing}`]: spacing !== void 0,
+          [`ds-gap-xs-${spacing?.xs}`]: spacing?.xs !== void 0,
+          [`ds-gap-sm-${spacing?.sm}`]: spacing?.sm !== void 0,
+          [`ds-gap-md-${spacing?.md}`]: spacing?.md !== void 0,
+          [`ds-gap-lg-${spacing?.lg}`]: spacing?.lg !== void 0,
+          [`ds-gap-xl-${spacing?.xl}`]: spacing?.xl !== void 0
         }),
         ...props
       },

package/Stack/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/Stack/index.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface StackProps extends BaseProps<'div'> {\n  /**\n   * direction is optional. Set to control the direction of flex items.\n   */\n  direction?: 'row' | 'row-reverse' | 'column' | 'column-reverse';\n  /**\n   * justifyContent is optional. Set to control how items are positioned along Stack's main axis .\n   */\n  justifyContent?:\n  | 'flex-start'\n  | 'flex-end'\n  | 'center'\n  | 'space-between'\n  | 'space-around'\n  | 'space-evenly';\n  /**\n   * alignItems is optional. Set to control how items are positioned along Stack's cross axis.\n   */\n  alignItems?: 'stretch' | 'flex-start' | 'flex-end' | 'center' | 'baseline';\n  /**\n   * alignContent is optional. Set to control how rows are positioned in multi-row Stack container.\n   */\n  alignContent?:\n  | 'flex-start'\n  | 'flex-end'\n  | 'center'\n  | 'space-between'\n  | 'space-around'\n  | 'space-evenly';\n  /**\n   * spacing is optional. Set to the number you want the space to be.\n   */\n  spacing?: 1 | 2 | 4 | 6 | 8 | 10 | 12;\n  /**\n   * flexWrap is optional. The default value is 'wrap'.\n   */\n  flexWrap?: 'wrap' | 'nowrap';\n}\n/**\n * ...\n */\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(\n  function Stack(\n    {\n      direction = 'column',\n      justifyContent,\n      alignItems,\n      alignContent,\n      spacing,\n      flexWrap,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <Base\n        as=\"div\"\n        ref={ref}\n        className={clsx(className, {\n          'ds-stack': true,\n          [`ds-stack--${direction}`]: direction,\n          [`ds-stack--justify-${justifyContent}`]: justifyContent,\n          [`ds-stack--align-${alignItems}`]: alignItems,\n          [`ds-stack--content-${alignContent}`]: alignContent,\n          'ds-stack--nowrap': flexWrap === 'nowrap',\n          [`ds-gap-${spacing}`]: spacing !== undefined,\n        })}\n        {...props}\n      >\n        {children}\n      </Base>\n    );\n  }\n);\n\nexport default Stack;\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,UAAyB;AA2CzB,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OACP;AAAA,IACE,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,KACA;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH;AAAA,QACA,WAAW,KAAK,WAAW;AAAA,UACzB,YAAY;AAAA,UACZ,CAAC,aAAa,SAAS,EAAE,GAAG;AAAA,UAC5B,CAAC,qBAAqB,cAAc,EAAE,GAAG;AAAA,UACzC,CAAC,mBAAmB,UAAU,EAAE,GAAG;AAAA,UACnC,CAAC,qBAAqB,YAAY,EAAE,GAAG;AAAA,UACvC,oBAAoB,aAAa;AAAA,UACjC,CAAC,UAAU,OAAO,EAAE,GAAG,YAAY;AAAA,QACrC,CAAC;AAAA,QACA,GAAG;AAAA;AAAA,MAEH;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAO,gBAAQ;",
+  "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface StackProps extends BaseProps<'div'> {\n  /**\n   * direction is optional. Set to control the direction of flex items.\n   */\n  direction?: 'row' | 'row-reverse' | 'column' | 'column-reverse';\n  /**\n   * justifyContent is optional. Set to control how items are positioned along Stack's main axis .\n   */\n  justifyContent?:\n    | 'flex-start'\n    | 'flex-end'\n    | 'center'\n    | 'space-between'\n    | 'space-around'\n    | 'space-evenly';\n  /**\n   * alignItems is optional. Set to control how items are positioned along Stack's cross axis.\n   */\n  alignItems?: 'stretch' | 'flex-start' | 'flex-end' | 'center' | 'baseline';\n  /**\n   * alignContent is optional. Set to control how rows are positioned in multi-row Stack container.\n   */\n  alignContent?:\n    | 'flex-start'\n    | 'flex-end'\n    | 'center'\n    | 'space-between'\n    | 'space-around'\n    | 'space-evenly';\n  /**\n   * spacing is optional. Set to the number you want the space to be.\n   */\n  spacing?: SpacingValues | SpacingMediaValues;\n  /**\n   * flexWrap is optional. The default value is 'wrap'.\n   */\n  flexWrap?: 'wrap' | 'nowrap';\n}\n\ntype SpacingValues = 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 11 | 12;\ntype SpacingMediaValues = {\n  xs?: SpacingValues;\n  sm?: SpacingValues;\n  md?: SpacingValues;\n  lg?: SpacingValues;\n  xl?: SpacingValues;\n};\n/**\n * ...\n */\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(\n  function Stack(\n    {\n      direction = 'column',\n      justifyContent,\n      alignItems,\n      alignContent,\n      spacing,\n      flexWrap,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <Base\n        as=\"div\"\n        ref={ref}\n        className={clsx(className, {\n          'ds-stack': true,\n          [`ds-stack--${direction}`]: direction,\n          [`ds-stack--justify-${justifyContent}`]: justifyContent,\n          [`ds-stack--align-${alignItems}`]: alignItems,\n          [`ds-stack--content-${alignContent}`]: alignContent,\n          'ds-stack--nowrap': flexWrap === 'nowrap',\n          [`ds-gap-${spacing}`]: spacing !== undefined,\n          [`ds-gap-xs-${(spacing as SpacingMediaValues)?.xs}`]:\n            (spacing as SpacingMediaValues)?.xs !== undefined,\n          [`ds-gap-sm-${(spacing as SpacingMediaValues)?.sm}`]:\n            (spacing as SpacingMediaValues)?.sm !== undefined,\n          [`ds-gap-md-${(spacing as SpacingMediaValues)?.md}`]:\n            (spacing as SpacingMediaValues)?.md !== undefined,\n          [`ds-gap-lg-${(spacing as SpacingMediaValues)?.lg}`]:\n            (spacing as SpacingMediaValues)?.lg !== undefined,\n          [`ds-gap-xl-${(spacing as SpacingMediaValues)?.xl}`]:\n            (spacing as SpacingMediaValues)?.xl !== undefined,\n        })}\n        {...props}\n      >\n        {children}\n      </Base>\n    );\n  }\n);\n\nexport default Stack;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,UAAyB;AAoDzB,MAAM,QAAQ,MAAM;AAAA,EACzB,SAASA,OACP;AAAA,IACE,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,KACA;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH;AAAA,QACA,WAAW,KAAK,WAAW;AAAA,UACzB,YAAY;AAAA,UACZ,CAAC,aAAa,SAAS,EAAE,GAAG;AAAA,UAC5B,CAAC,qBAAqB,cAAc,EAAE,GAAG;AAAA,UACzC,CAAC,mBAAmB,UAAU,EAAE,GAAG;AAAA,UACnC,CAAC,qBAAqB,YAAY,EAAE,GAAG;AAAA,UACvC,oBAAoB,aAAa;AAAA,UACjC,CAAC,UAAU,OAAO,EAAE,GAAG,YAAY;AAAA,UACnC,CAAC,aAAc,SAAgC,EAAE,EAAE,GAChD,SAAgC,OAAO;AAAA,UAC1C,CAAC,aAAc,SAAgC,EAAE,EAAE,GAChD,SAAgC,OAAO;AAAA,UAC1C,CAAC,aAAc,SAAgC,EAAE,EAAE,GAChD,SAAgC,OAAO;AAAA,UAC1C,CAAC,aAAc,SAAgC,EAAE,EAAE,GAChD,SAAgC,OAAO;AAAA,UAC1C,CAAC,aAAc,SAAgC,EAAE,EAAE,GAChD,SAAgC,OAAO;AAAA,QAC5C,CAAC;AAAA,QACA,GAAG;AAAA;AAAA,MAEH;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAO,gBAAQ;",
   "names": ["Stack"]
 }