@digigov/ui 2.0.0-8e254888 → 2.0.0-a32ad9b2

package/src/utils/Base/doc.mdx

@@ -3,11 +3,64 @@ id: base
 title: Base
 ---
 
-Base component is the `parent` component from which all `digigov` components inherit 
+# Base
 
+Base component is the `parent` component from which all `digigov` components inherit
 
 ## API
 
-See below for a complete reference to all of the props  available to the components mentioned here.
+See below for a complete reference to all of the props available to the components mentioned here.
 
-<ComponentProps componentName={["Base"]} /> 
+The type `SpacingValues` is used to define the spacing values in the `Base` component. It is a union type that includes various numeric values representing spacing units.
+
+```
+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;
+```
+
+The interface `SpacingMediaValues` use the `SpacingValues` type to define the spacing values for different media queries.
+
+```
+export interface SpacingMediaValues {
+  xs?: SpacingValues;
+  sm?: SpacingValues;
+  md?: SpacingValues;
+  lg?: SpacingValues;
+  xl?: SpacingValues;
+}
+```
+
+<ComponentProps componentName={['Base']} />{' '}

package/src/utils/VisuallyHidden/index.test.tsx

@@ -14,6 +14,10 @@ test('renders the All VisuallyHidden variants', async ({ mount, page }) => {
   )
   await page.evaluate(() => document.fonts.ready);
 
+  // Move the mouse to the top-left corner to avoid random hover issues
+  await page.mouse.move(0, 0);
+
+
   const screenshot = await page.screenshot({ fullPage: true, animations: 'disabled' });
   expect(screenshot).toMatchSnapshot();
 });

package/src/utils/hooks/useDebounce.ts

