@gobolt/genesis 0.2.4 → 0.2.5

package/README.md

@@ -17,7 +17,6 @@ It unifies frontend app development around these core libraries:
 - [Typescript](https://www.typescriptlang.org/) v5
 - [React](https://react.dev/) v18
 
-This library is intended to be universally imported into both React & React-Native apps.
 
 ## 📦 Development
 

package/dist/_virtual/index5.cjs

@@ -1 +1 @@
-"use strict";const e=require("./_commonjsHelpers.cjs"),r=require("../node_modules/debounce/index.cjs");var o=r.__require();const s=e.getDefaultExportFromCjs(o);module.exports=s;
+"use strict";const r=require("./_commonjsHelpers.cjs"),e=require("../node_modules/copy-to-clipboard/index.cjs");var o=e.__require();const s=r.getDefaultExportFromCjs(o);module.exports=s;

package/dist/_virtual/index5.js

@@ -1,7 +1,7 @@
-import { getDefaultExportFromCjs as e } from "./_commonjsHelpers.js";
-import { __require as r } from "../node_modules/debounce/index.js";
-var o = /* @__PURE__ */ r();
-const a = /* @__PURE__ */ e(o);
+import { getDefaultExportFromCjs as o } from "./_commonjsHelpers.js";
+import { __require as r } from "../node_modules/copy-to-clipboard/index.js";
+var p = r();
+const a = /* @__PURE__ */ o(p);
 export {
   a as default
 };

package/dist/_virtual/index6.cjs

@@ -1 +1 @@
-"use strict";const r=require("./_commonjsHelpers.cjs"),e=require("../node_modules/copy-to-clipboard/index.cjs");var o=e.__require();const s=r.getDefaultExportFromCjs(o);module.exports=s;
+"use strict";const e=require("./_commonjsHelpers.cjs"),r=require("../node_modules/debounce/index.cjs");var o=r.__require();const s=e.getDefaultExportFromCjs(o);module.exports=s;

package/dist/_virtual/index6.js

@@ -1,7 +1,7 @@
-import { getDefaultExportFromCjs as o } from "./_commonjsHelpers.js";
-import { __require as r } from "../node_modules/copy-to-clipboard/index.js";
-var p = r();
-const a = /* @__PURE__ */ o(p);
+import { getDefaultExportFromCjs as e } from "./_commonjsHelpers.js";
+import { __require as r } from "../node_modules/debounce/index.js";
+var o = /* @__PURE__ */ r();
+const a = /* @__PURE__ */ e(o);
 export {
   a as default
 };

package/dist/components/Avatar/styles.cjs

@@ -1,3 +1,3 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../utils/styled.cjs"),a=require("../../node_modules/antd/es/avatar/index.cjs"),r=({colors:e,borderRadius:t,sizing:s},o="primary",c="active")=>"",n=i.styled(a)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),a=require("../../node_modules/antd/es/avatar/index.cjs"),r=({colors:e,borderRadius:t,sizing:s},o="primary",c="active")=>"",n=i(a)`
   ${({theme:e,type:t,state:s})=>r(e,t,s)}
 `;exports.Avatar=n;exports.getGenesisClass=r;

package/dist/components/Avatar/styles.d.ts

@@ -1,6 +1,17 @@
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledAvatarProps {
+    theme?: GenesisTheme;
+    type?: "primary" | "secondary";
+    state?: "active" | "disabled";
+}
 export declare const getGenesisClass: ({ colors, borderRadius, sizing }: {
     colors: any;
     borderRadius: any;
     sizing: any;
 }, type?: string, state?: string) => string;
-export declare const Avatar: any;
+export declare const Avatar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('antd').AvatarProps & import('react').RefAttributes<HTMLSpanElement>, "ref"> & {
+    ref?: import('react').Ref<HTMLSpanElement>;
+}, StyledAvatarProps>> & string & Omit<import('react').ForwardRefExoticComponent<import('antd').AvatarProps & import('react').RefAttributes<HTMLSpanElement>> & {
+    Group: import('react').FC<import('antd/es/avatar/AvatarGroup').AvatarGroupProps>;
+}, keyof import('react').Component<any, {}, any>>;
+export {};

package/dist/components/Avatar/styles.js

@@ -1,4 +1,4 @@
-import { styled as e } from "../../utils/styled.js";
+import e from "styled-components";
 import o from "../../node_modules/antd/es/avatar/index.js";
 const a = ({ colors: r, borderRadius: t, sizing: s }, i = "primary", m = "active") => "", c = e(o)`
   ${({ theme: r, type: t, state: s }) => a(r, t, s)}

package/dist/components/Badge/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../utils/styled.cjs"),a=(o,r)=>r==="hollow"?o.colors.inputs.surface.border:o.colors.status[r].surface,n=(o,r,d,s)=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),e=(o,r)=>r==="hollow"?o.colors.inputs.surface.border:o.colors.status[r].surface,n=(o,r,d,s)=>`
   display: flex;
   gap: 4px;
   justify-content: center;
@@ -9,7 +9,7 @@
   padding-left: ${o.components.badge["left-padding"]}px;
   padding-right: ${o.components.badge["right-padding"]}px;
   border-radius: ${o.components.badge.radius}px;
-  border: 1px solid ${a(o,r)};
+  border: 1px solid ${e(o,r)};
   background-color: ${o.colors.status[r].surface};
 
   &:not(:disabled):hover {
@@ -26,6 +26,6 @@
       cursor: not-allowed;
     }
   `:""}
-`,t=e.styled.div`
+`,t=a.div`
   ${({theme:o,state:r,label:d,disabled:s})=>n(o,r,d,s)}
 `;exports.Badge=t;exports.getGenesisClass=n;

package/dist/components/Badge/styles.d.ts

@@ -1,4 +1,11 @@
 import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
 import { State } from './Badge';
+interface StyledBadgeProps {
+    theme?: GenesisTheme;
+    state?: State;
+    label?: string;
+    disabled?: boolean;
+}
 export declare const getGenesisClass: (theme: GenesisTheme, state: State, label?: string, disabled?: boolean) => string;
-export declare const Badge: any;
+export declare const Badge: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledBadgeProps>> & string;
+export {};

package/dist/components/Badge/styles.js

@@ -1,4 +1,4 @@
-import { styled as n } from "../../utils/styled.js";
+import n from "styled-components";
 const a = (o, r) => r === "hollow" ? o.colors.inputs.surface.border : o.colors.status[r].surface, t = (o, r, s, d) => `
   display: flex;
   gap: 4px;

package/dist/components/Breadcrumb/styles.cjs

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("../../utils/styled.cjs"),i=require("../../node_modules/antd/es/breadcrumb/Breadcrumb.cjs"),a=({colors:e,typography:n},o="wide")=>`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("styled-components"),i=require("../../node_modules/antd/es/breadcrumb/Breadcrumb.cjs"),a=({colors:n,typography:e},o="wide")=>`
   &.ant-breadcrumb {
-    font-size: ${n[o].body1.fontSize};
+    font-size: ${e[o].body1.fontSize};
     
     .ant-breadcrumb-link,
     span[class*="ant-breadcrumb-link"] > a {
-      color: ${e.interactive.link.active};
+      color: ${n.interactive.link.active};
       transition: color 0.2s ease-in-out;
       text-decoration: underline;
       background: none !important;
@@ -16,14 +16,14 @@
       span[class*="ant-breadcrumb-link"] > span,
       span[class*="ant-breadcrumb-link"] > a {
         text-decoration: none !important;
-        color: ${e.onsurface["copy-light"]} !important;
+        color: ${n.onsurface["copy-light"]} !important;
         cursor: default !important;
         pointer-events: none;
       }
     }
  
     .ant-breadcrumb-separator {
-      color: ${e.interactive.link.active};
+      color: ${n.interactive.link.active};
     }
 
     .ant-dropdown-menu-item,
@@ -43,15 +43,15 @@
       background: none !important;
     }
   }
-`,s=r.styled.div`
-  ${({$isDisabled:e})=>e&&`
+`,s=r.div`
+  ${({$isDisabled:n})=>n&&`
       cursor: not-allowed;
       .ant-breadcrumb {
         pointer-events: none;
         opacity: 0.5;
       }
     `}
-  opacity: ${({$isDisabled:e})=>e?.5:1};
-`,t=r.styled(i)`
-  ${({theme:e,breakpoint:n})=>e&&a(e,n)}
+  opacity: ${({$isDisabled:n})=>n?.5:1};
+`,t=r(i)`
+  ${({theme:n,breakpoint:e})=>n&&a(n,e)}
 `;exports.Breadcrumb=t;exports.BreadcrumbWrapper=s;exports.default=t;exports.getGenesisClass=a;

package/dist/components/Breadcrumb/styles.d.ts

@@ -1,5 +1,26 @@
 import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledBreadcrumbProps {
+    theme?: GenesisTheme;
+    $isDisabled?: boolean;
+}
+interface StyledBreadcrumbComponentProps extends StyledBreadcrumbProps {
+    type?: string;
+    state?: string;
+    breakpoint?: string;
+    role?: string;
+}
 export declare const getGenesisClass: ({ colors, typography }: GenesisTheme, breakpoint?: string) => string;
-export declare const BreadcrumbWrapper: any;
-export declare const Breadcrumb: any;
+export declare const BreadcrumbWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledBreadcrumbProps>> & string;
+export declare const Breadcrumb: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('antd').BreadcrumbProps<import('antd/es/_util/type').AnyObject>, StyledBreadcrumbComponentProps>> & string & Omit<{
+    <T extends import('antd/es/_util/type').AnyObject = import('antd/es/_util/type').AnyObject>(props: import('antd').BreadcrumbProps<T>): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
+    Item: React.FC<import('antd').BreadcrumbItemProps> & {
+        __ANT_BREADCRUMB_ITEM: boolean;
+    };
+    Separator: React.FC<{
+        children?: React.ReactNode | undefined;
+    }> & {
+        __ANT_BREADCRUMB_SEPARATOR: boolean;
+    };
+    displayName: string;
+}, keyof import('react').Component<any, {}, any>>;
 export default Breadcrumb;

package/dist/components/Breadcrumb/styles.js

@@ -1,4 +1,4 @@
-import { styled as r } from "../../utils/styled.js";
+import r from "styled-components";
 import e from "../../node_modules/antd/es/breadcrumb/Breadcrumb.js";
 const o = ({ colors: n, typography: a }, t = "wide") => `
   &.ant-breadcrumb {

package/dist/components/Button/icon-button-styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../utils/styled.cjs"),e=(o,d)=>o==="small"?`${d.Size1}px ${d.Size1}px`:`${d.Size2}px ${d.Size2}px`,b=({colors:o,sizing:d,borderRadius:n,components:t},r,a,i,l)=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("styled-components"),e=(o,d)=>o==="small"?`${d.Size1}px ${d.Size1}px`:`${d.Size2}px ${d.Size2}px`,b=({colors:o,sizing:d,borderRadius:n,components:t},r,a,i,l)=>`
       display: flex;
       align-items: center;
       justify-content: center;
@@ -56,6 +56,6 @@
     `,c=(o,d,n,t,r)=>`
     font-family: 'Inter', sans-serif;
     ${b(o,d,n,t,r)}
-`,s=u.styled.button`
+`,s=u.button`
   ${({theme:o,$themeType:d,$state:n,size:t,$isSelected:r})=>c(o,d,n,t,r)}
 `;exports.Button=s;

package/dist/components/Button/icon-button-styles.d.ts

@@ -1 +1,12 @@
-export declare const Button: any;
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledIconButtonProps {
+    theme?: GenesisTheme;
+    $themeType?: "primary" | "secondary" | "tertiary" | "utility" | "icon";
+    $state?: "active" | "hover" | "pressed" | "focus" | "disabled" | "selected";
+    children?: React.ReactNode;
+    $isIconButton?: boolean;
+    $isSelected?: boolean;
+    size?: "small" | "normal" | "large";
+}
+export declare const Button: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, StyledIconButtonProps>> & string;
+export {};

package/dist/components/Button/icon-button-styles.js

@@ -1,4 +1,4 @@
-import { styled as u } from "../../utils/styled.js";
+import u from "styled-components";
 const b = (o, d) => o === "small" ? `${d.Size1}px ${d.Size1}px` : `${d.Size2}px ${d.Size2}px`, c = ({ colors: o, sizing: d, borderRadius: n, components: a }, r, i, t, l) => `
       display: flex;
       align-items: center;

package/dist/components/Button/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("../../utils/styled.cjs"),e=require("../../node_modules/antd/es/button/button.cjs"),i=(r,l,d,n)=>n&&(r==="normal"||r==="large")?`${d.Size2}px ${d.Size2}px`:n&&r==="small"?`${d.Size1}px ${d.Size1}px`:l==="utility"&&r==="small"?`${d.Size1_5}px ${d.Size2}px`:l==="utility"&&(r==="normal"||r==="large")?`${d.Size2_5}px ${d.Size3}px`:r==="small"?`${d.Size1_5}px ${d.Size4}px`:r==="normal"||r==="large"?`${d.Size2_5}px ${d.Size6}px`:`${d.Size2}px ${d.Size2}px`,c=r=>r==="normal"||r==="large"?"40px":r==="small"?"32px":"40px",x=({colors:r,sizing:l,borderRadius:d,components:n},o,a,t,u)=>(r[o][a].backgroundColor,`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("styled-components"),e=require("../../node_modules/antd/es/button/button.cjs"),i=(r,l,d,n)=>n&&(r==="normal"||r==="large")?`${d.Size2}px ${d.Size2}px`:n&&r==="small"?`${d.Size1}px ${d.Size1}px`:l==="utility"&&r==="small"?`${d.Size1_5}px ${d.Size2}px`:l==="utility"&&(r==="normal"||r==="large")?`${d.Size2_5}px ${d.Size3}px`:r==="small"?`${d.Size1_5}px ${d.Size4}px`:r==="normal"||r==="large"?`${d.Size2_5}px ${d.Size6}px`:`${d.Size2}px ${d.Size2}px`,c=r=>r==="normal"||r==="large"?"40px":r==="small"?"32px":"40px",x=({colors:r,sizing:l,borderRadius:d,components:n},o,a,t,u)=>(r[o][a].backgroundColor,`
       &.ant-btn {
       
         color: ${r[o][a].color};
@@ -61,6 +61,6 @@
  
       ${x(r,l,d,o,n)}
     } 
-`,p=b.styled(e)`
+`,p=b(e)`
   ${({theme:r,$themeType:l,$state:d,children:n,$isIconButton:o,size:a})=>f(r,l,d,o,a)}
 `;exports.Button=p;

package/dist/components/Button/styles.d.ts

@@ -1 +1,16 @@
-export declare const Button: any;
+import { ButtonProps as AntButtonProps } from 'antd/es/button';
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledButtonProps extends Omit<AntButtonProps, "type" | "size"> {
+    theme?: GenesisTheme;
+    $themeType?: "primary" | "secondary" | "tertiary" | "utility" | "icon";
+    $state?: "active" | "hover" | "pressed" | "focus" | "disabled" | "selected";
+    children?: React.ReactNode;
+    $isIconButton?: boolean;
+    size?: "small" | "normal" | "large";
+}
+export declare const Button: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<AntButtonProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>, "ref"> & {
+    ref?: import('react').Ref<HTMLAnchorElement | HTMLButtonElement>;
+}, StyledButtonProps>> & string & Omit<import('react').ForwardRefExoticComponent<AntButtonProps & import('react').RefAttributes<HTMLAnchorElement | HTMLButtonElement>> & {
+    Group: import('react').FC<import('antd/es/button').ButtonGroupProps>;
+}, keyof import('react').Component<any, {}, any>>;
+export {};

package/dist/components/Button/styles.js

@@ -1,4 +1,4 @@
-import { styled as b } from "../../utils/styled.js";
+import b from "styled-components";
 import x from "../../node_modules/antd/es/button/button.js";
 const i = (r, l, d, a) => a && (r === "normal" || r === "large") ? `${d.Size2}px ${d.Size2}px` : a && r === "small" ? `${d.Size1}px ${d.Size1}px` : l === "utility" && r === "small" ? `${d.Size1_5}px ${d.Size2}px` : l === "utility" && (r === "normal" || r === "large") ? `${d.Size2_5}px ${d.Size3}px` : r === "small" ? `${d.Size1_5}px ${d.Size4}px` : r === "normal" || r === "large" ? `${d.Size2_5}px ${d.Size6}px` : `${d.Size2}px ${d.Size2}px`, c = (r) => r === "normal" || r === "large" ? "40px" : r === "small" ? "32px" : "40px", e = ({ colors: r, sizing: l, borderRadius: d, components: a }, o, n, t, u) => (r[o][n].backgroundColor, `
       &.ant-btn {

package/dist/components/Card/styles.cjs

@@ -1,6 +1,6 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../utils/styled.cjs"),a=require("../../node_modules/antd/es/card/index.cjs"),r=({colors:e,borderRadius:s,sizing:t},o="primary",c="active")=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),a=require("../../node_modules/antd/es/card/index.cjs"),t=({colors:e,borderRadius:s,sizing:r},o="primary",c="active")=>`
   .class-name-here {
    } 
- `,n=i.styled(a)`
-  ${({theme:e,type:s,state:t})=>r(e,s,t)}
-`;exports.Card=n;exports.getGenesisClass=r;
+ `,n=i(a)`
+  ${({theme:e,type:s,state:r})=>t(e,s,r)}
+`;exports.Card=n;exports.getGenesisClass=t;

package/dist/components/Card/styles.d.ts

@@ -1,6 +1,15 @@
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledCardProps {
+    theme?: GenesisTheme;
+    type?: "primary" | "secondary";
+    state?: "active" | "disabled";
+}
 export declare const getGenesisClass: ({ colors, borderRadius, sizing }: {
     colors: any;
     borderRadius: any;
     sizing: any;
 }, type?: string, state?: string) => string;
-export declare const Card: any;
+export declare const Card: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('antd').CardProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}, StyledCardProps>> & string & Omit<import('antd/es/card').CardInterface, keyof import('react').Component<any, {}, any>>;
+export {};

package/dist/components/Card/styles.js

@@ -1,4 +1,4 @@
-import { styled as t } from "../../utils/styled.js";
+import t from "styled-components";
 import o from "../../node_modules/antd/es/card/index.js";
 const a = ({ colors: r, borderRadius: e, sizing: s }, i = "primary", m = "active") => `
   .class-name-here {

package/dist/components/Checkbox/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../utils/styled.cjs"),b=require("../../node_modules/antd/es/checkbox/index.cjs"),r=({colors:e,borderRadius:c},o="primary",n="active")=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),b=require("../../node_modules/antd/es/checkbox/index.cjs"),r=({colors:e,borderRadius:c},o="primary",n="active")=>`
   .ant-checkbox-inner {
     background-color: #FFFFFF;
     border-color: #9A9A9A;
@@ -137,6 +137,6 @@
     border-color: #9A9A9A;
     transition: box-shadow 0.2s ease-in-out;
   }
-`,t=a.styled(b)`
+`,t=a(b)`
   ${({theme:e,type:c,state:o})=>r(e,c,o)}
 `;exports.StyledCheckbox=t;exports.getGenesisClass=r;

package/dist/components/Checkbox/styles.d.ts

@@ -1,3 +1,4 @@
+import { CheckboxProps } from './Checkbox';
 import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
 declare module "styled-components" {
     interface DefaultTheme extends GenesisTheme {
@@ -7,4 +8,8 @@ export declare const getGenesisClass: ({ colors, borderRadius }: {
     colors: any;
     borderRadius: any;
 }, type?: string, state?: string) => string;
-export declare const StyledCheckbox: any;
+export declare const StyledCheckbox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('antd').CheckboxProps & import('react').RefAttributes<import('rc-checkbox').CheckboxRef>, "ref"> & {
+    ref?: import('react').Ref<import('rc-checkbox').CheckboxRef>;
+}, CheckboxProps>> & string & Omit<import('react').ForwardRefExoticComponent<import('antd').CheckboxProps & import('react').RefAttributes<import('rc-checkbox').CheckboxRef>> & {
+    Group: <T = any>(props: import('antd/es/checkbox').CheckboxGroupProps<T> & React.RefAttributes<HTMLDivElement>) => React.ReactElement;
+}, keyof import('react').Component<any, {}, any>>;

package/dist/components/Checkbox/styles.js

@@ -1,4 +1,4 @@
-import { styled as n } from "../../utils/styled.js";
+import n from "styled-components";
 import b from "../../node_modules/antd/es/checkbox/index.js";
 const a = ({ colors: o, borderRadius: c }, e = "primary", r = "active") => `
   .ant-checkbox-inner {

package/dist/components/Dashboard/styles.d.ts

@@ -1,6 +1,13 @@
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledDashboardProps {
+    theme?: GenesisTheme;
+    type?: "primary" | "secondary";
+    state?: "active" | "disabled";
+}
 export declare const getGenesisClass: ({ colors, borderRadius, sizing }: {
     colors: any;
     borderRadius: any;
     sizing: any;
 }, type?: string, state?: string) => string;
-export declare const StyledDashboard: any;
+export declare const StyledDashboard: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledDashboardProps>> & string;
+export {};

package/dist/components/ErrorBoundary/styles.d.ts

@@ -1,6 +1,13 @@
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledErrorBoundaryProps {
+    theme?: GenesisTheme;
+    type?: "primary" | "secondary";
+    state?: "active" | "disabled";
+}
 export declare const getGenesisClass: ({ colors, borderRadius, sizing }: {
     colors: any;
     borderRadius: any;
     sizing: any;
 }, type?: string, state?: string) => string;
-export declare const StyledErrorBoundary: any;
+export declare const StyledErrorBoundary: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledErrorBoundaryProps>> & string;
+export {};

package/dist/components/ErrorBoundaryFallback/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../utils/styled.cjs"),t=require("../../node_modules/antd/es/result/index.cjs"),r=e.styled(t.default)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),t=require("../../node_modules/antd/es/result/index.cjs"),r=e(t.default)`
   height: 100vh;
   display: flex;
   flex-direction: column;

package/dist/components/ErrorBoundaryFallback/styles.d.ts

@@ -1 +1 @@
-export declare const StyledErrorBoundaryFallback: any;
+export declare const StyledErrorBoundaryFallback: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('antd').ResultProps, never>> & string & Omit<import('antd/es/result').ResultType, keyof import('react').Component<any, {}, any>>;

package/dist/components/ErrorBoundaryFallback/styles.js

@@ -1,4 +1,4 @@
-import { styled as t } from "../../utils/styled.js";
+import t from "styled-components";
 import e from "../../node_modules/antd/es/result/index.js";
 const l = t(e)`
   height: 100vh;

package/dist/components/Form/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../utils/styled.cjs"),t=require("../../node_modules/antd/es/form/index.cjs"),r=e.styled(t)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("styled-components"),t=require("../../node_modules/antd/es/form/index.cjs"),r=e(t)`
   label,
   .ant-form-item-label > label,
   .ant-form-item-required,

package/dist/components/Form/styles.js

@@ -1,4 +1,4 @@
-import { styled as t } from "../../utils/styled.js";
+import t from "styled-components";
 import o from "../../node_modules/antd/es/form/index.js";
 const e = t(o)`
   label,

package/dist/components/Glyph/styles.d.ts

@@ -1,6 +1,13 @@
+import { GenesisTheme } from '../../styles/theme/genesis-theme.types';
+interface StyledGlyphProps {
+    theme?: GenesisTheme;
+    type?: "primary" | "secondary";
+    state?: "active" | "disabled";
+}
 export declare const getGenesisClass: ({ colors, borderRadius, sizing }: {
     colors: any;
     borderRadius: any;
     sizing: any;
 }, type?: string, state?: string) => string;
-export declare const StyledGlyph: any;
+export declare const StyledGlyph: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledGlyphProps>> & string;
+export {};

package/dist/components/Input/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../../utils/styled.cjs"),i=require("../../constants/index.cjs"),p=require("../../node_modules/antd/es/input/index.cjs"),x=(o,n,e)=>{const r={color:o.inputs.onsurface.active,borderColor:o[i.TYPE.secondary].active.borderColor,ringColor:o[n].focussed.ringColor},s={color:o.status.success.default,borderColor:o.status.success.default,ringColor:o.status.success.ringColor},u={color:o.status.error.default,borderColor:o.status.error.default,ringColor:o.status.error.ringColor},a=e!==i.STATE.error&&e!==i.STATE.success&&e!==i.STATE.filled?{color:o.inputs.onsurface.active,backgroundColor:o.inputs.surface.active,borderColor:o.inputs.surface.border,ringColor:o[n][e].ringColor}:null;return{filled:r,error:u,success:s,themeState:a}[(d=>[i.STATE.filled,i.STATE.error,i.STATE.success].includes(d)?d:"themeState")(e)]},g=({colors:o,borderRadius:n,components:e},r,s,u,a)=>{const t=x(o,r,s),l=(f,d)=>d&&!f?`${n.BorderRadiusMd}px 0px 0px ${n.BorderRadiusMd}px`:f&&!d?`0px ${n.BorderRadiusMd}px ${n.BorderRadiusMd}px 0px`:"0px";return`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("styled-components"),i=require("../../constants/index.cjs"),p=require("../../node_modules/antd/es/input/index.cjs"),x=(o,n,e)=>{const r={color:o.inputs.onsurface.active,borderColor:o[i.TYPE.secondary].active.borderColor,ringColor:o[n].focussed.ringColor},s={color:o.status.success.default,borderColor:o.status.success.default,ringColor:o.status.success.ringColor},u={color:o.status.error.default,borderColor:o.status.error.default,ringColor:o.status.error.ringColor},a=e!==i.STATE.error&&e!==i.STATE.success&&e!==i.STATE.filled?{color:o.inputs.onsurface.active,backgroundColor:o.inputs.surface.active,borderColor:o.inputs.surface.border,ringColor:o[n][e].ringColor}:null;return{filled:r,error:u,success:s,themeState:a}[(d=>[i.STATE.filled,i.STATE.error,i.STATE.success].includes(d)?d:"themeState")(e)]},g=({colors:o,borderRadius:n,components:e},r,s,u,a)=>{const t=x(o,r,s),l=(f,d)=>d&&!f?`${n.BorderRadiusMd}px 0px 0px ${n.BorderRadiusMd}px`:f&&!d?`0px ${n.BorderRadiusMd}px ${n.BorderRadiusMd}px 0px`:"0px";return`
     &.ant-input {
         font-family: 'Inter', sans-serif;
         color: ${t.color};
@@ -86,6 +86,6 @@
         padding-bottom: ${e.input.suffixPrefixVerPadding};
       }
     }
-  `},b=c.styled(p)`
+  `},b=c(p)`
   ${({theme:o,state:n,type:e=i.TYPE.primary,...r})=>{const s=!!r.addonBefore,u=!!r.addonAfter;return g(o,e,n,s,u)}}
 `;exports.Input=b;

package/dist/components/Input/styles.d.ts

@@ -1 +1,15 @@
-export declare const Input: any;
+import { InputProps as AntInputProps } from 'antd';
+import { STATE } from '../../constants';
+interface InputStyledProps extends AntInputProps {
+    state?: keyof typeof STATE;
+}
+export declare const Input: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<AntInputProps & import('react').RefAttributes<import('rc-input').InputRef>, "ref"> & {
+    ref?: import('react').Ref<import('rc-input').InputRef>;
+}, InputStyledProps>> & string & Omit<import('react').ForwardRefExoticComponent<AntInputProps & import('react').RefAttributes<import('rc-input').InputRef>> & {
+    Group: import('react').FC<import('antd/es/input').GroupProps>;
+    Search: import('react').ForwardRefExoticComponent<import('antd/es/input').SearchProps & import('react').RefAttributes<import('rc-input').InputRef>>;
+    TextArea: import('react').ForwardRefExoticComponent<import('antd/es/input').TextAreaProps & import('react').RefAttributes<import('antd/es/input/TextArea').TextAreaRef>>;
+    Password: import('react').ForwardRefExoticComponent<import('antd/es/input').PasswordProps & import('react').RefAttributes<import('rc-input').InputRef>>;
+    OTP: import('react').ForwardRefExoticComponent<import('antd/es/input/OTP').OTPProps & import('react').RefAttributes<import('antd/es/input/OTP').OTPRef>>;
+}, keyof import('react').Component<any, {}, any>>;
+export {};

package/dist/components/Input/styles.js

@@ -1,4 +1,4 @@
-import { styled as c } from "../../utils/styled.js";
+import c from "styled-components";
 import { TYPE as l, STATE as i } from "../../constants/index.js";
 import x from "../../node_modules/antd/es/input/index.js";
 const g = (o, n, e) => {

package/dist/components/Layout/Content/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../utils/styled.cjs"),i=({sizing:e},t)=>`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("styled-components"),i=({sizing:e},t)=>`
   display: flex;
   flex-direction: ${t?"column":"row"};
   width: 100%;
@@ -6,6 +6,6 @@
   padding: ${e.Size4}px;
   margin: 0;
   box-sizing: border-box;
- `,s=n.styled.div`
+ `,s=n.div`
   ${({theme:e,$isColumn:t})=>i(e,t)}
 `;exports.Content=s;exports.getGenesisClass=i;

package/dist/components/Layout/Content/styles.d.ts

@@ -1,4 +1,10 @@
+import { GenesisTheme } from '../../../styles/theme/genesis-theme.types';
+interface StyledContentProps {
+    theme?: GenesisTheme;
+    $isColumn?: boolean;
+}
 export declare const getGenesisClass: ({ sizing }: {
     sizing: any;
 }, $isColumn: any) => string;
-export declare const Content: any;
+export declare const Content: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledContentProps>> & string;
+export {};

package/dist/components/Layout/Content/styles.js

@@ -1,4 +1,4 @@
-import { styled as o } from "../../../utils/styled.js";
+import o from "styled-components";
 const t = ({ sizing: e }, i) => `
   display: flex;
   flex-direction: ${i ? "column" : "row"};

package/dist/components/Layout/MainLayout/styles.d.ts

@@ -1,4 +1,4 @@
-export declare const Sidebar: any;
-export declare const Header: any;
-export declare const Main: any;
-export declare const Footer: any;
+export declare const Sidebar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Header: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Main: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Footer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/Message/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../utils/styled.cjs"),i=require("../../constants/index.cjs"),r=o.styled.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("styled-components"),i=require("../../constants/index.cjs"),r=o.div`
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -9,7 +9,7 @@
   pointer-events: none;
   cursor: default;
   border-radius: ${({theme:e})=>e.borderRadius.BorderRadiusSm}px;
-`,s=o.styled.div`
+`,a=o.div`
   display: flex;
   align-items: center;
   gap: ${({theme:e})=>e.sizing.Size2}px;
@@ -24,7 +24,7 @@
     line-height: ${({theme:e,size:t})=>t===i.SIZE.standard?e.typography.lineHeight:"23px"};
     font-size: ${({theme:e,size:t})=>t==="standard"?e.typography.body2:e.typography.body1};
   }
-`,a=o.styled.button`
+`,s=o.button`
   text-decoration: underline;
   border: none;
   background: none;
@@ -35,4 +35,4 @@
   &:hover {
     color: ${({theme:e})=>e.colors.interactive.link.hover};
   }
-`;exports.ActionButton=a;exports.MessageContent=s;exports.MessageRow=r;
+`;exports.ActionButton=s;exports.MessageContent=a;exports.MessageRow=r;

package/dist/components/Message/styles.d.ts

@@ -1,3 +1,9 @@
-export declare const MessageRow: any;
-export declare const MessageContent: any;
-export declare const ActionButton: any;
+export declare const MessageRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    state: string;
+    size: string;
+}>> & string;
+export declare const MessageContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    size?: string;
+    action?: unknown;
+}>> & string;
+export declare const ActionButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;

package/dist/components/Message/styles.js

@@ -1,4 +1,4 @@
-import { styled as o } from "../../utils/styled.js";
+import o from "styled-components";
 import { SIZE as n } from "../../constants/index.js";
 const s = o.div`
   display: flex;