@spaced-out/ui-design-system 0.4.13 → 0.4.15-beta.0

package/lib/components/FocusManagerWithArrowKeyNavigation/FocusManagerWithArrowKeyNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusManagerWithArrowKeyNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/FocusManagerWithArrowKeyNavigation/FocusManagerWithArrowKeyNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAGrD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,iBAAiB,CAAC;AAOvD,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,IAAI,CAAC,iBAAiB,CAAC,8BAA8B,EAAE,cAAc,CAW3G,CAAC;AAIH,MAAM,MAAM,uCAAuC,GAAG,CAAC,CAAC,iBAAiB,CAAC,GAAG;IAC3E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACnC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE;QACd,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;KAC7B,CAAC;CACH,CAAC,CAAC;AAEH,eAAO,MAAM,kCAAkC,GAAI,OAAO,uCAAuC,sBAyGhG,CAAC"}

package/lib/components/FocusManagerWithArrowKeyNavigation/FocusManagerWithArrowKeyNavigation.js

@@ -50,6 +50,7 @@ const FocusManagerWithArrowKeyNavigation = props => {
 
   // Note(Nishant): This is to correctly call the onClick handler which could have been on child
   // we also need to set the active index correctly on click for list navigation to work
+  // @ts-ignore - TS7019 - Rest parameter 'args' implicitly has an 'any[]' type.
   const childOnClickPassthrough = function (childOnClickHandler, index) {
     if (childOnClickHandler) {
       for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
@@ -77,22 +78,32 @@ const FocusManagerWithArrowKeyNavigation = props => {
 
   let skippedChildrenCount = 0;
   const clonedChildren = listReference ? children : childrenArray.map((child, index) => {
+    // @ts-ignore - TS2339 - Property 'props' does not exist on type 'string | number | bigint | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | Promise<...>'.
     const {
       onClick: childClickHandler
     } = child.props;
     let adjustedIndex = index - skippedChildrenCount;
+
+    // @ts-ignore - TS2339 - Property 'type' does not exist on type 'string | number | bigint | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | Promise<...>'.
     if (child?.type?.displayName === SKIP_ELEMENT_DISPLAY_NAME) {
       skippedChildrenCount++;
+      // @ts-ignore - TS2322 - Type 'null' is not assignable to type 'number'.
       adjustedIndex = null;
     }
+
+    // @ts-ignore - TS2769 - No overload matches this call.
     return /*#__PURE__*/React.cloneElement(child, {
+      // @ts-ignore - TS2339 - Property 'props' does not exist on type 'string | number | bigint | ReactElement<unknown, string | JSXElementConstructor<any>> | Iterable<ReactNode> | ReactPortal | Promise<...>'.
       ...child.props,
       tabIndex: activeIndex === index ? 0 : -1,
+      // @ts-ignore - TS7006 - Parameter 'node' implicitly has an 'any' type.
       ref: node => {
         if (adjustedIndex !== null) {
+          // @ts-ignore - TS2322 - Type 'any' is not assignable to type 'never'.
           listRef.current[adjustedIndex] = node;
         }
       },
+      // @ts-ignore - TS7019 - Rest parameter 'args' implicitly has an 'any[]' type.
       onClick: function () {
         for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
           args[_key3] = arguments[_key3];

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

@@ -0,0 +1,2 @@
+export * from './FocusManagerWithArrowKeyNavigation';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FocusManagerWithArrowKeyNavigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,sCAAsC,CAAC"}

package/lib/components/FormTitleWrapper/FormTitleWrapper.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { ColorTypes } from '../../types/typography';
+import type { IconSize, IconType } from '../Icon';
+type ClassNames = Readonly<{
+    wrapper?: string;
+    title?: string;
+    rightSlot?: string;
+}>;
+export type FormTitleWrapperProps = {
+    classNames?: ClassNames;
+    iconType?: IconType;
+    iconName?: string;
+    iconSize?: IconSize;
+    iconColor?: ColorTypes;
+    title: React.ReactNode;
+    rightSlot?: React.ReactNode;
+};
+export declare const FormTitleWrapper: Flow.AbstractComponent<FormTitleWrapperProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=FormTitleWrapper.d.ts.map

package/lib/components/FormTitleWrapper/FormTitleWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTitleWrapper.d.ts","sourceRoot":"","sources":["../../../src/components/FormTitleWrapper/FormTitleWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAErD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAEvD,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAC,MAAM,SAAS,CAAC;AAMhD,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC,CAAC;AAEH,MAAM,MAAM,qBAAqB,GAAG;IAClC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,UAAU,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,EAAE,cAAc,CAkCzF,CAAC"}

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

@@ -0,0 +1,2 @@
+export * from './FormTitleWrapper';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormTitleWrapper/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC"}

package/lib/components/Grid/Grid.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+export type RowProps = {
+    className?: string;
+    children?: React.ReactNode;
+    span?: number;
+    offset?: number;
+    gridType?: 'small' | 'medium' | 'large' | 'autoFill' | 'autoFit';
+    repeatTracks?: string;
+};
+export declare const Row: ({ className, children, span, gridType, repeatTracks, }: RowProps) => React.JSX.Element;
+export type ColProps = {
+    className?: string;
+    children?: React.ReactNode;
+    span?: number;
+    offset?: number;
+    gridColumnStart?: number;
+    gridColumnEnd?: number;
+};
+export declare const Col: ({ className, children, gridColumnStart, gridColumnEnd, }: ColProps) => React.JSX.Element;
+//# sourceMappingURL=Grid.d.ts.map

package/lib/components/Grid/Grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.d.ts","sourceRoot":"","sources":["../../../src/components/Grid/Grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAC;IACjE,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAUF,eAAO,MAAM,GAAG,GACd,wDAOG,QAAQ,sBA0DZ,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,GAAG,GACd,0DAKG,QAAQ,sBAWN,CAAC"}

package/lib/components/Grid/Grid.js

@@ -20,6 +20,7 @@ const Row = _ref => {
   let {
     className,
     children,
+    // @ts-ignore - TS6133 - 'span' is declared but its value is never read.
     span = 1,
     gridType = 'medium',
     repeatTracks = '1fr'
@@ -29,6 +30,7 @@ const Row = _ref => {
   let lastChildColCount = 0;
   const childrenWithProps = React.Children.map(children, child => {
     if (/*#__PURE__*/React.isValidElement(child)) {
+      // @ts-ignore - TS2339 - Property 'span' does not exist on type 'unknown'. | TS2339 - Property 'offset' does not exist on type 'unknown'.
       const {
         span = 1,
         offset = 0
@@ -44,16 +46,20 @@ const Row = _ref => {
       lastChildColCount = columnSpanCount;
       columnSpanCount = lastChildColCount + offset + span;
       let gridColumnStart = 0,
+        // @ts-ignore - TS6133 - 'gridColumnEnd' is declared but its value is never read.
         gridColumnEnd = 0;
       if (gridType === 'autoFill' || gridType === 'autoFit') {
+        // @ts-ignore - TS2322 - Type 'string' is not assignable to type 'number'.
         gridColumnStart = 'auto';
         return /*#__PURE__*/React.cloneElement(child, {
+          // @ts-ignore - TS2769 - No overload matches this call.
           gridColumnStart,
           gridColumnEnd: `span ${span}`
         });
       } else if (typeof gridRepeatCount === 'number' && columnSpanCount <= gridRepeatCount) {
         gridColumnStart = lastChildColCount + offset + 1;
         return /*#__PURE__*/React.cloneElement(child, {
+          // @ts-ignore - TS2769 - No overload matches this call.
           gridColumnStart,
           gridColumnEnd: `span ${span}`
         });
@@ -82,7 +88,9 @@ const Col = _ref2 => {
   return /*#__PURE__*/React.createElement("div", {
     className: (0, _classify.classify)(_GridModule.default.gridColumn, className),
     style: {
+      // @ts-ignore - TS2322 - Type 'number | undefined' is not assignable to type 'string | number'.
       '--grid-column-start': gridColumnStart,
+      // @ts-ignore - TS2322 - Type 'number | undefined' is not assignable to type 'string | number'.
       '--grid-column-end': gridColumnEnd
     }
   }, children);

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

@@ -0,0 +1,2 @@
+export * from './Grid';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Grid/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC"}

package/lib/components/Icon/ClickableIcon.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { ColorTypes } from '../../types/typography';
+import type { IconProps, IconSize, IconType } from './';
+type ClassNames = Readonly<{
+    icon?: string;
+    button?: string;
+}>;
+export type ClickableIconProps = ((IconProps) & {
+    disabled?: boolean;
+    classNames?: ClassNames;
+});
+export declare const ClickableIcon: Flow.AbstractComponent<ClickableIconProps, HTMLButtonElement>;
+export type CloseIconProps = {
+    size?: IconSize;
+    type?: IconType;
+    color?: ColorTypes;
+    onClick?: ((arg1: React.SyntheticEvent<HTMLElement>) => unknown) | null | undefined;
+    className?: string;
+    ariaLabel?: string;
+    disabled?: boolean;
+    classNames?: ClassNames;
+};
+export declare const CloseIcon: Flow.AbstractComponent<CloseIconProps, HTMLButtonElement>;
+export {};
+//# sourceMappingURL=ClickableIcon.d.ts.map

package/lib/components/Icon/ClickableIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClickableIcon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/ClickableIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAErD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAKvD,OAAO,KAAK,EAAC,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAC,MAAM,IAAI,CAAC;AAMtD,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,CAAC,CAAC,SAAS,CAAC,GAAG;IAC9C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC,CAAC;AAEH,eAAO,MAAM,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE,iBAAiB,CAgDtF,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,OAAO,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACpF,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,IAAI,CAAC,iBAAiB,CAAC,cAAc,EAAE,iBAAiB,CAiB9E,CAAC"}

package/lib/components/Icon/ClickableIcon.js

@@ -18,8 +18,8 @@ const ClickableIcon = exports.ClickableIcon = /*#__PURE__*/React.forwardRef((_re
     size = 'medium',
     ariaLabel,
     onClick,
-    className,
     // Deprecated for Clickable Icon
+    className,
     classNames,
     disabled = false,
     ...props
@@ -32,7 +32,9 @@ const ClickableIcon = exports.ClickableIcon = /*#__PURE__*/React.forwardRef((_re
   };
   return /*#__PURE__*/React.createElement(_Button.UnstyledButton, _extends({}, props, {
     onClick: onClick,
-    disabled: disabled,
+    disabled: disabled
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
     onKeyDown: onKeyDownHandler,
     ariaLabel: ariaLabel,
     className: (0, _classify.default)(_ClickableIconModule.default.button, {

package/lib/components/Icon/Icon.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { ColorTypes } from '../../types/typography';
+export declare const ICON_TYPE: Readonly<{
+    regular: "regular";
+    solid: "solid";
+    duotone: "duotone";
+    brands: "brands";
+}>;
+export declare const ICON_SIZE: Readonly<{
+    small: "small";
+    medium: "medium";
+    large: "large";
+}>;
+export type IconSize = keyof typeof ICON_SIZE;
+export type IconType = keyof typeof ICON_TYPE;
+export type IconProps = {
+    type?: IconType;
+    name: string;
+    size?: IconSize;
+    color?: ColorTypes;
+    className?: string;
+    onClick?: ((arg1: React.SyntheticEvent<HTMLElement>) => unknown) | null | undefined;
+    ariaLabel?: string;
+    swapOpacity?: boolean;
+    style?: {
+        [key: string]: string;
+    };
+};
+export declare const Icon: Flow.AbstractComponent<IconProps, HTMLDivElement>;
+//# sourceMappingURL=Icon.d.ts.map

package/lib/components/Icon/Icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAErD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,wBAAwB,CAAC;AAOvD,eAAO,MAAM,SAAS;;;;;EAKpB,CAAC;AAEH,eAAO,MAAM,SAAS;;;;EAIpB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAC9C,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAC;AAE9C,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,OAAO,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACpF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE;QACN,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,IAAI,CAAC,iBAAiB,CAAC,SAAS,EAAE,cAAc,CAoC/D,CAAC"}

package/lib/components/Icon/Icon.docs.d.ts

@@ -0,0 +1,134 @@
+export declare const ICON_DOCS: {
+    readonly argTypes: {
+        readonly type: {
+            readonly description: "Type represents 5 unique icon styles :- Solid, Regular, Light, Thin, Duotone";
+            readonly options: readonly ["regular", "solid", "duotone", "brands"];
+            readonly control: {
+                readonly type: "select";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "regular";
+                };
+            };
+        };
+        readonly name: {
+            readonly description: "Icon Name represents name of icon as supported by fontawesome";
+            readonly type: {
+                readonly required: true;
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "face-party";
+                };
+            };
+        };
+        readonly color: {
+            readonly description: "Same set of colors as supported in text";
+            readonly options: unknown[];
+            readonly control: {
+                readonly type: "select";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "primary";
+                };
+            };
+        };
+        readonly size: {
+            readonly description: "Icon supports three size variants namely small and medium. `small` < `medium` < `large`";
+            readonly options: unknown[];
+            readonly control: {
+                readonly type: "select";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "medium";
+                };
+            };
+        };
+        readonly swapOpacity: {
+            readonly name: "swapOpacity";
+            readonly description: "Swap the default opacity of each layer in a duotone icon.";
+            readonly options: readonly [false, true];
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly className: {
+            readonly description: "External className to be applied on container";
+            readonly control: {
+                readonly type: "text";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+            };
+        };
+        readonly onClick: {
+            readonly description: "onClick handler";
+            readonly action: "clicked";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "(SyntheticEvent<HTMLElement>) => mixed";
+                };
+            };
+        };
+        readonly disabled: {
+            readonly description: "If **true**, the clickable icon is disabled";
+            readonly control: {
+                readonly type: "boolean";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: "false";
+                };
+            };
+        };
+        readonly ariaLabel: {
+            readonly control: {
+                readonly type: "text";
+            };
+            readonly description: "**aria-label** should be added where `ClickableIcon` and `CloseIcon` is used. This would avoid accessibility violations in screen readers";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+            };
+        };
+    };
+    readonly parameters: {
+        readonly docs: {
+            readonly subtitle: "Generates a Icon component";
+            readonly description: {
+                readonly component: "\n```js\nimport {\n  Icon,\n  ClickableIcon,\n  CloseIcon,\n  SemanticIcon\n} from \"@spaced-out/ui-design-system/lib/components/Icon\";\n```\nIcon component uses <a href=\"https://fontawesome.com/icons\" target=\"_blank\">fontawesome</a> icon internally.\nThe name prop has be to consistent with one used in fontawesome.\n        ";
+            };
+        };
+        readonly storySource: {
+            readonly componentPath: "/src/components/Icon/Icon";
+        };
+    };
+};
+//# sourceMappingURL=Icon.docs.d.ts.map

package/lib/components/Icon/Icon.docs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.docs.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.docs.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6GZ,CAAC"}

package/lib/components/Icon/Icon.docs.js

@@ -148,7 +148,7 @@ The name prop has be to consistent with one used in fontawesome.
       }
     },
     storySource: {
-      componentPath: '/src/components/Icon/Icon.js'
+      componentPath: '/src/components/Icon/Icon'
     }
   }
 };

package/lib/components/Icon/Icon.js

@@ -33,7 +33,9 @@ const Icon = exports.Icon = /*#__PURE__*/React.forwardRef((_ref, forwardRef) =>
     swapOpacity
   } = _ref;
   return /*#__PURE__*/React.createElement(React.Fragment, null, !!name && /*#__PURE__*/React.createElement("div", {
-    className: (0, _classify.default)(_typographyModule.default.centerAlignFlex, _typographyModule.default[`${size}Icon`], _typographyModule.default[color], className),
+    className: (0, _classify.default)(_typographyModule.default.centerAlignFlex, _typographyModule.default[`${size}Icon`], _typographyModule.default[color], className)
+    // @ts-ignore - TS2322 - Type '((arg1: SyntheticEvent<HTMLElement, Event>) => unknown) | null | undefined' is not assignable to type 'MouseEventHandler<HTMLDivElement> | undefined'.
+    ,
     onClick: onClick,
     ref: forwardRef
   }, /*#__PURE__*/React.createElement("i", {

package/lib/components/Icon/SemanticIcon.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { AlertSemanticType } from '../../types/common';
+import type { IconProps } from './Icon';
+type ClassNames = Readonly<{
+    wrapper?: string;
+    icon?: string;
+}>;
+export type SemanticIconProps = ((IconProps) & {
+    classNames?: ClassNames;
+    semantic?: AlertSemanticType;
+});
+export declare const SemanticIcon: ({ semantic, classNames, size, ...iconProps }: SemanticIconProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=SemanticIcon.d.ts.map

package/lib/components/Icon/SemanticIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SemanticIcon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/SemanticIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AAI1D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,QAAQ,CAAC;AAMtC,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,CAAC,CAAC,SAAS,CAAC,GAAG;IAC7C,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,iBAAiB,CAAC;CAC9B,CAAC,CAAC;AAEH,eAAO,MAAM,YAAY,GACvB,8CAKG,iBAAiB,sBAoBlB,CAAC"}

package/lib/components/Icon/SemanticIcon.js

@@ -22,7 +22,9 @@ const SemanticIcon = _ref => {
   return /*#__PURE__*/React.createElement(React.Fragment, null, !!iconProps.name && /*#__PURE__*/React.createElement("div", {
     className: (0, _classify.default)(_SemanticIconModule.default.iconContainer, _SemanticIconModule.default[semantic], _SemanticIconModule.default[size], classNames?.wrapper)
   }, /*#__PURE__*/React.createElement(_Icon.Icon, _extends({}, iconProps, {
-    className: (0, _classify.default)(iconProps.className, classNames?.icon),
+    className: (0, _classify.default)(iconProps.className, classNames?.icon)
+    // @ts-ignore - TS7053 - Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Readonly<{ primary: string; secondary: string; tertiary: string; disabled: string; clickable: string; neutral: string; success: string; information: string; warning: string; danger: string; inversePrimary: string; inverseSecondary: string; favorite: string; }>'.
+    ,
     color: _typography.TEXT_COLORS[semantic],
     size: size === 'large' ? 'medium' : size
   }))));

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

@@ -0,0 +1,4 @@
+export * from './ClickableIcon';
+export * from './Icon';
+export * from './SemanticIcon';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC"}

package/lib/components/InContextAlert/InContextAlert.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { AlertSemanticType } from '../../types/common';
+import type { IconType } from '../Icon';
+type ClassNames = Readonly<{
+    wrapper?: string;
+    alertText?: string;
+    actionContainer?: string;
+    icon?: string;
+}>;
+type InContextAlertBaseProps = ({
+    classNames?: ClassNames;
+} & ({
+    dismissable: true;
+    onCloseClick?: ((arg1: React.SyntheticEvent<HTMLElement>) => unknown) | null | undefined;
+    selfDismiss?: boolean;
+} | {
+    dismissable?: false;
+}) & {
+    children?: string;
+    actionText?: string;
+    onAction?: ((arg1: React.SyntheticEvent<HTMLElement>) => unknown) | null | undefined;
+});
+export type InContextAlertProps = ((InContextAlertBaseProps) & {
+    semantic?: AlertSemanticType;
+    leftIconName?: string;
+    leftIconType?: IconType;
+});
+export declare const InContextAlert: Flow.AbstractComponent<InContextAlertProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=InContextAlert.d.ts.map

package/lib/components/InContextAlert/InContextAlert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InContextAlert.d.ts","sourceRoot":"","sources":["../../../src/components/InContextAlert/InContextAlert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAErD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,oBAAoB,CAAC;AAI1D,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAStC,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAEH,KAAK,uBAAuB,GAAG,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,GAAG,CAAC;IACH,WAAW,EAAE,IAAI,CAAC;IAClB,YAAY,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,OAAO,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACzF,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,GAAG;IACF,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC,GAAG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,KAAK,OAAO,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;CACtF,CAAC,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,uBAAuB,CAAC,GAAG;IAC7D,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,QAAQ,CAAC;CACzB,CAAC,CAAC;AAiFH,eAAO,MAAM,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,mBAAmB,EAAE,cAAc,CAgFrF,CAAC"}

package/lib/components/InContextAlert/InContextAlert.js

@@ -79,8 +79,10 @@ const InContextAlert = exports.InContextAlert = /*#__PURE__*/React.forwardRef((p
     semantic = _common.ALERT_SEMANTIC.neutral,
     dismissable,
     children,
+    // @ts-ignore - TS2339 - Property 'selfDismiss' does not exist on type 'InContextAlertProps'.
     selfDismiss = false,
     leftIconName = '',
+    // @ts-ignore - TS2339 - Property 'onCloseClick' does not exist on type 'InContextAlertProps'.
     onCloseClick,
     actionText = '',
     onAction,

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

@@ -0,0 +1,2 @@
+export * from './InContextAlert';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InContextAlert/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}

package/lib/components/InfinitePagination/InfinitePagination.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { GenericObject } from '../Table';
+type ClassNames = Readonly<{
+    wrapper?: string;
+}>;
+export type InfinitePaginationProps = ({
+    items: Array<GenericObject>;
+    width: string;
+    threshold?: number;
+    classNames?: ClassNames;
+    renderItem: (item: GenericObject, index: number) => React.ReactNode;
+    getItemKey?: (item: GenericObject, index: number) => string | number;
+    hasNextPage: boolean;
+    loadMoreItems: () => Promise<void>;
+} & // to make Flow happy with the disjoint union isVariableSizeList is a mandatory prop
+({
+    itemSize: (index: number) => number;
+    isVariableSizeList: true;
+} | {
+    itemSize: number;
+    isVariableSizeList?: false;
+}));
+export declare const InfinitePagination: Flow.AbstractComponent<InfinitePaginationProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=InfinitePagination.d.ts.map

package/lib/components/InfinitePagination/InfinitePagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfinitePagination.d.ts","sourceRoot":"","sources":["../../../src/components/InfinitePagination/InfinitePagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAMrD,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,UAAU,CAAC;AAK5C,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAIH,MAAM,MAAM,uBAAuB,GAAG,CAAC;IACrC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;IACpE,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAAC;IACrE,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACpC,GAAG,oFAAoF;AACxF,CAAC;IACC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACpC,kBAAkB,EAAE,IAAI,CAAC;CAC1B,GAAG;IACF,QAAQ,EAAE,MAAM,CAAC;IACjB,kBAAkB,CAAC,EAAE,KAAK,CAAC;CAC5B,CAAC,CAAC,CAAC;AAEJ,eAAO,MAAM,kBAAkB,EAAE,IAAI,CAAC,iBAAiB,CAAC,uBAAuB,EAAE,cAAc,CAmF7F,CAAC"}

package/lib/components/InfinitePagination/InfinitePagination.js

@@ -13,7 +13,6 @@ var _CircularLoader = require("../CircularLoader");
 var _InfinitePaginationModule = _interopRequireDefault(require("./InfinitePagination.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-// $FlowFixMe[nonstrict-import]
 const DEFAULT_THRESHOLD = 200;
 const InfinitePagination = exports.InfinitePagination = /*#__PURE__*/React.forwardRef((props, ref) => {
   const {
@@ -32,9 +31,12 @@ const InfinitePagination = exports.InfinitePagination = /*#__PURE__*/React.forwa
   const itemsLength = items.length;
   const totalItemsCount = itemsLength + (hasNextPage ? 1 : 0);
   const [containerRef, containerHeight] = (0, _hooks.useResizeObserver)();
+
+  // @ts-ignore - TS2322 - Type 'null' is not assignable to type 'HTMLDivElement'.
   React.useImperativeHandle(ref, () => listRef.current);
   React.useEffect(() => {
     if (listRef.current) {
+      // @ts-ignore - TS2339 - Property 'scrollToItem' does not exist on type 'never'.
       listRef.current.scrollToItem(0);
     }
   }, [itemsLength === 0]);
@@ -47,6 +49,8 @@ const InfinitePagination = exports.InfinitePagination = /*#__PURE__*/React.forwa
     containerHeight,
     isVariableSizeList
   });
+
+  // @ts-ignore - TS7031 - Binding element 'index' implicitly has an 'any' type. | TS7031 - Binding element 'style' implicitly has an 'any' type.
   const Row = _ref => {
     let {
       index,
@@ -62,9 +66,12 @@ const InfinitePagination = exports.InfinitePagination = /*#__PURE__*/React.forwa
       className: _InfinitePaginationModule.default.listRow
     }, renderItem(items[index], index));
   };
-  const itemKey = React.useCallback(index => index === itemsLength ? 'loading-indicator' : getItemKey ? getItemKey(items[index], index) : index, [items, getItemKey]);
+  const itemKey = React.useCallback(
+  // @ts-ignore - TS7006 - Parameter 'index' implicitly has an 'any' type.
+  index => index === itemsLength ? 'loading-indicator' : getItemKey ? getItemKey(items[index], index) : index, [items, getItemKey]);
   const ListComponent = isVariableSizeList ? _reactWindow.VariableSizeList : _reactWindow.FixedSizeList;
   return /*#__PURE__*/React.createElement("div", {
+    // @ts-ignore - TS2322 - Type 'Ref<"div">' is not assignable to type 'Ref<HTMLDivElement> | undefined'.
     ref: containerRef,
     "data-testid": "InfinitePagination",
     className: (0, _classify.default)(_InfinitePaginationModule.default.wrapper, classNames?.wrapper)

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

@@ -0,0 +1,2 @@
+export * from './InfinitePagination';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/InfinitePagination/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/lib/components/InlineDropdown/InlineDropdown.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import type { Flow } from 'flow-to-typescript-codemod';
+import type { ClickAwayRefType } from '../../utils/click-away';
+import type { UnstyledButtonProps } from '../Button';
+import type { AnchorType } from '../ButtonDropdown';
+import type { MenuOption, MenuProps } from '../Menu';
+import type { ElevationType } from '../Tooltip';
+type ClassNames = Readonly<{
+    buttonWrapper?: string;
+    dropdownContainer?: string;
+}>;
+export type InlineDropdownProps = ((UnstyledButtonProps) & {
+    classNames?: ClassNames;
+    menu?: MenuProps;
+    anchorPosition?: AnchorType;
+    onOptionSelect?: (option: MenuOption, arg2?: React.SyntheticEvent<HTMLElement> | null | undefined) => unknown;
+    onMenuOpen?: () => unknown;
+    onMenuClose?: () => unknown;
+    size?: 'medium' | 'small' | 'extraSmall';
+    elevation?: ElevationType;
+    clickAwayRef?: ClickAwayRefType;
+});
+export declare const InlineDropdown: Flow.AbstractComponent<InlineDropdownProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=InlineDropdown.d.ts.map

package/lib/components/InlineDropdown/InlineDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/InlineDropdown/InlineDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAKrD,OAAO,KAAK,EAAE,gBAAgB,EAAC,MAAM,wBAAwB,CAAC;AAG9D,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,WAAW,CAAC;AAEnD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,mBAAmB,CAAC;AAElD,OAAO,KAAK,EAAC,UAAU,EAAE,SAAS,EAAC,MAAM,SAAS,CAAC;AAEnD,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,YAAY,CAAC;AAO9C,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,CAAC,CAAC,mBAAmB,CAAC,GAAG;IACzD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,cAAc,CAAC,EAAE,CACf,MAAM,EAAE,UAAU,EAClB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,KACxD,OAAO,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC;IAC5B,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAC;IACzC,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,YAAY,CAAC,EAAE,gBAAgB,CAAC;CACjC,CAAC,CAAC;AAEH,eAAO,MAAM,cAAc,EAAE,IAAI,CAAC,iBAAiB,CAAC,mBAAmB,EAAE,cAAc,CA4HrF,CAAC"}