@spaced-out/ui-design-system 0.5.21 → 0.5.23

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.5.23](https://github.com/spaced-out/ui-design-system/compare/v0.5.22...v0.5.23) (2025-11-18)
+
+
+### Features
+
+* rightSlot for input, searchinput and typeahead [GDS-550] ([#433](https://github.com/spaced-out/ui-design-system/issues/433)) ([bad66cd](https://github.com/spaced-out/ui-design-system/commit/bad66cd5247da87409f8214b084c89c0f95353c5))
+
+### [0.5.22](https://github.com/spaced-out/ui-design-system/compare/v0.5.21...v0.5.22) (2025-11-12)
+
+
+### Bug Fixes
+
+* add context aware results and utils and types info ([#431](https://github.com/spaced-out/ui-design-system/issues/431)) ([743fecf](https://github.com/spaced-out/ui-design-system/commit/743fecf93625edd13800e345c408343eff773748))
+
 ### [0.5.21](https://github.com/spaced-out/ui-design-system/compare/v0.5.20...v0.5.21) (2025-11-12)
 
 

package/lib/components/Input/Input.d.ts

@@ -7,6 +7,7 @@ type ClassNames = Readonly<{
     iconRight?: string;
     wrapper?: string;
     prefixText?: string;
+    rightSlotContent?: string;
 }>;
 export declare const EXPONENT_CHARACTER_LIST: string[];
 export declare const INPUT_TYPES: Readonly<{
@@ -47,6 +48,7 @@ export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElem
     errorText?: string;
     label?: string | React.ReactNode;
     helperText?: string | React.ReactNode;
+    rightSlot?: React.ReactNode;
     type?: InputType;
     size?: 'medium' | 'small';
     iconLeftName?: string;

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

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/Input/Input.tsx"],"names":[],"mappings":"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"}

package/lib/components/Input/Input.js

@@ -48,6 +48,7 @@ const Input_ = (props, ref) => {
     errorText,
     label,
     helperText,
+    rightSlot,
     classNames,
     size = 'medium',
     iconLeftName = '',
@@ -137,7 +138,7 @@ const Input_ = (props, ref) => {
           children: '*'
         })]
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       "data-testid": (0, _qa.generateTestId)({
         base: testId,
         slot: 'box'
@@ -152,73 +153,94 @@ const Input_ = (props, ref) => {
       }, classNames?.box),
       onClick: !(disabled || locked) ? onContainerClick : undefined,
       ref: boxRef,
-      children: [iconLeftName && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
-        testId: (0, _qa.generateTestId)({
-          base: testId,
-          slot: 'iconLeft'
-        }),
-        className: (0, _classify.classify)(classNames?.iconLeft),
-        name: iconLeftName,
-        color: disabled ? 'disabled' : 'secondary',
-        size: "small",
-        type: iconLeftType
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ConditionalWrapper.ConditionalWrapper, {
-        condition: !(0, _isEmpty.default)(prefix),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ConditionalWrapper.ConditionalWrapper, {
+        condition: !!rightSlot,
         wrapper: children => /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
-          className: _InputModule.default.prefixContainer,
+          className: _InputModule.default.rightSlotContainer,
           "data-testid": (0, _qa.generateTestId)({
             base: testId,
-            slot: 'prefixContainer'
+            slot: 'rightSlotContainer'
           }),
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            className: (0, _classify.classify)(_InputModule.default.prefixText, classNames?.prefixText),
+          children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: (0, _classify.classify)(_InputModule.default.rightSlotContent, classNames?.rightSlotContent),
             "data-testid": (0, _qa.generateTestId)({
               base: testId,
-              slot: 'prefixText'
+              slot: 'rightSlotContainer'
             }),
-            children: prefix
-          }), children]
+            onClick: e => {
+              e.preventDefault();
+            },
+            children: rightSlot
+          })]
         }),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
-          ...inputProps,
+        children: [iconLeftName && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+          testId: (0, _qa.generateTestId)({
+            base: testId,
+            slot: 'iconLeft'
+          }),
+          className: (0, _classify.classify)(classNames?.iconLeft),
+          name: iconLeftName,
+          color: disabled ? 'disabled' : 'secondary',
+          size: "small",
+          type: iconLeftType
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ConditionalWrapper.ConditionalWrapper, {
+          condition: !(0, _isEmpty.default)(prefix),
+          wrapper: children => /*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
+            className: _InputModule.default.prefixContainer,
+            "data-testid": (0, _qa.generateTestId)({
+              base: testId,
+              slot: 'prefixContainer'
+            }),
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              className: (0, _classify.classify)(_InputModule.default.prefixText, classNames?.prefixText),
+              "data-testid": (0, _qa.generateTestId)({
+                base: testId,
+                slot: 'prefixText'
+              }),
+              children: prefix
+            }), children]
+          }),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+            ...inputProps,
+            "data-testid": (0, _qa.generateTestId)({
+              base: testId,
+              slot: 'input'
+            }),
+            disabled: locked || disabled,
+            name: name,
+            ref: inputRef,
+            placeholder: placeholder,
+            value: value,
+            onChange: onChange,
+            onFocus: onFocus,
+            onBlur: onBlur,
+            type: showPassword ? 'text' : type,
+            readOnly: readOnly,
+            onKeyDown: handleKeyDown
+          })
+        }), type === 'color' && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           "data-testid": (0, _qa.generateTestId)({
             base: testId,
-            slot: 'input'
+            slot: 'colorText'
           }),
-          disabled: locked || disabled,
-          name: name,
-          ref: inputRef,
-          placeholder: placeholder,
-          value: value,
-          onChange: onChange,
-          onFocus: onFocus,
-          onBlur: onBlur,
-          type: showPassword ? 'text' : type,
-          readOnly: readOnly,
-          onKeyDown: handleKeyDown
-        })
-      }), type === 'color' && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        "data-testid": (0, _qa.generateTestId)({
-          base: testId,
-          slot: 'colorText'
-        }),
-        className: (0, _classify.classify)(_InputModule.default.colorText, _InputModule.default[size], {
-          [_InputModule.default.hasValue]: value
-        }),
-        children: value ? value : placeholder
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(RightInputIcon, {
-        testId: testId,
-        isEmail: type === 'email',
-        isPassword: type === 'password',
-        showPassword: showPassword,
-        showPasswordToggleIcon: !hidePasswordToggleIcon,
-        isLocked: locked,
-        isDisabled: disabled,
-        onClick: handleRightIconClick,
-        iconRightName: iconRightName,
-        iconRightType: iconRightType,
-        className: classNames?.iconRight
-      })]
+          className: (0, _classify.classify)(_InputModule.default.colorText, _InputModule.default[size], {
+            [_InputModule.default.hasValue]: value
+          }),
+          children: value ? value : placeholder
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(RightInputIcon, {
+          testId: testId,
+          isEmail: type === 'email',
+          isPassword: type === 'password',
+          showPassword: showPassword,
+          showPasswordToggleIcon: !hidePasswordToggleIcon,
+          isLocked: locked,
+          isDisabled: disabled,
+          onClick: handleRightIconClick,
+          iconRightName: iconRightName,
+          iconRightType: iconRightType,
+          className: classNames?.iconRight
+        })]
+      })
     }), (Boolean(helperText) || error) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       "data-testid": (0, _qa.generateTestId)({
         base: testId,

package/lib/components/Input/Input.module.css

@@ -203,3 +203,26 @@ input::placeholder {
     min-width: size18;
   }
 }
+
+.rightSlotContainer {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: spaceXSmall;
+  width: sizeFluid;
+  cursor: inherit;
+  padding-left: size2;
+  overflow-y: auto;
+
+  & .rightSlotContent {
+    color: colorTextTertiary;
+    padding: 0 spaceXSmall;
+    width: max-content;
+    min-width: max-content;
+  }
+
+  & input {
+    padding-left: spaceNone;
+    min-width: size18;
+  }
+}

package/lib/components/SearchInput/SearchInput.d.ts

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import type { Flow } from 'flow-to-typescript-codemod';
 import type { InputProps } from '../../components/Input';
 type ClassNames = Readonly<{
@@ -10,6 +11,7 @@ export interface SearchInputProps extends Omit<InputProps, 'classNames' | 'onCle
     onClear?: () => void;
     isLoading?: boolean;
     testId?: string;
+    rightSlot?: React.ReactNode;
 }
 export declare const SearchInput: Flow.AbstractComponent<SearchInputProps, HTMLInputElement>;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAMrD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAMrD,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,YAAY,GAAG,SAAS,GAAG,WAAW,CAAC;IAChE,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAC9C,gBAAgB,EAChB,gBAAgB,CAqEjB,CAAC"}
+{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAMrD,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AAMrD,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,UAAU,EAAE,YAAY,GAAG,SAAS,GAAG,WAAW,CAAC;IAChE,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,eAAO,MAAM,WAAW,EAAE,IAAI,CAAC,iBAAiB,CAC9C,gBAAgB,EAChB,gBAAgB,CAuEjB,CAAC"}

package/lib/components/SearchInput/SearchInput.js

@@ -25,6 +25,7 @@ const SearchInput = exports.SearchInput = /*#__PURE__*/React.forwardRef((_ref, r
     size,
     iconLeftName = 'magnifying-glass',
     testId,
+    rightSlot,
     ...searchInputProps
   } = _ref;
   const handleClearClick = () => {
@@ -58,7 +59,8 @@ const SearchInput = exports.SearchInput = /*#__PURE__*/React.forwardRef((_ref, r
       testId: (0, _qa.generateTestId)({
         base: testId,
         slot: 'input'
-      })
+      }),
+      rightSlot: rightSlot
     }), isLoading && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classify.default)(_SearchInputModule.default.loaderContainer, {
         [_SearchInputModule.default.small]: size === 'small'

package/lib/components/Typeahead/Typeahead.d.ts

@@ -22,6 +22,7 @@ interface BaseTypeaheadProps extends Omit<InputProps, 'classNames' | 'onSelect'
     clickAwayRef?: React.RefObject<ClickAwayRefType | null>;
     elevation?: ElevationType;
     testId?: string;
+    rightSlot?: React.ReactNode;
 }
 export interface TypeaheadProps extends Omit<BaseTypeaheadProps, 'allowInternalFilter'> {
     allowInternalFilter?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"Typeahead.d.ts","sourceRoot":"","sources":["../../../src/components/Typeahead/Typeahead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAKrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAC;AAK3D,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAC,UAAU,EAAE,SAAS,EAAC,MAAM,qBAAqB,CAAC;AAG/D,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAM1D,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC,CAAC;AAEH,UAAU,kBACR,SAAQ,IAAI,CACV,UAAU,EACR,YAAY,GACZ,UAAU,GACV,UAAU,GACV,YAAY,GACZ,aAAa,GACb,oBAAoB,GACpB,MAAM,GACN,SAAS,GACT,WAAW,GACX,gBAAgB,GAChB,cAAc,GACd,WAAW,CACd;IACD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,CACT,MAAM,EAAE,UAAU,EAClB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,KACxD,OAAO,CAAC;IACb,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,OAAO,CAAC;IACjE,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,qBAAqB,CAAC;IACvD,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAuMD,eAAO,MAAM,SAAS,EAAE,IAAI,CAAC,iBAAiB,CAC5C,cAAc,EACd,gBAAgB,CASjB,CAAC"}
+{"version":3,"file":"Typeahead.d.ts","sourceRoot":"","sources":["../../../src/components/Typeahead/Typeahead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,KAAK,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAKrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAC;AAK3D,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAC,UAAU,EAAE,SAAS,EAAC,MAAM,qBAAqB,CAAC;AAG/D,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,wBAAwB,CAAC;AAM1D,KAAK,UAAU,GAAG,QAAQ,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC,CAAC;AAEH,UAAU,kBACR,SAAQ,IAAI,CACV,UAAU,EACR,YAAY,GACZ,UAAU,GACV,UAAU,GACV,YAAY,GACZ,aAAa,GACb,oBAAoB,GACpB,MAAM,GACN,SAAS,GACT,WAAW,GACX,gBAAgB,GAChB,cAAc,GACd,WAAW,CACd;IACD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,CACT,MAAM,EAAE,UAAU,EAClB,IAAI,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG,IAAI,GAAG,SAAS,KACxD,OAAO,CAAC;IACb,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,OAAO,CAAC;IACjE,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACxD,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,MAAM,WAAW,cACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,qBAAqB,CAAC;IACvD,mBAAmB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAyMD,eAAO,MAAM,SAAS,EAAE,IAAI,CAAC,iBAAiB,CAC5C,cAAc,EACd,gBAAgB,CASjB,CAAC"}

package/lib/components/Typeahead/Typeahead.js

@@ -37,6 +37,7 @@ const BaseTypeahead = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     clickAwayRef,
     elevation = 'modal',
     testId,
+    rightSlot,
     ...inputProps
   } = _ref;
   const menuOptions = menu?.options;
@@ -89,6 +90,7 @@ const BaseTypeahead = /*#__PURE__*/React.forwardRef((_ref, ref) => {
             box: classNames?.box
           },
           isLoading: isLoading,
+          rightSlot: rightSlot,
           onChange: e => {
             e.stopPropagation();
             onSearch?.(e);

package/mcp/build-mcp-data.js

@@ -42,7 +42,34 @@ function getDirectories(path) {
 }
 
 /**
- * Extract all components with their files
+ * Get all files recursively in a directory
+ */
+function getAllFilesRecursively(dirPath, filesList = [], baseDir = dirPath) {
+  try {
+    const files = readdirSync(dirPath);
+    
+    files.forEach(file => {
+      if (file.startsWith('.')) return;
+      
+      const filePath = join(dirPath, file);
+      const stat = statSync(filePath);
+      
+      if (stat.isDirectory()) {
+        getAllFilesRecursively(filePath, filesList, baseDir);
+      } else {
+        const relativePath = filePath.replace(baseDir + '/', '');
+        filesList.push(relativePath);
+      }
+    });
+  } catch (error) {
+    // Ignore errors for non-existent directories
+  }
+  
+  return filesList;
+}
+
+/**
+ * Extract all components with their files (including sub-components)
  */
 function buildComponentsData() {
   console.log('📦 Extracting components...');
@@ -59,24 +86,58 @@ function buildComponentsData() {
   for (const componentName of componentDirs) {
     const componentDir = join(componentsPath, componentName);
     
+    // Get all files in the component directory
+    const allFiles = getAllFilesRecursively(componentDir);
+    
+    // Extract main component files
     const mainTsx = join(componentDir, `${componentName}.tsx`);
     const mainTs = join(componentDir, `${componentName}.ts`);
+    const mainContent = safeReadFile(mainTsx) || safeReadFile(mainTs);
     
+    // Extract story files
     const storyTsx = join(componentDir, `${componentName}.stories.tsx`);
     const storyTs = join(componentDir, `${componentName}.stories.ts`);
+    const storyContent = safeReadFile(storyTsx) || safeReadFile(storyTs);
     
+    // Extract CSS file
     const cssFile = join(componentDir, `${componentName}.module.css`);
+    const cssContent = safeReadFile(cssFile);
     
+    // Extract index file
     const indexFile = join(componentDir, 'index.ts');
-    
-    const mainContent = safeReadFile(mainTsx) || safeReadFile(mainTs);
-    const storyContent = safeReadFile(storyTsx) || safeReadFile(storyTs);
-    const cssContent = safeReadFile(cssFile);
     const indexContent = safeReadFile(indexFile);
     
-    const allFiles = existsSync(componentDir) 
-      ? readdirSync(componentDir).filter(f => !f.startsWith('.'))
-      : [];
+    // Extract all additional TypeScript/TSX files (sub-components)
+    const additionalFiles = {};
+    for (const file of allFiles) {
+      // Skip main files we already extracted
+      if (
+        file === `${componentName}.tsx` ||
+        file === `${componentName}.ts` ||
+        file === `${componentName}.stories.tsx` ||
+        file === `${componentName}.stories.ts` ||
+        file === `${componentName}.module.css` ||
+        file === 'index.ts' ||
+        file.endsWith('.module.css') ||
+        file.endsWith('.stories.tsx') ||
+        file.endsWith('.stories.ts') ||
+        file.endsWith('.stories.module.css')
+      ) {
+        continue;
+      }
+      
+      // Only include .tsx and .ts files (sub-components)
+      if (file.endsWith('.tsx') || file.endsWith('.ts')) {
+        const fullPath = join(componentDir, file);
+        const content = safeReadFile(fullPath);
+        if (content) {
+          additionalFiles[file] = {
+            path: file,
+            content: content
+          };
+        }
+      }
+    }
     
     components[componentName] = {
       name: componentName,
@@ -86,6 +147,7 @@ function buildComponentsData() {
         story: storyContent ? { path: `${componentName}.stories.tsx`, content: storyContent } : null,
         css: cssContent ? { path: `${componentName}.module.css`, content: cssContent } : null,
         index: indexContent ? { path: 'index.ts', content: indexContent } : null,
+        additional: additionalFiles,
       },
       allFiles,
     };
@@ -190,6 +252,94 @@ function buildTokensData() {
   return tokens;
 }
 
+/**
+ * Extract all utils
+ */
+function buildUtilsData() {
+  console.log('🔧 Extracting utils...');
+  const utilsPath = join(DESIGN_SYSTEM_PATH, 'src/utils');
+  const utils = {};
+  
+  if (!existsSync(utilsPath)) {
+    console.warn('⚠️  Utils path not found');
+    return utils;
+  }
+
+  const utilDirs = getDirectories(utilsPath);
+  
+  for (const utilName of utilDirs) {
+    const utilDir = join(utilsPath, utilName);
+    
+    // Get all files in the util directory
+    const allFiles = getAllFilesRecursively(utilDir);
+    
+    // Read all TypeScript files
+    const files = {};
+    for (const file of allFiles) {
+      if ((file.endsWith('.ts') || file.endsWith('.tsx')) && !file.endsWith('.d.ts')) {
+        const fullPath = join(utilDir, file);
+        const content = safeReadFile(fullPath);
+        if (content) {
+          files[file] = {
+            path: file,
+            content: content
+          };
+        }
+      }
+    }
+    
+    utils[utilName] = {
+      name: utilName,
+      path: `src/utils/${utilName}`,
+      files: files,
+      allFiles: allFiles,
+    };
+  }
+  
+  console.log(`   ✅ Extracted ${Object.keys(utils).length} util modules`);
+  return utils;
+}
+
+/**
+ * Extract all types
+ */
+function buildTypesData() {
+  console.log('📐 Extracting types...');
+  const typesPath = join(DESIGN_SYSTEM_PATH, 'src/types');
+  const types = {};
+  
+  if (!existsSync(typesPath)) {
+    console.warn('⚠️  Types path not found');
+    return types;
+  }
+
+  try {
+    const files = readdirSync(typesPath).filter(f => 
+      !f.startsWith('.') && 
+      (f.endsWith('.ts') || f.endsWith('.tsx')) &&
+      !f.endsWith('.d.ts')
+    );
+    
+    for (const file of files) {
+      const filePath = join(typesPath, file);
+      const content = safeReadFile(filePath);
+      if (content) {
+        const typeName = file.replace(/\.(ts|tsx)$/, '');
+        types[typeName] = {
+          name: typeName,
+          path: `src/types/${file}`,
+          content: content,
+        };
+      }
+    }
+  } catch (error) {
+    console.warn(`   ⚠️  Error reading types:`, error.message);
+  }
+  
+  console.log(`   ✅ Extracted ${Object.keys(types).length} type files`);
+  return types;
+}
+
 /**
  * Get package version
  */
@@ -217,6 +367,8 @@ function build() {
       components: buildComponentsData(),
       hooks: buildHooksData(),
       tokens: buildTokensData(),
+      utils: buildUtilsData(),
+      types: buildTypesData(),
     };
 
     // Create output directory if it doesn't exist
@@ -232,6 +384,8 @@ function build() {
     console.log(`   - Components: ${Object.keys(data.components).length}`);
     console.log(`   - Hooks: ${Object.keys(data.hooks).length}`);
     console.log(`   - Token categories: ${Object.keys(data.tokens).length}`);
+    console.log(`   - Utils: ${Object.keys(data.utils).length}`);
+    console.log(`   - Types: ${Object.keys(data.types).length}`);
     console.log(`   - Version: ${data.metadata.version}`);
     console.log(`   - Output: ${OUTPUT_FILE}`);
     console.log(`   - Size: ${(Buffer.byteLength(JSON.stringify(data)) / 1024 / 1024).toFixed(2)} MB\n`);