@westpac/ui 0.6.0 → 0.7.0

package/dist/components/flexi-cell/flexi-cell.stories.js

@@ -17,15 +17,13 @@ import { Badge, Button, Circle } from '../index.js';
 import { GiftPictogram } from '../pictogram/index.js';
 import { FlexiCell } from './flexi-cell.component.js';
 const meta = {
-    title: 'Example/FlexiCell',
+    title: 'Components/FlexiCell',
     component: FlexiCell,
     tags: [
         'autodocs'
     ],
     decorators: [
-        (Story)=>React.createElement("div", {
-                className: "p-3"
-            }, React.createElement(Story, null))
+        (Story)=>React.createElement(Story, null)
     ],
     argTypes: {
         after: {
@@ -82,13 +80,10 @@ const meta = {
                 name: 'boolean'
             }
         }
-    },
-    parameters: {
-        layout: 'fullscreen'
     }
 };
 export default meta;
-export const DefaultStory = {
+export const Default = {
     args: {
         tag: 'a',
         href: '#',
@@ -101,7 +96,7 @@ export const DefaultStory = {
         }, "Label"), React.createElement(FlexiCell.Hint, null, "Hint"))
     }
 };
-export const CreditCardStory = {
+export const CreditCard = {
     args: {
         tag: 'a',
         href: '#',
@@ -117,7 +112,7 @@ export const CreditCardStory = {
         }, "Credit card"), React.createElement(FlexiCell.Hint, null, "Card ending in 1234"))
     }
 };
-export const AccountStory = {
+export const Account = {
     args: {
         tag: 'a',
         href: '#',
@@ -133,7 +128,7 @@ export const AccountStory = {
         }, "Account"), React.createElement(FlexiCell.Hint, null, "032-123 12345678"))
     }
 };
-export const PayeeStory = {
+export const Payee = {
     args: {
         tag: 'a',
         href: '#',
@@ -155,7 +150,7 @@ export const PayeeStory = {
         }, "Payee details"))
     }
 };
-export const PayeeWithInfoStory = {
+export const PayeeWithInfo = {
     args: {
         withBorder: true,
         body: true,
@@ -181,7 +176,7 @@ export const PayeeWithInfoStory = {
         }, "Payee details"))
     }
 };
-export const FlagPayeeStory = {
+export const FlagPayee = {
     args: {
         withBorder: true,
         body: true,
@@ -204,7 +199,7 @@ export const FlagPayeeStory = {
         }, "Payee details"))
     }
 };
-export const ListItemWithFlagStory = {
+export const ListItemWithFlag = {
     args: {
         tag: 'a',
         href: '#',
@@ -216,7 +211,7 @@ export const ListItemWithFlagStory = {
         }, "List item")
     }
 };
-export const ListItemStory = {
+export const ListItem = {
     args: {
         tag: 'a',
         href: '#',
@@ -227,7 +222,7 @@ export const ListItemStory = {
         }, "List item")
     }
 };
-export const WestpacSpecialProductStory = {
+export const WestpacSpecialProduct = {
     args: {
         tag: 'a',
         href: '#',
@@ -248,7 +243,7 @@ export const WestpacSpecialProductStory = {
         }, "Westpac specials and product offers"), React.createElement(FlexiCell.Hint, null, "Discounts and cashback from select merchants & product offers from Westpac"))
     }
 };
-export const FlexiCellWithImageStory = {
+export const FlexiCellWithImage = {
     args: {
         tag: 'a',
         href: '#',
@@ -265,7 +260,7 @@ export const FlexiCellWithImageStory = {
         }, "Westpac specials and product offers"))
     }
 };
-export const StickyFooterExampleStory = {
+export const StickyFooterExample = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -340,7 +335,7 @@ const MOCK_ACCOUNTS = [
         ]
     }
 ];
-export const AccountListStory = {
+export const AccountList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -420,7 +415,7 @@ const MOCK_PAYEES = [
         ]
     }
 ];
-export const PayeeListStory = {
+export const PayeeList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -513,7 +508,7 @@ const MOCK_COUNTRIES = [
         ]
     }
 ];
-export const CountryListStory = {
+export const CountryList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -558,7 +553,7 @@ export const CountryListStory = {
             })))));
     }
 };
-export const ForeignCurrencyListStory = {
+export const ForeignCurrencyList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -643,7 +638,7 @@ const MOCK_PROMOS = [
         stars: false
     }
 ];
