@common-origin/design-system 2.13.0 → 2.15.0

package/dist/tokens/types/tokens.d.ts

@@ -76,17 +76,29 @@ export declare const tokens: {
             "8": string;
             "9": string;
             "10": string;
+            "11": string;
             "12": string;
             "14": string;
+            "15": string;
             "16": string;
+            "18": string;
             "20": string;
             "24": string;
             "28": string;
+            "30": string;
             "32": string;
             "40": string;
+            "45": string;
             "48": string;
+            "50": string;
             "56": string;
             "64": string;
+            "75": string;
+            "90": string;
+            "100": string;
+            "140": string;
+            "180": string;
+            "192": string;
             auto: string;
             full: string;
             screen: string;
@@ -277,6 +289,7 @@ export declare const tokens: {
             "9": string;
             "10": string;
             "11": string;
+            none: string;
         };
         letterSpacing: {
             "0": string;
@@ -414,6 +427,9 @@ export declare const tokens: {
             };
         };
         chip: {
+            closeButton: {
+                size: string;
+            };
             default: {
                 backgroundColor: string;
                 textColor: string;
@@ -650,6 +666,9 @@ export declare const tokens: {
                 borderColor: string;
                 cursor: string;
             };
+            textarea: {
+                minHeight: string;
+            };
         };
         badge: {
             dot: {
@@ -659,11 +678,137 @@ export declare const tokens: {
                 minWidth: string;
                 height: string;
                 paddingX: string;
+                lineHeight: string;
             };
             ring: {
                 width: string;
             };
             borderRadius: string;
+            label: {
+                fontWeight: string;
+                typography: {
+                    small: string;
+                    medium: string;
+                };
+            };
+        };
+        field: {
+            gap: string;
+            label: {
+                typography: string;
+                color: string;
+                colorDisabled: string;
+                gap: string;
+            };
+            requiredIndicator: {
+                color: string;
+                fontWeight: string;
+            };
+            helperText: {
+                typography: string;
+                color: string;
+                colorError: string;
+            };
+        };
+        alert: {
+            title: {
+                typography: string;
+                fontWeight: string;
+                lineHeight: string;
+            };
+            message: {
+                typography: string;
+                lineHeight: string;
+            };
+        };
+        tabBar: {
+            badge: {
+                typography: string;
+                fontWeight: string;
+                size: string;
+            };
+            scrollbar: {
+                height: string;
+            };
+        };
+        searchField: {
+            sectionHeader: {
+                typography: string;
+                letterSpacing: string;
+            };
+        };
+        avatar: {
+            initials: {
+                fontFamily: string;
+                fontWeight: string;
+                lineHeight: string;
+                fontSize: {
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                };
+            };
+        };
+        codeBlock: {
+            fontFamily: string;
+            fontSize: string;
+            lineHeight: string;
+        };
+        slider: {
+            thumb: {
+                shadow: {
+                    default: string;
+                    hover: string;
+                    active: string;
+                };
+            };
+        };
+        accountCard: {
+            header: {
+                minHeight: string;
+            };
+            minWidth: string;
+        };
+        breadcrumbs: {
+            item: {
+                maxWidth: string;
+            };
+        };
+        cardLarge: {
+            maxWidth: string;
+        };
+        checkbox: {
+            box: {
+                size: string;
+            };
+            row: {
+                minHeight: string;
+            };
+        };
+        emptyState: {
+            illustration: {
+                small: string;
+                medium: string;
+                large: string;
+            };
+            maxWidth: string;
+            text: {
+                maxWidth: string;
+            };
+            actions: {
+                maxWidth: string;
+            };
+        };
+        listItem: {
+            expandedIndent: {
+                compact: string;
+                comfortable: string;
+            };
+        };
+        transactionListItem: {
+            minHeight: string;
         };
         $ref: string;
     };
@@ -676,12 +821,63 @@ export declare const tokens: {
             overlay: string;
             sticky: string;
         };
+        breakpoint: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            "2xl": string;
+        };
+        opacity: {
+            disabled: string;
+            full: string;
+        };
+        fontFamily: {
+            body: string;
+            monospace: string;
+        };
+        fontSize: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        lineHeight: {
+            none: string;
+            tight: string;
+            normal: string;
+        };
+        letterSpacing: {
+            tighter: string;
+            tight: string;
+            normal: string;
+            wide: string;
+        };
+        fontWeight: {
+            regular: string;
+            medium: string;
+            semibold: string;
+            bold: string;
+        };
+        zIndex: {
+            sticky: string;
+            dropdown: string;
+            overlay: string;
+            modal: string;
+        };
         border: {
             default: string;
             subtle: string;
             strong: string;
             focus: string;
             tooltip: string;
+            width: {
+                thin: string;
+                thick: string;
+            };
+            focusOffset: string;
             radius: {
                 none: string;
                 xs: string;
@@ -695,6 +891,31 @@ export declare const tokens: {
             };
         };
         size: {
+            touchTarget: string;
+            overlay: {
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            menu: {
+                maxHeight: string;
+            };
+            dimension: {
+                "1": string;
+                "5": string;
+                "8": string;
+                "12": string;
+                "15": string;
+                "18": string;
+                "20": string;
+                "30": string;
+                "45": string;
+                "50": string;
+                "75": string;
+                "90": string;
+                "100": string;
+                "192": string;
+            };
             icon: {
                 xs: string;
                 sm: string;
@@ -742,6 +963,7 @@ export declare const tokens: {
                 "8xl": string;
                 "9xl": string;
                 "10xl": string;
+                "11xl": string;
                 auto: string;
             };
         };
@@ -779,6 +1001,7 @@ export declare const tokens: {
                 overlay: string;
                 "hover-overlay": string;
                 "active-overlay": string;
+                "inverse-overlay": string;
             };
             border: {
                 default: string;
@@ -871,6 +1094,15 @@ export declare const tokens: {
             breadcrumb: string;
         };
         motion: {
+            duration: {
+                normal: string;
+                fast: string;
+                slow: string;
+            };
+            easing: {
+                easeInOut: string;
+                easeOut: string;
+            };
             transition: {
                 fast: string;
                 normal: string;

package/dist/types/tokens.d.ts

@@ -76,17 +76,29 @@ export declare const tokens: {
             "8": string;
             "9": string;
             "10": string;
+            "11": string;
             "12": string;
             "14": string;
+            "15": string;
             "16": string;
+            "18": string;
             "20": string;
             "24": string;
             "28": string;
+            "30": string;
             "32": string;
             "40": string;
+            "45": string;
             "48": string;
+            "50": string;
             "56": string;
             "64": string;
+            "75": string;
+            "90": string;
+            "100": string;
+            "140": string;
+            "180": string;
+            "192": string;
             auto: string;
             full: string;
             screen: string;
@@ -277,6 +289,7 @@ export declare const tokens: {
             "9": string;
             "10": string;
             "11": string;
+            none: string;
         };
         letterSpacing: {
             "0": string;
@@ -414,6 +427,9 @@ export declare const tokens: {
             };
         };
         chip: {
+            closeButton: {
+                size: string;
+            };
             default: {
                 backgroundColor: string;
                 textColor: string;
@@ -650,6 +666,9 @@ export declare const tokens: {
                 borderColor: string;
                 cursor: string;
             };
+            textarea: {
+                minHeight: string;
+            };
         };
         badge: {
             dot: {
@@ -659,11 +678,137 @@ export declare const tokens: {
                 minWidth: string;
                 height: string;
                 paddingX: string;
+                lineHeight: string;
             };
             ring: {
                 width: string;
             };
             borderRadius: string;
+            label: {
+                fontWeight: string;
+                typography: {
+                    small: string;
+                    medium: string;
+                };
+            };
+        };
+        field: {
+            gap: string;
+            label: {
+                typography: string;
+                color: string;
+                colorDisabled: string;
+                gap: string;
+            };
+            requiredIndicator: {
+                color: string;
+                fontWeight: string;
+            };
+            helperText: {
+                typography: string;
+                color: string;
+                colorError: string;
+            };
+        };
+        alert: {
+            title: {
+                typography: string;
+                fontWeight: string;
+                lineHeight: string;
+            };
+            message: {
+                typography: string;
+                lineHeight: string;
+            };
+        };
+        tabBar: {
+            badge: {
+                typography: string;
+                fontWeight: string;
+                size: string;
+            };
+            scrollbar: {
+                height: string;
+            };
+        };
+        searchField: {
+            sectionHeader: {
+                typography: string;
+                letterSpacing: string;
+            };
+        };
+        avatar: {
+            initials: {
+                fontFamily: string;
+                fontWeight: string;
+                lineHeight: string;
+                fontSize: {
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                };
+            };
+        };
+        codeBlock: {
+            fontFamily: string;
+            fontSize: string;
+            lineHeight: string;
+        };
+        slider: {
+            thumb: {
+                shadow: {
+                    default: string;
+                    hover: string;
+                    active: string;
+                };
+            };
+        };
+        accountCard: {
+            header: {
+                minHeight: string;
+            };
+            minWidth: string;
+        };
+        breadcrumbs: {
+            item: {
+                maxWidth: string;
+            };
+        };
+        cardLarge: {
+            maxWidth: string;
+        };
+        checkbox: {
+            box: {
+                size: string;
+            };
+            row: {
+                minHeight: string;
+            };
+        };
+        emptyState: {
+            illustration: {
+                small: string;
+                medium: string;
+                large: string;
+            };
+            maxWidth: string;
+            text: {
+                maxWidth: string;
+            };
+            actions: {
+                maxWidth: string;
+            };
+        };
+        listItem: {
+            expandedIndent: {
+                compact: string;
+                comfortable: string;
+            };
+        };
+        transactionListItem: {
+            minHeight: string;
         };
         $ref: string;
     };
@@ -676,12 +821,63 @@ export declare const tokens: {
             overlay: string;
             sticky: string;
         };
+        breakpoint: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            "2xl": string;
+        };
+        opacity: {
+            disabled: string;
+            full: string;
+        };
+        fontFamily: {
+            body: string;
+            monospace: string;
+        };
+        fontSize: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+        };
+        lineHeight: {
+            none: string;
+            tight: string;
+            normal: string;
+        };
+        letterSpacing: {
+            tighter: string;
+            tight: string;
+            normal: string;
+            wide: string;
+        };
+        fontWeight: {
+            regular: string;
+            medium: string;
+            semibold: string;
+            bold: string;
+        };
+        zIndex: {
+            sticky: string;
+            dropdown: string;
+            overlay: string;
+            modal: string;
+        };
         border: {
             default: string;
             subtle: string;
             strong: string;
             focus: string;
             tooltip: string;
+            width: {
+                thin: string;
+                thick: string;
+            };
+            focusOffset: string;
             radius: {
                 none: string;
                 xs: string;
@@ -695,6 +891,31 @@ export declare const tokens: {
             };
         };
         size: {
+            touchTarget: string;
+            overlay: {
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            menu: {
+                maxHeight: string;
+            };
+            dimension: {
+                "1": string;
+                "5": string;
+                "8": string;
+                "12": string;
+                "15": string;
+                "18": string;
+                "20": string;
+                "30": string;
+                "45": string;
+                "50": string;
+                "75": string;
+                "90": string;
+                "100": string;
+                "192": string;
+            };
             icon: {
                 xs: string;
                 sm: string;
@@ -742,6 +963,7 @@ export declare const tokens: {
                 "8xl": string;
                 "9xl": string;
                 "10xl": string;
+                "11xl": string;
                 auto: string;
             };
         };
@@ -779,6 +1001,7 @@ export declare const tokens: {
                 overlay: string;
                 "hover-overlay": string;
                 "active-overlay": string;
+                "inverse-overlay": string;
             };
             border: {
                 default: string;
@@ -871,6 +1094,15 @@ export declare const tokens: {
             breadcrumb: string;
         };
         motion: {
+            duration: {
+                normal: string;
+                fast: string;
+                slow: string;
+            };
+            easing: {
+                easeInOut: string;
+                easeOut: string;
+            };
             transition: {
                 fast: string;
                 normal: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@common-origin/design-system",
-  "version": "2.13.0",
+  "version": "2.15.0",
   "description": "Common Origin Design System - Framework-agnostic atomic design components with comprehensive WCAG 2.2 AA testing",
   "private": false,
   "main": "dist/index.js",
@@ -47,14 +47,14 @@
     "test:watch": "jest --watch",
     "test:coverage": "jest --coverage",
     "typecheck": "tsc --noEmit",
-    "lint": "eslint . --max-warnings 213",
-    "docs:generate": "node lib/docgen/generate.js",
+    "lint": "eslint . --max-warnings 195",
     "docs:dev": "npm run build:tokens && npm run dev",
     "verify:types": "node scripts/verify-types.cjs",
     "verify:no-nextjs": "node scripts/verify-no-nextjs-deps.cjs",
     "verify:consumer": "node scripts/verify-consumer-types.cjs",
     "verify:directives": "node scripts/verify-directives.cjs",
     "verify:load": "node scripts/verify-load.cjs",
+    "verify:docs": "node scripts/verify-docs.cjs",
     "verify:package": "npm run verify:types && npm run verify:no-nextjs && npm run verify:directives && npm run verify:load && npm run verify:consumer && publint && attw --pack . --ignore-rules unexpected-module-syntax",
     "prepublishOnly": "npm run build:tokens && npm run build:package && npm run verify:package",
     "version": "auto-changelog -p && git add CHANGELOG.md",
@@ -68,7 +68,6 @@
     "styled-components": "^6.0.0"
   },
   "dependencies": {
-    "@babel/runtime": "^7.0.0",
     "date-fns": "^4.1.0"
   },
   "devDependencies": {
@@ -78,7 +77,6 @@
     "@babel/preset-react": "^7.27.1",
     "@babel/preset-typescript": "^7.27.1",
     "@eslint/js": "^9.39.5",
-    "@hotjar/browser": "^1.0.9",
     "@rollup/plugin-babel": "^6.1.0",
     "@rollup/plugin-commonjs": "^24.0.0",
     "@rollup/plugin-json": "^6.1.0",
@@ -89,9 +87,10 @@
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^30.0.0",
     "@types/jest-axe": "^3.5.9",
-    "@types/node": "^18.0.3",
+    "@types/node": "^22.20.4",
     "@types/react": "^19.2.2",
     "@types/react-dom": "^19.2.2",
+    "@vercel/analytics": "^2.0.1",
     "auto-changelog": "^2.5.0",
     "babel-jest": "^30.0.2",
     "babel-plugin-styled-components": "^2.1.4",
@@ -114,7 +113,6 @@
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "style-dictionary": "^3.8.0",
     "styled-components": "^6.1.1",
-    "ts-morph": "^27.0.2",
     "typescript": "^5.7.3",
     "typescript-eslint": "^8.70.1"
   },