@@ -7,7 +7,7 @@ export const useDebounceCallback = <CallbackArgs extends any[]>(
   leading = false
 ): ((...args: CallbackArgs) => void) => {
   const storedCallback = useLatest(callback);
-  const timeout = React.useRef<ReturnType<typeof setTimeout>>();
+  const timeout = React.useRef<ReturnType<typeof setTimeout>>(undefined);
   const deps = [wait, leading, storedCallback];
   // Cleans up pending timeouts when the deps change
   React.useEffect(

package/typography/CodeBlock/index.d.ts

@@ -8,7 +8,7 @@ export interface CodeBlockProps extends BaseProps<'div'> {
     phaseBannerTagName?: string;
     highlightLines?: number[];
 }
-export declare const CodeBlock: React.FC<CodeBlockProps>;
+export declare const CodeBlock: React.ForwardRefExoticComponent<Omit<CodeBlockProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export * from '@digigov/react-core/CodeBlockContent';
 export * from '@digigov/react-core/CodeBlockHeader';
 export * from '@digigov/react-core/CodeBlockContainer';

package/typography/CodeBlock/index.js

@@ -36,9 +36,8 @@ const CodeBlock = React.forwardRef(
     showLineNumbers,
     phaseBannerTagName,
     highlightLines,
-    ref,
     ...props
-  }) {
+  }, ref) {
     const Tag = "span";
     const codeString = typeof children === "string" ? children : "";
     let displayingCode = codeString;

package/typography/CodeBlock/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/typography/CodeBlock/index.tsx"],
-  "sourcesContent": ["import React from 'react';\n\nimport hljs from 'highlight.js/lib/core';\nimport bash from 'highlight.js/lib/languages/bash';\nimport js from 'highlight.js/lib/languages/javascript';\nimport json from 'highlight.js/lib/languages/json';\nimport markdown from 'highlight.js/lib/languages/markdown';\nimport python from 'highlight.js/lib/languages/python';\nimport xml from 'highlight.js/lib/languages/xml';\nimport { BaseProps } from '@digigov/react-core/Base';\nimport CodeBlockContainer from '@digigov/react-core/CodeBlockContainer';\nimport CodeBlockContent from '@digigov/react-core/CodeBlockContent';\nimport CodeBlockHeader from '@digigov/react-core/CodeBlockHeader';\nimport { CopyToClipboard } from '@digigov/ui/feedback';\nimport { PhaseBannerTag } from '@digigov/ui/feedback/PhaseBanner';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport interface CodeBlockProps extends BaseProps<'div'> {\n  language?: 'javascript' | 'bash' | 'xml' | 'python' | 'markdown' | 'json';\n  copyToClipboard?: boolean;\n  highlighted?: boolean;\n  showLineNumbers?: boolean;\n  phaseBannerTagName?: string;\n  highlightLines?: number[];\n}\n\nconst languageMap = {\n  javascript: js,\n  python: python,\n  bash: bash,\n  xml: xml,\n  markdown: markdown,\n  json: json,\n};\n\nconst addLineNumbers = (code: string, highlightLines: number[]): string => {\n  return code\n    .split('\\n')\n    .map((line, index) => {\n      const isHighlighted = highlightLines.includes(index + 1);\n      const lineClass = isHighlighted ? 'ds-code--highlighted-line' : '';\n      return `<span class=\"ds-code--line-number\">${index + 1}</span> <span class=\"${lineClass}\">${line}</span>`;\n    })\n    .join('\\n');\n};\n\nexport const CodeBlock: React.FC<CodeBlockProps> = React.forwardRef(\n  function CodeBlock({\n    children,\n    language,\n    copyToClipboard,\n    highlighted,\n    showLineNumbers,\n    phaseBannerTagName,\n    highlightLines,\n    ref,\n    ...props\n  }) {\n    const Tag = 'span';\n    const codeString = typeof children === 'string' ? children : '';\n    let displayingCode = codeString;\n\n    if (highlighted && codeString) {\n      try {\n        hljs.configure({ classPrefix: 'ds-code--' });\n        let highlightedCode = hljs.highlightAuto(codeString).value;\n        if (language) {\n          hljs.registerLanguage(language, languageMap[language]);\n          highlightedCode = hljs.highlight(codeString, {\n            language: language,\n          }).value;\n        }\n        displayingCode = showLineNumbers\n          ? addLineNumbers(highlightedCode, highlightLines || [])\n          : highlightedCode;\n      } catch (error) {\n        console.error('Highlighting failed:', error);\n      }\n    }\n\n    return (\n      <CodeBlockContainer ref={ref} {...props}>\n        <CodeBlockHeader\n          justify={\n            phaseBannerTagName && copyToClipboard ? 'space-between' : 'end'\n          }\n        >\n          {phaseBannerTagName && (\n            <PhaseBannerTag>{phaseBannerTagName}</PhaseBannerTag>\n          )}\n          {copyToClipboard && (\n            <CopyToClipboard\n              dense\n              text={codeString}\n              variant=\"tooltip\"\n              tooltipAlign=\"right\"\n              message=\"Copied!\"\n            >\n              <Button dense color=\"secondary\">\n                Copy\n              </Button>\n            </CopyToClipboard>\n          )}\n        </CodeBlockHeader>\n        <CodeBlockContent className={`language-${language}`}>\n          {highlighted && codeString ? (\n            <Tag\n              dangerouslySetInnerHTML={{\n                __html: displayingCode,\n              }}\n            />\n          ) : (\n            children\n          )}\n        </CodeBlockContent>\n      </CodeBlockContainer>\n    );\n  }\n);\n\nexport * from '@digigov/react-core/CodeBlockContent';\nexport * from '@digigov/react-core/CodeBlockHeader';\nexport * from '@digigov/react-core/CodeBlockContainer';\nexport default CodeBlock;\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAElB,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,OAAO,YAAY;AACnB,OAAO,SAAS;AAEhB,OAAO,wBAAwB;AAC/B,OAAO,sBAAsB;AAC7B,OAAO,qBAAqB;AAC5B,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AAWvB,MAAM,cAAc;AAAA,EAClB,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,iBAAiB,CAAC,MAAc,mBAAqC;AACzE,SAAO,KACJ,MAAM,IAAI,EACV,IAAI,CAAC,MAAM,UAAU;AACpB,UAAM,gBAAgB,eAAe,SAAS,QAAQ,CAAC;AACvD,UAAM,YAAY,gBAAgB,8BAA8B;AAChE,WAAO,sCAAsC,QAAQ,CAAC,wBAAwB,SAAS,KAAK,IAAI;AAAA,EAClG,CAAC,EACA,KAAK,IAAI;AACd;AAEO,MAAM,YAAsC,MAAM;AAAA,EACvD,SAASA,WAAU;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GAAG;AACD,UAAM,MAAM;AACZ,UAAM,aAAa,OAAO,aAAa,WAAW,WAAW;AAC7D,QAAI,iBAAiB;AAErB,QAAI,eAAe,YAAY;AAC7B,UAAI;AACF,aAAK,UAAU,EAAE,aAAa,YAAY,CAAC;AAC3C,YAAI,kBAAkB,KAAK,cAAc,UAAU,EAAE;AACrD,YAAI,UAAU;AACZ,eAAK,iBAAiB,UAAU,YAAY,QAAQ,CAAC;AACrD,4BAAkB,KAAK,UAAU,YAAY;AAAA,YAC3C;AAAA,UACF,CAAC,EAAE;AAAA,QACL;AACA,yBAAiB,kBACb,eAAe,iBAAiB,kBAAkB,CAAC,CAAC,IACpD;AAAA,MACN,SAAS,OAAO;AACd,gBAAQ,MAAM,wBAAwB,KAAK;AAAA,MAC7C;AAAA,IACF;AAEA,WACE,oCAAC,sBAAmB,KAAW,GAAG,SAChC;AAAA,MAAC;AAAA;AAAA,QACC,SACE,sBAAsB,kBAAkB,kBAAkB;AAAA;AAAA,MAG3D,sBACC,oCAAC,sBAAgB,kBAAmB;AAAA,MAErC,mBACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAK;AAAA,UACL,MAAM;AAAA,UACN,SAAQ;AAAA,UACR,cAAa;AAAA,UACb,SAAQ;AAAA;AAAA,QAER,oCAAC,UAAO,OAAK,MAAC,OAAM,eAAY,MAEhC;AAAA,MACF;AAAA,IAEJ,GACA,oCAAC,oBAAiB,WAAW,YAAY,QAAQ,MAC9C,eAAe,aACd;AAAA,MAAC;AAAA;AAAA,QACC,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF,IAEA,QAEJ,CACF;AAAA,EAEJ;AACF;AAEA,cAAc;AACd,cAAc;AACd,cAAc;AACd,IAAO,oBAAQ;",
+  "sourcesContent": ["import React from 'react';\n\nimport hljs from 'highlight.js/lib/core';\nimport bash from 'highlight.js/lib/languages/bash';\nimport js from 'highlight.js/lib/languages/javascript';\nimport json from 'highlight.js/lib/languages/json';\nimport markdown from 'highlight.js/lib/languages/markdown';\nimport python from 'highlight.js/lib/languages/python';\nimport xml from 'highlight.js/lib/languages/xml';\nimport { BaseProps } from '@digigov/react-core/Base';\nimport CodeBlockContainer from '@digigov/react-core/CodeBlockContainer';\nimport CodeBlockContent from '@digigov/react-core/CodeBlockContent';\nimport CodeBlockHeader from '@digigov/react-core/CodeBlockHeader';\nimport { CopyToClipboard } from '@digigov/ui/feedback';\nimport { PhaseBannerTag } from '@digigov/ui/feedback/PhaseBanner';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport interface CodeBlockProps extends BaseProps<'div'> {\n  language?: 'javascript' | 'bash' | 'xml' | 'python' | 'markdown' | 'json';\n  copyToClipboard?: boolean;\n  highlighted?: boolean;\n  showLineNumbers?: boolean;\n  phaseBannerTagName?: string;\n  highlightLines?: number[];\n}\n\nconst languageMap = {\n  javascript: js,\n  python: python,\n  bash: bash,\n  xml: xml,\n  markdown: markdown,\n  json: json,\n};\n\nconst addLineNumbers = (code: string, highlightLines: number[]): string => {\n  return code\n    .split('\\n')\n    .map((line, index) => {\n      const isHighlighted = highlightLines.includes(index + 1);\n      const lineClass = isHighlighted ? 'ds-code--highlighted-line' : '';\n      return `<span class=\"ds-code--line-number\">${index + 1}</span> <span class=\"${lineClass}\">${line}</span>`;\n    })\n    .join('\\n');\n};\n\nexport const CodeBlock = React.forwardRef<HTMLDivElement, CodeBlockProps>(\n  function CodeBlock(\n    {\n      children,\n      language,\n      copyToClipboard,\n      highlighted,\n      showLineNumbers,\n      phaseBannerTagName,\n      highlightLines,\n      ...props\n    },\n    ref\n  ) {\n    const Tag = 'span';\n    const codeString = typeof children === 'string' ? children : '';\n    let displayingCode = codeString;\n\n    if (highlighted && codeString) {\n      try {\n        hljs.configure({ classPrefix: 'ds-code--' });\n        let highlightedCode = hljs.highlightAuto(codeString).value;\n        if (language) {\n          hljs.registerLanguage(language, languageMap[language]);\n          highlightedCode = hljs.highlight(codeString, {\n            language: language,\n          }).value;\n        }\n        displayingCode = showLineNumbers\n          ? addLineNumbers(highlightedCode, highlightLines || [])\n          : highlightedCode;\n      } catch (error) {\n        console.error('Highlighting failed:', error);\n      }\n    }\n\n    return (\n      <CodeBlockContainer ref={ref} {...props}>\n        <CodeBlockHeader\n          justify={\n            phaseBannerTagName && copyToClipboard ? 'space-between' : 'end'\n          }\n        >\n          {phaseBannerTagName && (\n            <PhaseBannerTag>{phaseBannerTagName}</PhaseBannerTag>\n          )}\n          {copyToClipboard && (\n            <CopyToClipboard\n              dense\n              text={codeString}\n              variant=\"tooltip\"\n              tooltipAlign=\"right\"\n              message=\"Copied!\"\n            >\n              <Button dense color=\"secondary\">\n                Copy\n              </Button>\n            </CopyToClipboard>\n          )}\n        </CodeBlockHeader>\n        <CodeBlockContent className={`language-${language}`}>\n          {highlighted && codeString ? (\n            <Tag\n              dangerouslySetInnerHTML={{\n                __html: displayingCode,\n              }}\n            />\n          ) : (\n            children\n          )}\n        </CodeBlockContent>\n      </CodeBlockContainer>\n    );\n  }\n);\n\nexport * from '@digigov/react-core/CodeBlockContent';\nexport * from '@digigov/react-core/CodeBlockHeader';\nexport * from '@digigov/react-core/CodeBlockContainer';\nexport default CodeBlock;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAElB,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,UAAU;AACjB,OAAO,cAAc;AACrB,OAAO,YAAY;AACnB,OAAO,SAAS;AAEhB,OAAO,wBAAwB;AAC/B,OAAO,sBAAsB;AAC7B,OAAO,qBAAqB;AAC5B,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,cAAc;AAWvB,MAAM,cAAc;AAAA,EAClB,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAEA,MAAM,iBAAiB,CAAC,MAAc,mBAAqC;AACzE,SAAO,KACJ,MAAM,IAAI,EACV,IAAI,CAAC,MAAM,UAAU;AACpB,UAAM,gBAAgB,eAAe,SAAS,QAAQ,CAAC;AACvD,UAAM,YAAY,gBAAgB,8BAA8B;AAChE,WAAO,sCAAsC,QAAQ,CAAC,wBAAwB,SAAS,KAAK,IAAI;AAAA,EAClG,CAAC,EACA,KAAK,IAAI;AACd;AAEO,MAAM,YAAY,MAAM;AAAA,EAC7B,SAASA,WACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,KACA;AACA,UAAM,MAAM;AACZ,UAAM,aAAa,OAAO,aAAa,WAAW,WAAW;AAC7D,QAAI,iBAAiB;AAErB,QAAI,eAAe,YAAY;AAC7B,UAAI;AACF,aAAK,UAAU,EAAE,aAAa,YAAY,CAAC;AAC3C,YAAI,kBAAkB,KAAK,cAAc,UAAU,EAAE;AACrD,YAAI,UAAU;AACZ,eAAK,iBAAiB,UAAU,YAAY,QAAQ,CAAC;AACrD,4BAAkB,KAAK,UAAU,YAAY;AAAA,YAC3C;AAAA,UACF,CAAC,EAAE;AAAA,QACL;AACA,yBAAiB,kBACb,eAAe,iBAAiB,kBAAkB,CAAC,CAAC,IACpD;AAAA,MACN,SAAS,OAAO;AACd,gBAAQ,MAAM,wBAAwB,KAAK;AAAA,MAC7C;AAAA,IACF;AAEA,WACE,oCAAC,sBAAmB,KAAW,GAAG,SAChC;AAAA,MAAC;AAAA;AAAA,QACC,SACE,sBAAsB,kBAAkB,kBAAkB;AAAA;AAAA,MAG3D,sBACC,oCAAC,sBAAgB,kBAAmB;AAAA,MAErC,mBACC;AAAA,QAAC;AAAA;AAAA,UACC,OAAK;AAAA,UACL,MAAM;AAAA,UACN,SAAQ;AAAA,UACR,cAAa;AAAA,UACb,SAAQ;AAAA;AAAA,QAER,oCAAC,UAAO,OAAK,MAAC,OAAM,eAAY,MAEhC;AAAA,MACF;AAAA,IAEJ,GACA,oCAAC,oBAAiB,WAAW,YAAY,QAAQ,MAC9C,eAAe,aACd;AAAA,MAAC;AAAA;AAAA,QACC,yBAAyB;AAAA,UACvB,QAAQ;AAAA,QACV;AAAA;AAAA,IACF,IAEA,QAEJ,CACF;AAAA,EAEJ;AACF;AAEA,cAAc;AACd,cAAc;AACd,cAAc;AACd,IAAO,oBAAQ;",
   "names": ["CodeBlock"]
 }

package/utils/hooks/useDebounce/index.js

@@ -2,7 +2,7 @@ import * as React from "react";
 import useLatest from "@digigov/ui/utils/hooks/useLatest";
 const useDebounceCallback = (callback, wait = 100, leading = false) => {
   const storedCallback = useLatest(callback);
-  const timeout = React.useRef();
+  const timeout = React.useRef(void 0);
   const deps = [wait, leading, storedCallback];
   React.useEffect(
     () => () => {

package/utils/hooks/useDebounce.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/utils/hooks/useDebounce.ts"],
-  "sourcesContent": ["import * as React from 'react';\nimport useLatest from '@digigov/ui/utils/hooks/useLatest';\n\nexport const useDebounceCallback = <CallbackArgs extends any[]>(\n  callback: (...args: CallbackArgs) => void,\n  wait = 100,\n  leading = false\n): ((...args: CallbackArgs) => void) => {\n  const storedCallback = useLatest(callback);\n  const timeout = React.useRef<ReturnType<typeof setTimeout>>();\n  const deps = [wait, leading, storedCallback];\n  // Cleans up pending timeouts when the deps change\n  React.useEffect(\n    () => () => {\n      if (timeout.current) clearTimeout(timeout.current);\n      timeout.current = void 0;\n    },\n    deps\n  );\n\n  return React.useCallback(function () {\n    // eslint-disable-next-line prefer-rest-params\n    const args = arguments;\n    const { current } = timeout;\n    // Calls on leading edge\n    if (current === void 0 && leading) {\n      timeout.current = setTimeout(() => {\n        timeout.current = void 0;\n      }, wait);\n\n      return storedCallback.current.apply(null, args as any);\n    }\n    // Clear the timeout every call and start waiting again\n    if (current) clearTimeout(current);\n    // Waits for `wait` before invoking the callback\n    timeout.current = setTimeout(() => {\n      timeout.current = void 0;\n      storedCallback.current.apply(null, args as any);\n    }, wait);\n  }, deps);\n};\n\nexport const useDebounce = <State>(\n  initialState: State | (() => State),\n  wait?: number,\n  leading?: boolean\n): [State, React.Dispatch<React.SetStateAction<State>>] => {\n  const state = React.useState(initialState);\n  return [state[0], useDebounceCallback(state[1], wait, leading)];\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,eAAe;AAEf,MAAM,sBAAsB,CACjC,UACA,OAAO,KACP,UAAU,UAC4B;AACtC,QAAM,iBAAiB,UAAU,QAAQ;AACzC,QAAM,UAAU,MAAM,OAAsC;AAC5D,QAAM,OAAO,CAAC,MAAM,SAAS,cAAc;AAE3C,QAAM;AAAA,IACJ,MAAM,MAAM;AACV,UAAI,QAAQ,QAAS,cAAa,QAAQ,OAAO;AACjD,cAAQ,UAAU;AAAA,IACpB;AAAA,IACA;AAAA,EACF;AAEA,SAAO,MAAM,YAAY,WAAY;AAEnC,UAAM,OAAO;AACb,UAAM,EAAE,QAAQ,IAAI;AAEpB,QAAI,YAAY,UAAU,SAAS;AACjC,cAAQ,UAAU,WAAW,MAAM;AACjC,gBAAQ,UAAU;AAAA,MACpB,GAAG,IAAI;AAEP,aAAO,eAAe,QAAQ,MAAM,MAAM,IAAW;AAAA,IACvD;AAEA,QAAI,QAAS,cAAa,OAAO;AAEjC,YAAQ,UAAU,WAAW,MAAM;AACjC,cAAQ,UAAU;AAClB,qBAAe,QAAQ,MAAM,MAAM,IAAW;AAAA,IAChD,GAAG,IAAI;AAAA,EACT,GAAG,IAAI;AACT;AAEO,MAAM,cAAc,CACzB,cACA,MACA,YACyD;AACzD,QAAM,QAAQ,MAAM,SAAS,YAAY;AACzC,SAAO,CAAC,MAAM,CAAC,GAAG,oBAAoB,MAAM,CAAC,GAAG,MAAM,OAAO,CAAC;AAChE;",
+  "sourcesContent": ["import * as React from 'react';\nimport useLatest from '@digigov/ui/utils/hooks/useLatest';\n\nexport const useDebounceCallback = <CallbackArgs extends any[]>(\n  callback: (...args: CallbackArgs) => void,\n  wait = 100,\n  leading = false\n): ((...args: CallbackArgs) => void) => {\n  const storedCallback = useLatest(callback);\n  const timeout = React.useRef<ReturnType<typeof setTimeout>>(undefined);\n  const deps = [wait, leading, storedCallback];\n  // Cleans up pending timeouts when the deps change\n  React.useEffect(\n    () => () => {\n      if (timeout.current) clearTimeout(timeout.current);\n      timeout.current = void 0;\n    },\n    deps\n  );\n\n  return React.useCallback(function () {\n    // eslint-disable-next-line prefer-rest-params\n    const args = arguments;\n    const { current } = timeout;\n    // Calls on leading edge\n    if (current === void 0 && leading) {\n      timeout.current = setTimeout(() => {\n        timeout.current = void 0;\n      }, wait);\n\n      return storedCallback.current.apply(null, args as any);\n    }\n    // Clear the timeout every call and start waiting again\n    if (current) clearTimeout(current);\n    // Waits for `wait` before invoking the callback\n    timeout.current = setTimeout(() => {\n      timeout.current = void 0;\n      storedCallback.current.apply(null, args as any);\n    }, wait);\n  }, deps);\n};\n\nexport const useDebounce = <State>(\n  initialState: State | (() => State),\n  wait?: number,\n  leading?: boolean\n): [State, React.Dispatch<React.SetStateAction<State>>] => {\n  const state = React.useState(initialState);\n  return [state[0], useDebounceCallback(state[1], wait, leading)];\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;AACvB,OAAO,eAAe;AAEf,MAAM,sBAAsB,CACjC,UACA,OAAO,KACP,UAAU,UAC4B;AACtC,QAAM,iBAAiB,UAAU,QAAQ;AACzC,QAAM,UAAU,MAAM,OAAsC,MAAS;AACrE,QAAM,OAAO,CAAC,MAAM,SAAS,cAAc;AAE3C,QAAM;AAAA,IACJ,MAAM,MAAM;AACV,UAAI,QAAQ,QAAS,cAAa,QAAQ,OAAO;AACjD,cAAQ,UAAU;AAAA,IACpB;AAAA,IACA;AAAA,EACF;AAEA,SAAO,MAAM,YAAY,WAAY;AAEnC,UAAM,OAAO;AACb,UAAM,EAAE,QAAQ,IAAI;AAEpB,QAAI,YAAY,UAAU,SAAS;AACjC,cAAQ,UAAU,WAAW,MAAM;AACjC,gBAAQ,UAAU;AAAA,MACpB,GAAG,IAAI;AAEP,aAAO,eAAe,QAAQ,MAAM,MAAM,IAAW;AAAA,IACvD;AAEA,QAAI,QAAS,cAAa,OAAO;AAEjC,YAAQ,UAAU,WAAW,MAAM;AACjC,cAAQ,UAAU;AAClB,qBAAe,QAAQ,MAAM,MAAM,IAAW;AAAA,IAChD,GAAG,IAAI;AAAA,EACT,GAAG,IAAI;AACT;AAEO,MAAM,cAAc,CACzB,cACA,MACA,YACyD;AACzD,QAAM,QAAQ,MAAM,SAAS,YAAY;AACzC,SAAO,CAAC,MAAM,CAAC,GAAG,oBAAoB,MAAM,CAAC,GAAG,MAAM,OAAO,CAAC;AAChE;",
   "names": []
 }

package/utils/hooks/useLatest.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
-declare const useLatest: <T>(current: T) => React.MutableRefObject<T>;
+declare const useLatest: <T>(current: T) => React.RefObject<T>;
 export default useLatest;

package/src/app/Footer/Footer.stories.js

@@ -1,18 +0,0 @@
-import Footer from '@digigov/ui/app/Footer';
-export default {
-  title: 'Digigov UI/app/Footer',
-  description:
-    'The footer provides copyright, licensing and other information about your service and department.',
-  link: 'https://guide.services.gov.gr/docs/components/footer',
-  defaultWidth: 'lg',
-  component: Footer,
-  displayName: 'Footer',
-};
-export { Default } from '@digigov/ui/app/Footer/__stories__/Default';
-export { FooterWithLogo } from '@digigov/ui/app/Footer/__stories__/FooterWithLogo';
-export { FooterWithLink } from '@digigov/ui/app/Footer/__stories__/FooterWithLink';
-export { DefaultCopyright } from '@digigov/ui/app/Footer/__stories__/DefaultCopyright';
-export { FooterWithSecondaryNavigation } from '@digigov/ui/app/Footer/__stories__/FooterWithSecondaryNavigation';
-export { FooterWithText } from '@digigov/ui/app/Footer/__stories__/FooterWithText';
-export { FooterAllInclusive } from '@digigov/ui/app/Footer/__stories__/FooterAllInclusive';
-export { YearCopyright } from '@digigov/ui/app/Footer/__stories__/YearCopyright';

package/src/app/Header/Header.stories.js

@@ -1,20 +0,0 @@
-import Header from '@digigov/ui/app/Header/';
-export default {
-  title: 'Digigov UI/app/Header',
-  component: Header,
-  displayName: 'Header',
-  description:
-    'You must use the GOV.GR header at the top of every page if your service is being listed in the GOV.GR service catalog.',
-  link: 'https://guide.services.gov.gr/docs/components/header',
-  defaultWidth: 'lg',
-  parameters: {
-    // More on Story layout: https://storybook.js.org/docs/react/configure/story-layout
-    layout: 'fullscreen',
-  },
-};
-
-export { Default } from '@digigov/ui/app/Header/__stories__/Default';
-export { WithServiceName } from '@digigov/ui/app/Header/__stories__/WithServiceName';
-export { WithServiceNameAndLogo } from '@digigov/ui/app/Header/__stories__/WithServiceNameAndLogo';
-export { WithNavigation } from '@digigov/ui/app/Header/__stories__/WithNavigation';
-export { WithHeaderNavigation } from '@digigov/ui/app/Header/__stories__/WithHeaderNavigation';

package/src/content/Accordion/Accordion.stories.js

@@ -1,14 +0,0 @@
-import Accordion from '@digigov/ui/content/Accordion';
-export default {
-  title: 'Digigov UI/content/Accordion',
-  tags: ['Experimental'],
-  description:
-    'The accordion component lets users show and hide sections of related content on a page.',
-  link: 'https://guide.services.gov.gr/docs/components/accordion',
-  component: Accordion,
-  displayName: 'Accordion',
-};
-export { Default } from '@digigov/ui/content/Accordion/__stories__/Default';
-export { WithHints } from '@digigov/ui/content/Accordion/__stories__/WithHints';
-export { WithHook } from '@digigov/ui/content/Accordion/__stories__/WithHook';
-export { Auto } from '@digigov/ui/content/Accordion/__stories__/Auto';

package/src/content/Card/Card.stories.js

@@ -1,21 +0,0 @@
-import Card from '@digigov/ui/content/Card';
-export default {
-  title: 'Digigov UI/content/Card',
-  tags: ['Experimental'],
-  description:
-    'Cards can be used to divide and organise interface content for better understandability and readability',
-  link: 'https://guide.services.gov.gr/docs/components/card',
-  component: Card,
-  displayName: 'Card',
-};
-export { Default } from '@digigov/ui/content/Card/__stories__/Default';
-export { WithGrayBorder } from '@digigov/ui/content/Card/__stories__/WithGrayBorder';
-export { WithDarkBorder } from '@digigov/ui/content/Card/__stories__/WithDarkBorder';
-export { WithGrayTopBorder } from '@digigov/ui/content/Card/__stories__/WithGrayTopBorder';
-export { WithDarkTopBorder } from '@digigov/ui/content/Card/__stories__/WithDarkTopBorder';
-export { WithDivider } from '@digigov/ui/content/Card/__stories__/WithDivider';
-export { WithClickableContent } from '@digigov/ui/content/Card/__stories__/WithClickableContent';
-export { WithClickableLink } from '@digigov/ui/content/Card/__stories__/WithClickableLink';
-export { WithGroupButton } from '@digigov/ui/content/Card/__stories__/WithGroupButton';
-export { WithLink } from '@digigov/ui/content/Card/__stories__/WithLink';
-export { Dense } from '@digigov/ui/content/Card/__stories__/Dense';

package/src/content/List/List.stories.js

@@ -1,15 +0,0 @@
-import List from '@digigov/ui/content/List';
-export default {
-  title: 'Digigov UI/content/List',
-  description:
-    'Use lists to make blocks of text easier to read, and to break information into manageable chunks.',
-  link: 'https://guide.services.gov.gr/docs/styles/typography#lists',
-  component: List,
-  displayName: 'List',
-};
-export { Default } from '@digigov/ui/content/List/__stories__/Default';
-export { BulletList } from '@digigov/ui/content/List/__stories__/BulletList';
-export { NumberedList } from '@digigov/ui/content/List/__stories__/NumberedList';
-export { HorizontalList } from '@digigov/ui/content/List/__stories__/HorizontalList';
-export { WithExtraSpace } from '@digigov/ui/content/List/__stories__/WithExtraSpace';
-export { NestedBulletList } from '@digigov/ui/content/List/__stories__/NestedBulletList';

package/src/content/Table/Table.stories.js

@@ -1,27 +0,0 @@
-import Table from '@digigov/ui/content/Table';
-export default {
-  title: 'Digigov UI/content/Table',
-  description:
-    'Use the table component to make information easier to compare and scan for users.',
-  link: 'https://guide.services.gov.gr/docs/components/table',
-  component: Table,
-  displayName: 'Table',
-};
-export { Default } from '@digigov/ui/content/Table/__stories__/Default';
-export { TableCaptions } from '@digigov/ui/content/Table/__stories__/TableCaptions';
-export { NoData } from '@digigov/ui/content/Table/__stories__/NoData';
-export { VerticalHeaders } from '@digigov/ui/content/Table/__stories__/VerticalHeaders';
-export { ZebraProp } from '@digigov/ui/content/Table/__stories__/ZebraProp';
-export { NumericDataType } from '@digigov/ui/content/Table/__stories__/NumericDataType';
-export { VerticalBorders } from '@digigov/ui/content/Table/__stories__/VerticalBorders';
-export { Stacked } from '@digigov/ui/content/Table/__stories__/Stacked';
-export { DarkVariant } from '@digigov/ui/content/Table/__stories__/DarkVariant';
-export { DarkVariantWithVerticalHeaders } from '@digigov/ui/content/Table/__stories__/DarkVariantWithVerticalHeaders';
-export { WithLoader } from '@digigov/ui/content/Table/__stories__/WithLoader';
-export { DefinedWidth } from '@digigov/ui/content/Table/__stories__/DefinedWidth';
-export { Dense } from '@digigov/ui/content/Table/__stories__/Dense';
-export { RowColors } from '@digigov/ui/content/Table/__stories__/RowColors';
-export { MultipleProps } from '@digigov/ui/content/Table/__stories__/MultipleProps';
-export { WithSortFilters } from '@digigov/ui/content/Table/__stories__/WithSortFilters';
-export { WithFloatingScroll } from '@digigov/ui/content/Table/__stories__/WithFloatingScroll';
-export { Full } from '@digigov/ui/content/Table/__stories__/Full';

package/src/feedback/CopyToClipboard/CopyToClipboard.stories.js

@@ -1,9 +0,0 @@
-import CopyToClipboard from '@digigov/ui/feedback/CopyToClipboard';
-export default {
-  title: 'Digigov UI/feedback/CopyToClipboard',
-  component: CopyToClipboard,
-  displayName: 'CopyToClipboard',
-};
-export { Default } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Default';
-export { Banner } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Banner';
-export { Dense } from '@digigov/ui/feedback/CopyToClipboard/__stories__/Dense';

package/src/feedback/ErrorSummary/ErrorSummary.stories.js

@@ -1,16 +0,0 @@
-import ErrorSummary from '@digigov/ui/feedback/ErrorSummary';
-export default {
-  title: 'Digigov UI/feedback/ErrorSummary',
-  description:
-    'Use this component at the top of a page to summarise any errors a user has made.',
-  link: 'https://guide.services.gov.gr/docs/components/error-summary',
-  component: ErrorSummary,
-  displayName: 'ErrorSummary',
-};
-export { Default } from '@digigov/ui/feedback/ErrorSummary/__stories__/Default';
-export { Dense } from '@digigov/ui/feedback/ErrorSummary/__stories__/Dense';
-export { LinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToInput';
-export { LinkedToField } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToField';
-export { LinkedToCheckbox } from '@digigov/ui/feedback/ErrorSummary/__stories__/LinkedToCheckbox';
-export { ErrorGroupLinkedToInput } from '@digigov/ui/feedback/ErrorSummary/__stories__/ErrorGroupLinkedToInput';
-export { WithBackLinkAndButton } from '@digigov/ui/feedback/ErrorSummary/__stories__/WithBackLinkAndButton';

package/src/feedback/PhaseBanner/PhaseBanner.stories.js

@@ -1,11 +0,0 @@
-import PhaseBanner from '@digigov/ui/feedback/PhaseBanner';
-export default {
-  title: 'Digigov UI/feedback/PhaseBanner',
-  description:
-    'Use the phase banner component to show users your service is still being worked on.',
-  link: 'https://guide.services.gov.gr/docs/components/phase-banner',
-  component: PhaseBanner,
-  displayName: 'PhaseBanner',
-};
-export { Default } from '@digigov/ui/feedback/PhaseBanner/__stories__/Default';
-export { Underlined } from '@digigov/ui/feedback/PhaseBanner/__stories__/Underlined';

package/src/form/AutoComplete/AutoComplete.stories.js

@@ -1,16 +0,0 @@
-import AutoComplete from '@digigov/ui/form/AutoComplete';
-export default {
-  title: 'Digigov UI/form/AutoComplete',
-  component: AutoComplete,
-  displayName: 'AutoComplete',
-};
-export { Default } from '@digigov/ui/form/AutoComplete/__stories__/Default';
-export { Multiple } from '@digigov/ui/form/AutoComplete/__stories__/Multiple';
-export { MultipleWithDefaultValues } from '@digigov/ui/form/AutoComplete/__stories__/MultipleWithDefaultValues';
-export { MultipleShowingTwoSelected } from '@digigov/ui/form/AutoComplete/__stories__/MultipleShowingTwoSelected';
-export { MultipleWithMinLength } from '@digigov/ui/form/AutoComplete/__stories__/MultipleWithMinLength';
-export { WithAutoSelect } from '@digigov/ui/form/AutoComplete/__stories__/WithAutoSelect';
-export { WithDefaultValue } from '@digigov/ui/form/AutoComplete/__stories__/WithDefaultValue';
-export { WithPlaceHolder } from '@digigov/ui/form/AutoComplete/__stories__/WithPlaceHolder';
-export { WithShowAllValues } from '@digigov/ui/form/AutoComplete/__stories__/WithShowAllValues';
-export { WithMinLength } from '@digigov/ui/form/AutoComplete/__stories__/WithMinLength';

package/src/form/Checkbox/Checkbox.stories.js

@@ -1,19 +0,0 @@
-import Checkbox from '@digigov/ui/form/Checkbox';
-export default {
-  title: 'Digigov UI/form/Checkbox',
-  description:
-    'Let users select one or more options by using the checkboxes component.',
-  link: 'https://guide.services.gov.gr/docs/components/checkboxes',
-  component: Checkbox,
-  displayName: 'Checkbox',
-};
-export { Default } from '@digigov/ui/form/Checkbox/__stories__/Default';
-export { Inline } from '@digigov/ui/form/Checkbox/__stories__/Inline';
-export { InlineWithDivider } from '@digigov/ui/form/Checkbox/__stories__/InlineWithDivider';
-export { MultipleQuestions } from '@digigov/ui/form/Checkbox/__stories__/MultipleQuestions';
-export { WithHint } from '@digigov/ui/form/Checkbox/__stories__/WithHint';
-export { NoneAnswer } from '@digigov/ui/form/Checkbox/__stories__/NoneAnswer';
-export { NoneAnswerWithError } from '@digigov/ui/form/Checkbox/__stories__/NoneAnswerWithError';
-export { WithErrorMessage } from '@digigov/ui/form/Checkbox/__stories__/WithErrorMessage';
-export { ConditionalReveal } from '@digigov/ui/form/Checkbox/__stories__/ConditionalReveal';
-export { Dense } from '@digigov/ui/form/Checkbox/__stories__/Dense';

package/src/form/DateInputContainer/DateInputContainer.stories.js

@@ -1,14 +0,0 @@
-import DateInputContainer from '@digigov/ui/form/DateInputContainer';
-export default {
-  title: 'Digigov UI/form/DateInputContainer',
-  description:
-    'Use the date input component to help users enter a memorable date or one they can easily look up.',
-  link: 'https://guide.services.gov.gr/docs/components/date-input',
-  component: DateInputContainer,
-  displayName: 'DateInputContainer',
-};
-export { Default } from '@digigov/ui/form/DateInputContainer/__stories__/Default';
-export { MultipleQuestions } from '@digigov/ui/form/DateInputContainer/__stories__/MultipleQuestions';
-export { WithErrorMessage } from '@digigov/ui/form/DateInputContainer/__stories__/WithErrorMessage';
-export { WithErrorMessageForSingleField } from '@digigov/ui/form/DateInputContainer/__stories__/WithErrorMessageForSingleField';
-export { Dense } from '@digigov/ui/form/DateInputContainer/__stories__/Dense';

package/src/form/ErrorMessage/ErrorMessage.stories.js

@@ -1,12 +0,0 @@
-import ErrorMessage from '@digigov/ui/form/ErrorMessage';
-export default {
-  title: 'Digigov UI/form/ErrorMessage',
-  description:
-    'Show an error message next to the field and in the error summary when there is a validation error.',
-  link: 'https://guide.services.gov.gr/docs/components/error-message',
-  component: ErrorMessage,
-  displayName: 'ErrorMessage',
-};
-export { Default } from '@digigov/ui/form/ErrorMessage/__stories__/Default';
-export { DateInputError } from '@digigov/ui/form/ErrorMessage/__stories__/DateInputError';
-export { ErrorMessageOnly } from '@digigov/ui/form/ErrorMessage/__stories__/ErrorMessageOnly';

package/src/form/RadioContainer/RadioContainer.stories.js

@@ -1,19 +0,0 @@
-import RadioContainer from '@digigov/ui/form/RadioContainer';
-export default {
-  title: 'Digigov UI/form/RadioContainer',
-  description:
-    'Use the radios component when users can only select one option from a list.',
-  link: 'https://guide.services.gov.gr/docs/components/radio',
-  component: RadioContainer,
-  displayName: 'RadioContainer',
-};
-export { Default } from '@digigov/ui/form/RadioContainer/__stories__/Default';
-export { WithMediumLegend } from '@digigov/ui/form/RadioContainer/__stories__/WithMediumLegend';
-export { MultipleQuestions } from '@digigov/ui/form/RadioContainer/__stories__/MultipleQuestions';
-export { Inline } from '@digigov/ui/form/RadioContainer/__stories__/Inline';
-export { WithHints } from '@digigov/ui/form/RadioContainer/__stories__/WithHints';
-export { NoneAnswer } from '@digigov/ui/form/RadioContainer/__stories__/NoneAnswer';
-export { WithErrorMessage } from '@digigov/ui/form/RadioContainer/__stories__/WithErrorMessage';
-export { ConditionalReveal } from '@digigov/ui/form/RadioContainer/__stories__/ConditionalReveal';
-export { InlineWithDivider } from '@digigov/ui/form/RadioContainer/__stories__/InlineWithDivider';
-export { Dense } from '@digigov/ui/form/RadioContainer/__stories__/Dense';

package/src/form/SelectContainer/SelectContainer.stories.js

@@ -1,13 +0,0 @@
-import SelectContainer from '@digigov/ui/form/SelectContainer';
-export default {
-  title: 'Digigov UI/form/SelectContainer',
-  description:
-    'The select component should only be used as a last resort in public-facing services because research shows that some users find selects very difficult to use.',
-  link: 'https://guide.services.gov.gr/docs/components/select',
-  component: SelectContainer,
-  displayName: 'SelectContainer',
-};
-export { Default } from '@digigov/ui/form/SelectContainer/__stories__/Default';
-export { DisabledInput } from '@digigov/ui/form/SelectContainer/__stories__/DisabledInput';
-export { WithHint } from '@digigov/ui/form/SelectContainer/__stories__/WithHint';
-export { Dense } from '@digigov/ui/form/SelectContainer/__stories__/Dense';

package/src/form/SingleCharacterInputs/SingleCharacterInput.stories.js

@@ -1,13 +0,0 @@
-import SingleCharacterInputs from '@digigov/ui/form/SingleCharacterInputs';
-export default {
-  title: 'Digigov UI/form/SingleCharacterInputs',
-  description:
-    'Use the One-time password input component to help users enter a memorable digital character for One-time password.',
-  link: 'https://guide.services.gov.gr/docs/patterns/one-time-password',
-  component: SingleCharacterInputs,
-  displayName: 'SingleCharacterInputs',
-};
-export { Default } from '@digigov/ui/form/SingleCharacterInputs/__stories__/Default';
-export { WithDefaultError } from '@digigov/ui/form/SingleCharacterInputs/__stories__/WithDefaultError';
-export { WithErrorMessageInvalidCode } from '@digigov/ui/form/SingleCharacterInputs/__stories__/WithErrorMessageInvalidCode';
-export { WithErrorMessageLessDigit } from '@digigov/ui/form/SingleCharacterInputs/__stories__/WithErrorMessageLessDigit';

package/src/form/TextArea/TextArea.stories.js

@@ -1,17 +0,0 @@
-import TextArea from '@digigov/ui/form/TextArea';
-export default {
-  title: 'Digigov UI/form/TextArea',
-  description:
-    'Use the textarea component when you need to let users enter an amount of text that’s longer than a single line.',
-  link: 'https://guide.services.gov.gr/docs/components/textarea',
-  component: TextArea,
-  displayName: 'TextArea',
-};
-export { Default } from '@digigov/ui/form/TextArea/__stories__/Default';
-export { WithHint } from '@digigov/ui/form/TextArea/__stories__/WithHint';
-export { WithDeclaredRows } from '@digigov/ui/form/TextArea/__stories__/WithDeclaredRows';
-export { MultipleQuestions } from '@digigov/ui/form/TextArea/__stories__/MultipleQuestions';
-export { LimitedCharacters } from '@digigov/ui/form/TextArea/__stories__/LimitedCharacters';
-export { WithErrorMessage } from '@digigov/ui/form/TextArea/__stories__/WithErrorMessage';
-export { DisabledInput } from '@digigov/ui/form/TextArea/__stories__/DisabledInput';
-export { Dense } from '@digigov/ui/form/TextArea/__stories__/Dense';

package/src/form/TextInput/TextInput.stories.js

@@ -1,19 +0,0 @@
-import TextInput from '@digigov/ui/form/TextInput';
-export default {
-  title: 'Digigov UI/form/TextInput',
-  description:
-    'Use the text input component when you need to let users enter text that’s no longer than a single line.',
-  link: 'https://guide.services.gov.gr/docs/components/TextInput',
-  component: TextInput,
-  displayName: 'TextInput',
-};
-export { Default } from '@digigov/ui/form/TextInput/__stories__/Default';
-export { MultipleQuestions } from '@digigov/ui/form/TextInput/__stories__/MultipleQuestions';
-export { FixedWidths } from '@digigov/ui/form/TextInput/__stories__/FixedWidths';
-export { FluidWidths } from '@digigov/ui/form/TextInput/__stories__/FluidWidths';
-export { WithHint } from '@digigov/ui/form/TextInput/__stories__/WithHint';
-export { AskingForNumbers } from '@digigov/ui/form/TextInput/__stories__/AskingForNumbers';
-export { WithErrorMessage } from '@digigov/ui/form/TextInput/__stories__/WithErrorMessage';
-export { DisabledInput } from '@digigov/ui/form/TextInput/__stories__/DisabledInput';
-export { DisabledInputWithValue } from '@digigov/ui/form/TextInput/__stories__/DisabledInputWithValue';
-export { Dense } from '@digigov/ui/form/TextInput/__stories__/Dense';