-export const PromotilesHorizontalListStory = {
+export const PromotilesHorizontalList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -678,7 +673,7 @@ export const PromotilesHorizontalListStory = {
         }));
     }
 };
-export const PromotilesVerticalListStory = {
+export const PromotilesVerticalList = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -733,7 +728,7 @@ const MOCK_PRODUCTS = [
         subtitle: 'This is more about the bonus and all the other exciting things about this.'
     }
 ];
-export const ProductTilesStory = {
+export const ProductTiles = {
     args: {},
     render: ()=>{
         return React.createElement("div", {

package/dist/components/flexi-cell/flexi-cell.styles.js

@@ -1,14 +1,14 @@
 import { tv } from 'tailwind-variants';
 export const styles = tv({
     slots: {
-        base: 'relative flex gap-2 bg-white p-2 transition-colors md:p-3',
+        base: 'relative flex gap-2 bg-white p-2 transition-colors xsl:p-3',
         bodyWrapper: 'flex flex-1 flex-col',
         badge: 'absolute right-0 top-0'
     },
     variants: {
         withBorder: {
             true: {
-                base: 'border-borderDark rounded border'
+                base: 'rounded border border-borderDark'
             },
             false: {}
         },

package/dist/components/form/components/form-chit-chat/form-chit-chat.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type FormChitChatProps } from './form-chit-chat.types.js';
-export declare function FormChitChat({ className, tag: Tag, children, ...props }: FormChitChatProps): JSX.Element;
+export declare function FormChitChat({ className, tag: Tag, children, ...props }: FormChitChatProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/components/form-group/form-group.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type FormGroupProps } from './form-group.types.js';
-export declare function FormGroup({ className, tag: Tag, children, ...props }: FormGroupProps): JSX.Element;
+export declare function FormGroup({ className, tag: Tag, children, ...props }: FormGroupProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/components/form-hint/form-hint.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
-import { type FormHintProps } from './form-hint.types.js';
-export declare function FormHint({ className, tag: Tag, children, ...props }: FormHintProps): JSX.Element;
+import { type FormHintProps } from '../../../index.js';
+export declare function FormHint({ ...props }: FormHintProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/components/form-hint/form-hint.component.js

@@ -13,14 +13,11 @@ function _extends() {
     return _extends.apply(this, arguments);
 }
 import React from 'react';
+import { FormHint as GelFormHint } from '../../../index.js';
 import { useFormContext } from '../../form.component.js';
-import { styles } from './form-hint.styles.js';
-export function FormHint({ className , tag: Tag = 'div' , children , ...props }) {
+export function FormHint({ ...props }) {
     const { spacing  } = useFormContext();
-    return React.createElement(Tag, _extends({
-        className: styles({
-            className,
-            spacing: spacing || 'medium'
-        })
-    }, props), children);
+    return React.createElement(GelFormHint, _extends({
+        spacing: spacing
+    }, props));
 }

package/dist/components/form/components/form-hint/index.d.ts

@@ -1,2 +1 @@
 export { FormHint } from './form-hint.component.js';
-export { type FormHintProps } from './form-hint.types.js';

package/dist/components/form/components/form-label/form-label.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
-import { type FormLabelProps } from './form-label.types.js';
-export declare function FormLabel({ className, tag: Tag, spacing, srOnly, children, subLabel, ...props }: FormLabelProps): JSX.Element;
+import { type FormLabelProps } from '../../../../index.js';
+export declare function FormLabel({ spacing, children, ...props }: FormLabelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/components/form-label/form-label.component.js

@@ -13,17 +13,12 @@ function _extends() {
     return _extends.apply(this, arguments);
 }
 import React from 'react';
-import { VisuallyHidden } from '../../../index.js';
+import { FormLabel as GELFormLabel } from '../../../index.js';
 import { useFormContext } from '../../form.component.js';
-import { styles } from './form-label.styles.js';
-export function FormLabel({ className , tag: Tag = 'label' , spacing , srOnly , children , subLabel =false , ...props }) {
+export function FormLabel({ spacing , children , ...props }) {
     const context = useFormContext();
     const finalSpacing = spacing || (context === null || context === void 0 ? void 0 : context.spacing) || 'medium';
-    return srOnly ? React.createElement(VisuallyHidden, null, children) : React.createElement(Tag, _extends({
-        className: styles({
-            className,
-            spacing: finalSpacing,
-            subLabel
-        })
-    }, props), children);
+    return React.createElement(GELFormLabel, _extends({}, props, {
+        spacing: finalSpacing
+    }), children);
 }

package/dist/components/form/components/form-label/index.d.ts

@@ -1,2 +1 @@
 export { FormLabel } from './form-label.component.js';
-export { type FormLabelProps } from './form-label.types.js';

package/dist/components/form/components/form-section/form-section.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type FormSectionProps } from './form-section.types.js';
-export declare function FormSection({ className, noPadding, tag: Tag, children, ...props }: FormSectionProps): JSX.Element;
+export declare function FormSection({ className, noPadding, tag: Tag, children, ...props }: FormSectionProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form/components/index.d.ts

@@ -1,4 +1,3 @@
-export * from './error-message/index.js';
 export * from './form-label/index.js';
 export * from './form-hint/index.js';
 export * from './form-chit-chat/index.js';

package/dist/components/form/components/index.js

@@ -1,4 +1,3 @@
-export * from './error-message/index.js';
 export * from './form-label/index.js';
 export * from './form-hint/index.js';
 export * from './form-chit-chat/index.js';

package/dist/components/form/form.component.d.ts

@@ -1,11 +1,10 @@
-/// <reference types="react" resolution-mode="require"/>
 import { FormChitChat, FormGroup, FormHint, FormLabel, FormSection } from './components/index.js';
 import { FormContextValue, type FormProps } from './form.types.js';
 export declare const useFormContext: () => FormContextValue;
-export declare function Form({ children, size, spacing, inline, ...props }: FormProps): JSX.Element;
+export declare function Form({ children, size, spacing, inline, ...props }: FormProps): import("react/jsx-runtime").JSX.Element;
 export declare namespace Form {
     var Label: typeof FormLabel;
-    var ErrorMessage: typeof import("./components/index.js").ErrorMessage;
+    var ErrorMessage: typeof import("../error-message/error-message.component.js").ErrorMessage;
     var Hint: typeof FormHint;
     var Section: typeof FormSection;
     var ChitChat: typeof FormChitChat;

package/dist/components/form/form.component.js

@@ -13,7 +13,8 @@ function _extends() {
     return _extends.apply(this, arguments);
 }
 import React, { createContext, useContext } from 'react';
-import { ErrorMessage, FormChitChat, FormGroup, FormHint, FormLabel, FormSection } from './components/index.js';
+import { ErrorMessage } from '../error-message/index.js';
+import { FormChitChat, FormGroup, FormHint, FormLabel, FormSection } from './components/index.js';
 const FormContext = createContext(null);
 export const useFormContext = ()=>useContext(FormContext) || {};
 export function Form({ children , size ='medium' , spacing ='medium' , inline =false , ...props }) {

package/dist/components/form/form.stories.d.ts

@@ -6,16 +6,16 @@ type Story = StoryObj<typeof meta>;
 /**
  * > Default size and spacing
  */
-export declare const DefaultStory: Story;
+export declare const Default: Story;
 /**
  * > Multiple errors
  */
-export declare const MultipleErrorsStory: Story;
+export declare const MultipleErrors: Story;
 /**
  * > All sizes Story
  */
-export declare const AllSizesStory: Story;
+export declare const AllSizes: Story;
 /**
  * > All spacings Story
  */
-export declare const AllSpacingsStory: Story;
+export declare const AllSpacings: Story;

package/dist/components/form/form.stories.js

@@ -1,20 +1,17 @@
 import { Input } from '../index.js';
 import { Form } from './form.component.js';
 const meta = {
-    title: 'Example/Form',
+    title: 'Components/Form',
     component: Form,
     tags: [
         'autodocs'
     ],
     decorators: [
         (Story)=>React.createElement(Story, null)
-    ],
-    parameters: {
-        layout: 'centered'
-    }
+    ]
 };
 export default meta;
-export const DefaultStory = {
+export const Default = {
     args: {},
     render: ()=>{
         return React.createElement(React.Fragment, null, React.createElement("h2", {
@@ -63,7 +60,7 @@ export const DefaultStory = {
         })))));
     }
 };
-export const MultipleErrorsStory = {
+export const MultipleErrors = {
     args: {},
     render: ()=>{
         return React.createElement(Form, null, React.createElement(Form.Label, null, "This is a label"), React.createElement(Form.Hint, null, "This is a hint"), React.createElement(Form.ErrorMessage, {
@@ -74,7 +71,7 @@ export const MultipleErrorsStory = {
         }), React.createElement(Input, null));
     }
 };
-export const AllSizesStory = {
+export const AllSizes = {
     args: {},
     render: ()=>{
         return React.createElement("div", {
@@ -89,7 +86,7 @@ export const AllSizesStory = {
             }), React.createElement(Input, null))));
     }
 };
-export const AllSpacingsStory = {
+export const AllSpacings = {
     args: {},
     render: ()=>{
         return React.createElement("div", {

package/dist/components/form-hint/form-hint.component.d.ts

@@ -0,0 +1,2 @@
+import { type FormHintProps } from './form-hint.types.js';
+export declare function FormHint({ className, tag: Tag, children, spacing, ...props }: FormHintProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form-hint/form-hint.component.js

@@ -0,0 +1,24 @@
+function _extends() {
+    _extends = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+import React from 'react';
+import { styles } from './form-hint.styles.js';
+export function FormHint({ className , tag: Tag = 'div' , children , spacing , ...props }) {
+    return React.createElement(Tag, _extends({
+        className: styles({
+            className,
+            spacing: spacing || 'medium'
+        })
+    }, props), children);
+}

package/dist/components/{form/components/form-hint → form-hint}/form-hint.types.d.ts

@@ -2,6 +2,10 @@ import { HTMLAttributes } from 'react';
 import { type VariantProps } from 'tailwind-variants';
 import { styles } from './form-hint.styles.js';
 export type FormHintProps = {
+    /**
+     * spacing
+     */
+    spacing?: 'medium' | 'large';
     /**
      * Tag to render
      */

package/dist/components/form-hint/index.d.ts

@@ -0,0 +1,2 @@
+export { FormHint } from './form-hint.component.js';
+export { type FormHintProps } from './form-hint.types.js';

package/dist/components/form-hint/index.js

@@ -0,0 +1 @@
+export { FormHint } from './form-hint.component.js';

package/dist/components/form-label/form-label.component.d.ts

@@ -0,0 +1,2 @@
+import { type FormLabelProps } from './form-label.types.js';
+export declare function FormLabel({ className, tag: Tag, spacing, srOnly, children, subLabel, ...props }: FormLabelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/form-label/form-label.component.js

@@ -0,0 +1,27 @@
+function _extends() {
+    _extends = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+import React from 'react';
+import { VisuallyHidden } from '../index.js';
+import { styles } from './form-label.styles.js';
+export function FormLabel({ className , tag: Tag = 'label' , spacing , srOnly , children , subLabel =false , ...props }) {
+    const finalSpacing = spacing || 'medium';
+    return srOnly ? React.createElement(VisuallyHidden, null, children) : React.createElement(Tag, _extends({
+        className: styles({
+            className,
+            spacing: finalSpacing,
+            subLabel
+        })
+    }, props), children);
+}

package/dist/components/form-label/form-label.types.js

@@ -0,0 +1 @@
+export { };

package/dist/components/form-label/index.d.ts

@@ -0,0 +1,2 @@
+export { FormLabel } from './form-label.component.js';
+export { type FormLabelProps } from './form-label.types.js';

package/dist/components/form-label/index.js

@@ -0,0 +1 @@
+export { FormLabel } from './form-label.component.js';

package/dist/components/grid/components/container/container.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type ContainerProps } from './container.types.js';
-export declare function Container({ className, tag: Tag, fixed, children, ...props }: ContainerProps): JSX.Element;
+export declare function Container({ className, tag: Tag, fixed, children, ...props }: ContainerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/grid/components/item/item.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type ItemProps } from './item.types.js';
-export declare function Item({ className, tag: Tag, span, start, children, ...props }: ItemProps): JSX.Element;
+export declare function Item({ className, tag: Tag, span, start, children, ...props }: ItemProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/grid/grid.component.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type GridProps } from './grid.types.js';
-export declare function Grid({ className, tag: Tag, children, ...props }: GridProps): JSX.Element;
+export declare function Grid({ className, tag: Tag, children, ...props }: GridProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/grid/grid.stories.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type Meta } from '@storybook/react';
 import { Grid } from './grid.component.js';
 declare const meta: Meta<typeof Grid>;
 export default meta;
-export declare const GridStory: () => JSX.Element;
-export declare const ContainerStory: () => JSX.Element;
-export declare const ItemStory: () => JSX.Element;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const DefaultContainer: () => import("react/jsx-runtime").JSX.Element;
+export declare const ResponsiveItems: () => import("react/jsx-runtime").JSX.Element;
+export declare const Positioning: () => import("react/jsx-runtime").JSX.Element;
+export declare const HolyGrailLayout: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/grid/grid.stories.js

@@ -1,36 +1,31 @@
 import { Container, Item } from './components/index.js';
 import { Grid } from './grid.component.js';
 const meta = {
-    title: 'Example/Grid',
+    title: 'Foundation/Grid',
     component: Grid,
     tags: [
         'autodocs'
     ],
     decorators: [
-        (Story)=>React.createElement("div", {
-                className: "mt-10"
-            }, React.createElement(Story, null))
-    ],
-    parameters: {
-        layout: 'fullscreen'
-    }
+        (Story)=>React.createElement(Story, null)
+    ]
 };
 export default meta;
-export const GridStory = ()=>{
+export const Default = ()=>{
     const items = Array(12).fill(null);
     return React.createElement(Grid, null, items.map((_, i)=>React.createElement(Item, {
             key: i,
             className: "border border-border bg-light p-2 text-center"
         }, i + 1)));
 };
-export const ContainerStory = ()=>{
+export const DefaultContainer = ()=>{
     const items = Array(12).fill(null);
     return React.createElement(Container, null, React.createElement(Grid, null, items.map((_, i)=>React.createElement(Item, {
             key: i,
             className: "border border-border bg-light p-2 text-center"
         }, i + 1))));
 };
-export const ItemStory = ()=>{
+export const ResponsiveItems = ()=>{
     return React.createElement(Container, null, React.createElement(Grid, null, React.createElement(Item, {
         span: {
             initial: 6,
@@ -43,9 +38,45 @@ export const ItemStory = ()=>{
             lg: 10
         },
         className: "border border-border bg-light p-2 text-center"
-    }, "span - (xs:6, lg:10)"), React.createElement(Item, {
+    }, "span - (xs:6, lg:10)")));
+};
+export const Positioning = ()=>{
+    return React.createElement(Container, null, React.createElement(Grid, null, React.createElement(Item, {
+        span: 4,
+        className: "border border-border bg-light p-2 text-center"
+    }, "Top Left"), React.createElement(Item, {
+        start: 9,
+        span: 4,
+        className: "border border-border bg-light p-2 text-center"
+    }, "Top Right"), React.createElement(Item, {
         start: 5,
         span: 4,
         className: "border border-border bg-light p-2 text-center"
-    }, "start:5 span:4")));
+    }, "Middle"), React.createElement(Item, {
+        start: 1,
+        span: 4,
+        className: "border border-border bg-light p-2 text-center"
+    }, "Bottom Left"), React.createElement(Item, {
+        start: 9,
+        span: 4,
+        className: "border border-border bg-light p-2 text-center"
+    }, "Bottom Right")));
+};
+export const HolyGrailLayout = ()=>{
+    return React.createElement(Container, null, React.createElement(Grid, null, React.createElement(Item, {
+        span: 12,
+        className: "h-12 border border-border bg-light p-2 text-center"
+    }, "Header"), React.createElement(Item, {
+        span: 3,
+        className: "h-10 border border-border bg-light p-2 text-center"
+    }, "Menu"), React.createElement(Item, {
+        span: 6,
+        className: "h-10 border border-border bg-light p-2 text-center"
+    }, "Content"), React.createElement(Item, {
+        span: 3,
+        className: "h-10 border border-border bg-light p-2 text-center"
+    }, "Ads"), React.createElement(Item, {
+        span: 12,
+        className: "h-12 border border-border bg-light p-2 text-center"
+    }, "Footer")));
 };

package/dist/components/icon/components/accessibility-icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type IconProps } from '../icon.types.js';
-export declare function AccessibilityIcon({ 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): JSX.Element;
+export declare function AccessibilityIcon({ 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/components/account-icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type IconProps } from '../icon.types.js';
-export declare function AccountIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): JSX.Element;
+export declare function AccountIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/components/add-circle-icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type IconProps } from '../icon.types.js';
-export declare function AddCircleIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): JSX.Element;
+export declare function AddCircleIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/components/add-icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type IconProps } from '../icon.types.js';
-export declare function AddIcon({ 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): JSX.Element;
+export declare function AddIcon({ 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/components/alert-icon.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" resolution-mode="require"/>
 import { type IconProps } from '../icon.types.js';
-export declare function AlertIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): JSX.Element;
+export declare function AlertIcon({ look, 'aria-label': ariaLabel, copyrightYear, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;