@1money/component-ui 0.0.80 → 0.0.81

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@1money/component-ui",
-  "version": "0.0.80",
+  "version": "0.0.81",
   "description": "React Components based on primereact for 1money front-end projects",
   "main": "lib/index.js",
   "module": "es/index.js",

package/scripts/mcp-server/examples.generated.json

@@ -43,6 +43,12 @@
       "source": "readme",
       "compilable": true
     },
+    "02856991ce7e62c3b5b24ff6bbd476b4b64339cdfc87024f704198bb46927f2e": {
+      "title": "Default",
+      "code": "{\n    const sizes = INPUT_SIZES;\n    const statuses = ['default', 'error'] as const;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n              {statuses.map((status) =>\n                valueTypes.map((vt) => (\n                  <div key={`${status}-${vt}`} style={{ width: 310 }}>\n                    <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                      {status} / {vt}\n                    </p>\n                    <Input\n                      size={size}\n                      status={status}\n                      label=\"Label\"\n                      feedback=\"Feedback\"\n                      feedbackIcon={status === 'error' ? <Icons name=\"error\" size={16} /> : <Icons name=\"info\" size={16} />}\n                      placeholder=\"Value\"\n                      allowClear\n                      defaultValue={vt === 'Filled' ? 'Input value' : undefined}\n                    />\n                  </div>\n                )),\n              )}\n              {/* Read-Only */}\n              {valueTypes.map((vt) => (\n                <div key={`readonly-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    read-only / {vt}\n                  </p>\n                  <Input\n                    size={size}\n                    readOnly\n                    label=\"Label\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'Read-only value' : undefined}\n                  />\n                </div>\n              ))}\n              {/* Disabled */}\n              {valueTypes.map((vt) => (\n                <div key={`disabled-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    disabled / {vt}\n                  </p>\n                  <Input\n                    size={size}\n                    disabled\n                    label=\"Label\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'Disabled value' : undefined}\n                  />\n                </div>\n              ))}\n            </div>\n          </div>\n        ))}\n\n        {/* ── With Prefix / Suffix ── */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>With Prefix / Suffix</h3>\n          <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Prefix + Suffix</p>\n              <Input\n                label=\"Label\"\n                defaultValue=\"100\"\n                prefix={<span>USD</span>}\n                suffix={<span>Max</span>}\n                allowClear\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Prefix only</p>\n              <Input\n                label=\"Label\"\n                placeholder=\"Enter amount\"\n                prefix={<span>$</span>}\n                allowClear\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Suffix only</p>\n              <Input\n                label=\"Label\"\n                placeholder=\"Enter email\"\n                suffix={<span>@gmail.com</span>}\n              />\n            </div>\n          </div>\n        </div>\n\n        {/* ── Required / Info ── */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>Required / Info</h3>\n          <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Required</p>\n              <Input\n                label=\"Label\"\n                required\n                placeholder=\"Required field\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Optional (required=false)</p>\n              <Input\n                label=\"Label\"\n                required={false}\n                placeholder=\"Optional field\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>With Info</p>\n              <Input\n                label=\"Label\"\n                info=\"Optional hint\"\n                placeholder=\"Value\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>With Tip</p>\n              <Input\n                label=\"Label\"\n                tip=\"This is a helpful tooltip\"\n                placeholder=\"Value\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Optional + Info + Tip</p>\n              <Input\n                label=\"Label\"\n                required={false}\n                info=\"Optional hint\"\n                tip=\"This is a helpful tooltip\"\n                placeholder=\"Value\"\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }",
+      "source": "stories",
+      "compilable": true
+    },
     "03ae4647e3bd8aa48fde505061070eb0425296d0b86b97f0b240c36897efc68f": {
       "title": "Split",
       "code": "<Space split={<span>|</span>} size={SPACE_SIZE.large}>\n      <span>Alpha</span>\n      <span>Beta</span>\n      <span>Gamma</span>\n    </Space>",
@@ -313,12 +319,6 @@
       "source": "readme",
       "compilable": true
     },
-    "1d55eaab6342218fa931b8a061cfa308bbaa48c4ed6bcd3d40557b5b13b938e9": {
-      "title": "Password",
-      "code": "{\n    const sizes = ['large', 'small'] as const;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n              {valueTypes.map((vt) => (\n                <div key={`default-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    default / {vt}\n                  </p>\n                  <Input.Password\n                    size={size}\n                    label=\"Password\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Enter password\"\n                    defaultValue={vt === 'Filled' ? 'secretpass' : undefined}\n                  />\n                </div>\n              ))}\n              {/* Error */}\n              <div style={{ width: 310 }}>\n                <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>error / Filled</p>\n                <Input.Password\n                  size={size}\n                  status=\"error\"\n                  label=\"Password\"\n                  feedback=\"Password too short\"\n                  feedbackIcon={<Icons name=\"error\" size={16} />}\n                  placeholder=\"Enter password\"\n                  defaultValue=\"123\"\n                />\n              </div>\n              {/* Disabled */}\n              <div style={{ width: 310 }}>\n                <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>disabled / Filled</p>\n                <Input.Password\n                  size={size}\n                  disabled\n                  label=\"Password\"\n                  placeholder=\"Enter password\"\n                  defaultValue=\"secretpass\"\n                />\n              </div>\n            </div>\n          </div>\n        ))}\n      </div>\n    );\n  }",
-      "source": "stories",
-      "compilable": true
-    },
     "1d6e4664da8b92ef6df17dcaa33fbb89d503e9119ff6b26e08b59365bdcf248f": {
       "title": "Drawer Form Left",
       "code": "<DrawerForm\n      {...args}\n      title=\"Settings\"\n      placement=\"left\"\n      width={400}\n      trigger={<Button color=\"secondary\">Open from Left</Button>}\n      onFinish={async (values) => {\n        alert(JSON.stringify(values, null, 2));\n      }}\n    >\n      <ProFormText name=\"theme\" label=\"Theme\" placeholder=\"dark / light\" />\n      <ProFormText name=\"language\" label=\"Language\" placeholder=\"en / zh\" />\n      <ProFormSwitch name=\"notifications\" label=\"Enable Notifications\" />\n    </DrawerForm>",
@@ -391,12 +391,6 @@
       "source": "stories",
       "compilable": false
     },
-    "22db460cb1da47a1d59eeff302bd4b045cc8fa5f8597eba6047dfc4c668f58f6": {
-      "title": "Overview",
-      "code": "{\n    const sizes = ['large', 'small'] as const;\n    const statuses = ['default', 'error'] as const;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={stackStyle}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ ...sectionTitleStyle, textTransform: 'capitalize' }}>{size}</h3>\n            <div style={rowStyle}>\n              {statuses.map((status) =>\n                valueTypes.map((vt) => (\n                  <div key={`${status}-${vt}`} style={cellStyle(310)}>\n                    <p style={captionStyle}>\n                      {status} / {vt}\n                    </p>\n                    <Select\n                      size={size}\n                      status={status}\n                      label=\"Label\"\n                      feedback=\"Feedback\"\n                      placeholder=\"Value\"\n                      options={OPTIONS}\n                      defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                    />\n                  </div>\n                )),\n              )}\n              {valueTypes.map((vt) => (\n                <div key={`readonly-${vt}`} style={cellStyle(310)}>\n                  <p style={captionStyle}>read-only / {vt}</p>\n                  <Select\n                    size={size}\n                    readOnly\n                    label=\"Label\"\n                    options={OPTIONS}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                  />\n                </div>\n              ))}\n              {valueTypes.map((vt) => (\n                <div key={`disabled-${vt}`} style={cellStyle(310)}>\n                  <p style={captionStyle}>disabled / {vt}</p>\n                  <Select\n                    size={size}\n                    disabled\n                    label=\"Label\"\n                    options={OPTIONS}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                  />\n                </div>\n              ))}\n            </div>\n          </div>\n        ))}\n      </div>\n    );\n  }",
-      "source": "stories",
-      "compilable": true
-    },
     "22edc8d5014aba685af83f60b94c089e387cc95677d233691190f5e2d031e262": {
       "title": "Dotted",
       "code": "<div>\n      <p>Lorem ipsum dolor sit amet.</p>\n      <Divider variant=\"dotted\" />\n      <p>Lorem ipsum dolor sit amet.</p>\n      <Divider variant=\"dotted\">Dotted</Divider>\n      <p>Lorem ipsum dolor sit amet.</p>\n    </div>",
@@ -1453,12 +1447,6 @@
       "source": "stories",
       "compilable": true
     },
-    "842244e70f89e2aaf6941718de836ab3a6e08d642a4d4bb2e80cee160158470f": {
-      "title": "Default",
-      "code": "{\n    const sizes = ['large', 'small'] as const;\n    const statuses = ['default', 'error'] as const;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n              {statuses.map((status) =>\n                valueTypes.map((vt) => (\n                  <div key={`${status}-${vt}`} style={{ width: 310 }}>\n                    <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                      {status} / {vt}\n                    </p>\n                    <Input\n                      size={size}\n                      status={status}\n                      label=\"Label\"\n                      feedback=\"Feedback\"\n                      feedbackIcon={status === 'error' ? <Icons name=\"error\" size={16} /> : <Icons name=\"info\" size={16} />}\n                      placeholder=\"Value\"\n                      allowClear\n                      defaultValue={vt === 'Filled' ? 'Input value' : undefined}\n                    />\n                  </div>\n                )),\n              )}\n              {/* Read-Only */}\n              {valueTypes.map((vt) => (\n                <div key={`readonly-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    read-only / {vt}\n                  </p>\n                  <Input\n                    size={size}\n                    readOnly\n                    label=\"Label\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'Read-only value' : undefined}\n                  />\n                </div>\n              ))}\n              {/* Disabled */}\n              {valueTypes.map((vt) => (\n                <div key={`disabled-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    disabled / {vt}\n                  </p>\n                  <Input\n                    size={size}\n                    disabled\n                    label=\"Label\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'Disabled value' : undefined}\n                  />\n                </div>\n              ))}\n            </div>\n          </div>\n        ))}\n\n        {/* ── With Prefix / Suffix ── */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>With Prefix / Suffix</h3>\n          <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Prefix + Suffix</p>\n              <Input\n                label=\"Label\"\n                defaultValue=\"100\"\n                prefix={<span>USD</span>}\n                suffix={<span>Max</span>}\n                allowClear\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Prefix only</p>\n              <Input\n                label=\"Label\"\n                placeholder=\"Enter amount\"\n                prefix={<span>$</span>}\n                allowClear\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Suffix only</p>\n              <Input\n                label=\"Label\"\n                placeholder=\"Enter email\"\n                suffix={<span>@gmail.com</span>}\n              />\n            </div>\n          </div>\n        </div>\n\n        {/* ── Required / Info ── */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>Required / Info</h3>\n          <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Required</p>\n              <Input\n                label=\"Label\"\n                required\n                placeholder=\"Required field\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Optional (required=false)</p>\n              <Input\n                label=\"Label\"\n                required={false}\n                placeholder=\"Optional field\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>With Info</p>\n              <Input\n                label=\"Label\"\n                info=\"Optional hint\"\n                placeholder=\"Value\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>With Tip</p>\n              <Input\n                label=\"Label\"\n                tip=\"This is a helpful tooltip\"\n                placeholder=\"Value\"\n              />\n            </div>\n            <div style={{ width: 310 }}>\n              <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Optional + Info + Tip</p>\n              <Input\n                label=\"Label\"\n                required={false}\n                info=\"Optional hint\"\n                tip=\"This is a helpful tooltip\"\n                placeholder=\"Value\"\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }",
-      "source": "stories",
-      "compilable": true
-    },
     "8585bff0f1eb7ff6a28f523eb07a2fe420a92d4ab2b329724362d75b08df00d5": {
       "title": "Import",
       "code": "import { Typography } from '@1money/component-ui';\n// or\nimport {\n  Typography,\n  TypographyBody,\n  TypographyDisplay,\n  TypographyHeadline,\n  TypographyLabel,\n  TypographyLink,\n  TypographyTitle,\n} from '@1money/component-ui/Typography';",
@@ -1945,6 +1933,12 @@
       "source": "canonical",
       "compilable": true
     },
+    "add9a76dff211d6a08651090b20be857169f75505126722a71a270593ac216e1": {
+      "title": "Password",
+      "code": "{\n    const sizes = INPUT_SIZES;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n              {valueTypes.map((vt) => (\n                <div key={`default-${vt}`} style={{ width: 310 }}>\n                  <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>\n                    default / {vt}\n                  </p>\n                  <Input.Password\n                    size={size}\n                    label=\"Password\"\n                    feedback=\"Feedback\"\n                    feedbackIcon={<Icons name=\"info\" size={16} />}\n                    placeholder=\"Enter password\"\n                    defaultValue={vt === 'Filled' ? 'secretpass' : undefined}\n                  />\n                </div>\n              ))}\n              {/* Error */}\n              <div style={{ width: 310 }}>\n                <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>error / Filled</p>\n                <Input.Password\n                  size={size}\n                  status=\"error\"\n                  label=\"Password\"\n                  feedback=\"Password too short\"\n                  feedbackIcon={<Icons name=\"error\" size={16} />}\n                  placeholder=\"Enter password\"\n                  defaultValue=\"123\"\n                />\n              </div>\n              {/* Disabled */}\n              <div style={{ width: 310 }}>\n                <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>disabled / Filled</p>\n                <Input.Password\n                  size={size}\n                  disabled\n                  label=\"Password\"\n                  placeholder=\"Enter password\"\n                  defaultValue=\"secretpass\"\n                />\n              </div>\n            </div>\n          </div>\n        ))}\n      </div>\n    );\n  }",
+      "source": "stories",
+      "compilable": true
+    },
     "ae23f0d9349157c952b7752e33ea302d85c3d3f09654ece8ddf9107f7b194b68": {
       "title": "Usage",
       "code": "{/* Hover trigger (default) */}\n<button id=\"my-trigger\">Hover me</button>\n<Tooltip anchorSelect=\"#my-trigger\" body=\"Simple tooltip\" />\n\n{/* With title */}\n<button id=\"info-trigger\">Info</button>\n<Tooltip anchorSelect=\"#info-trigger\" title=\"Heading\" body=\"Detailed text\" placement=\"bottom\" />\n\n{/* Controlled */}\n<button id=\"ctrl-trigger\">Controlled</button>\n<Tooltip anchorSelect=\"#ctrl-trigger\" body=\"Controlled tooltip\" open={isOpen} onOpenChange={setIsOpen} />\n\n{/* Click trigger */}\n<button id=\"click-trigger\">Click me</button>\n<Tooltip\n  anchorSelect=\"#click-trigger\"\n  body=\"Click tooltip\"\n  openEvents={{ click: true, mouseover: false, mouseenter: false, focus: false }}\n  closeEvents={{ click: true, mouseleave: false, mouseout: false, blur: false }}\n/>",
@@ -1957,12 +1951,6 @@
       "source": "readme",
       "compilable": true
     },
-    "af6172fd099200e93181aeb231c5d69c5b4b4d057a1f32935aa2f35ed86ffebe": {
-      "title": "Search",
-      "code": "{\n    const onSearch = fn();\n    const sizes = ['large', 'small'] as const;\n    const columns = [\n      { label: 'Default', props: {} },\n      { label: 'Disabled', props: { disabled: true } },\n    ];\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', flexDirection: 'column', gap: 24 }}>\n              {/* Placeholder row */}\n              <div>\n                <p style={{ margin: '0 0 8px', color: '#666', fontSize: 13 }}>Placeholder</p>\n                <div style={{ display: 'flex', gap: 16, flexWrap: 'wrap' }}>\n                  {columns.map((col) => (\n                    <div key={col.label} style={{ width: 310 }}>\n                      <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>{col.label}</p>\n                      <Input.Search\n                        size={size}\n                        placeholder=\"Search\"\n                        onSearch={onSearch}\n                        {...col.props}\n                      />\n                    </div>\n                  ))}\n                </div>\n              </div>\n              {/* Filled row */}\n              <div>\n                <p style={{ margin: '0 0 8px', color: '#666', fontSize: 13 }}>Filled</p>\n                <div style={{ display: 'flex', gap: 16, flexWrap: 'wrap' }}>\n                  {columns.map((col) => (\n                    <div key={col.label} style={{ width: 310 }}>\n                      <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>{col.label}</p>\n                      <Input.Search\n                        size={size}\n                        placeholder=\"Search\"\n                        defaultValue=\"Search\"\n                        allowClear\n                        onSearch={onSearch}\n                        {...col.props}\n                      />\n                    </div>\n                  ))}\n                </div>\n              </div>\n            </div>\n          </div>\n        ))}\n        {/* Loading */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>Loading</h3>\n          <div style={{ display: 'flex', gap: 16 }}>\n            <div style={{ width: 310 }}>\n              <Input.Search\n                placeholder=\"Search\"\n                defaultValue=\"Search\"\n                loading\n                onSearch={onSearch}\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }",
-      "source": "stories",
-      "compilable": false
-    },
     "af88d73f705cf2f7bb20f21e3b6bf5469ae3683b129dc3b5e6b59966449452b9": {
       "title": "Import",
       "code": "import { Alert } from '@1money/component-ui';\n// or\nimport { Alert } from '@1money/component-ui/Alert';",
@@ -2503,6 +2491,12 @@
       "source": "stories",
       "compilable": false
     },
+    "de0d3ad5b313251b55282c90a8ec9860ebd8f4b6ebb25944dc225a2555ef3c4c": {
+      "title": "Search",
+      "code": "{\n    const onSearch = fn();\n    const sizes = INPUT_SIZES;\n    const columns = [\n      { label: 'Default', props: {} },\n      { label: 'Disabled', props: { disabled: true } },\n    ];\n\n    return (\n      <div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ margin: '0 0 16px', textTransform: 'capitalize' }}>{size}</h3>\n            <div style={{ display: 'flex', flexDirection: 'column', gap: 24 }}>\n              {/* Placeholder row */}\n              <div>\n                <p style={{ margin: '0 0 8px', color: '#666', fontSize: 13 }}>Placeholder</p>\n                <div style={{ display: 'flex', gap: 16, flexWrap: 'wrap' }}>\n                  {columns.map((col) => (\n                    <div key={col.label} style={{ width: 310 }}>\n                      <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>{col.label}</p>\n                      <Input.Search\n                        size={size}\n                        placeholder=\"Search\"\n                        onSearch={onSearch}\n                        {...col.props}\n                      />\n                    </div>\n                  ))}\n                </div>\n              </div>\n              {/* Filled row */}\n              <div>\n                <p style={{ margin: '0 0 8px', color: '#666', fontSize: 13 }}>Filled</p>\n                <div style={{ display: 'flex', gap: 16, flexWrap: 'wrap' }}>\n                  {columns.map((col) => (\n                    <div key={col.label} style={{ width: 310 }}>\n                      <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>{col.label}</p>\n                      <Input.Search\n                        size={size}\n                        placeholder=\"Search\"\n                        defaultValue=\"Search\"\n                        allowClear\n                        onSearch={onSearch}\n                        {...col.props}\n                      />\n                    </div>\n                  ))}\n                </div>\n              </div>\n            </div>\n          </div>\n        ))}\n        {/* Loading */}\n        <div>\n          <h3 style={{ margin: '0 0 16px' }}>Loading</h3>\n          <div style={{ display: 'flex', gap: 16 }}>\n            <div style={{ width: 310 }}>\n              <Input.Search\n                placeholder=\"Search\"\n                defaultValue=\"Search\"\n                loading\n                onSearch={onSearch}\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  }",
+      "source": "stories",
+      "compilable": false
+    },
     "de44f389edfa47e77cf32f1bd6ece4161001640b190878192b1685205bc79377": {
       "title": "Amount",
       "code": "<div style={{ display: 'flex', flexDirection: 'column', gap: 40 }}>\n      {/* ── Large ── */}\n      <div>\n        <h3 style={{ margin: '0 0 16px' }}>Large</h3>\n        <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n          {/* Placeholder */}\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Placeholder</p>\n            <Input.Amount\n              label=\"You send\"\n              feedback=\"$2,992.68 USDC available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              placeholder=\"Enter amount\"\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n          {/* Filled */}\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Filled</p>\n            <Input.Amount\n              label=\"You send\"\n              feedback=\"$2,992.68 USDC available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              defaultValue=\"1,250.00\"\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n          {/* Disabled */}\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Disabled</p>\n            <Input.Amount\n              label=\"You send\"\n              feedback=\"$2,992.68 USDC available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              disabled\n              actionLabel=\"Use Max\"\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n            />\n          </div>\n          {/* Error */}\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Error</p>\n            <Input.Amount\n              label=\"You send\"\n              status=\"error\"\n              feedback=\"Insufficient balance\"\n              feedbackIcon={<Icons name=\"error\" size={16} />}\n              defaultValue=\"999,999.99\"\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* ── Small ── */}\n      <div>\n        <h3 style={{ margin: '0 0 16px' }}>Small</h3>\n        <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Placeholder</p>\n            <Input.Amount\n              size=\"small\"\n              label=\"You send\"\n              feedback=\"$2,992.68 USDT available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              placeholder=\"Enter amount\"\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDT_ICON} alt=\"USDT\" />}\n              currencyLabel=\"USDT\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n          <div style={{ width: 400 }}>\n            <p style={{ margin: '0 0 4px', fontSize: 12, color: '#999' }}>Filled</p>\n            <Input.Amount\n              size=\"small\"\n              label=\"You send\"\n              feedback=\"$2,992.68 USDT available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              defaultValue=\"500.00\"\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDT_ICON} alt=\"USDT\" />}\n              currencyLabel=\"USDT\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* ── With prefix currency selector ── */}\n      <div>\n        <h3 style={{ margin: '0 0 16px' }}>With Prefix Currency</h3>\n        <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n          <div style={{ width: 400 }}>\n            <Input.Amount\n              label=\"You send\"\n              feedback=\"65,482.55 USD1 available\"\n              feedbackIcon={<Icons name=\"info\" size={16} />}\n              defaultValue=\"0\"\n              prefix={\n                <span style={{ display: 'inline-flex', alignItems: 'center', gap: 8 }}>\n                  <img src={USDT_ICON} alt=\"USDT\" style={{ width: 24, height: 24, borderRadius: '50%' }} />\n                  <span>USDT</span>\n                </span>\n              }\n              actionLabel=\"Use Max\"\n              onAction={fn()}\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n        </div>\n      </div>\n\n      {/* ── Currency only (no action) ── */}\n      <div>\n        <h3 style={{ margin: '0 0 16px' }}>Currency Only (no action button)</h3>\n        <div style={{ display: 'flex', gap: 24, flexWrap: 'wrap' }}>\n          <div style={{ width: 400 }}>\n            <Input.Amount\n              label=\"Amount\"\n              placeholder=\"0.00\"\n              currencyIcon={<img src={USDC_ICON} alt=\"USDC\" />}\n              currencyLabel=\"USDC\"\n              onCurrencyClick={fn()}\n            />\n          </div>\n        </div>\n      </div>\n    </div>",
@@ -2659,6 +2653,12 @@
       "source": "stories",
       "compilable": true
     },
+    "ecb3b33f82daa905c85a8c557941ffaad4c414a76742779e1fef9abfa108a79f": {
+      "title": "Overview",
+      "code": "{\n    const sizes = SELECT_SIZES;\n    const statuses = ['default', 'error'] as const;\n    const valueTypes = ['Placeholder', 'Filled'] as const;\n\n    return (\n      <div style={stackStyle}>\n        {sizes.map((size) => (\n          <div key={size}>\n            <h3 style={{ ...sectionTitleStyle, textTransform: 'capitalize' }}>{size}</h3>\n            <div style={rowStyle}>\n              {statuses.map((status) =>\n                valueTypes.map((vt) => (\n                  <div key={`${status}-${vt}`} style={cellStyle(310)}>\n                    <p style={captionStyle}>\n                      {status} / {vt}\n                    </p>\n                    <Select\n                      size={size}\n                      status={status}\n                      label=\"Label\"\n                      feedback=\"Feedback\"\n                      placeholder=\"Value\"\n                      options={OPTIONS}\n                      defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                    />\n                  </div>\n                )),\n              )}\n              {valueTypes.map((vt) => (\n                <div key={`readonly-${vt}`} style={cellStyle(310)}>\n                  <p style={captionStyle}>read-only / {vt}</p>\n                  <Select\n                    size={size}\n                    readOnly\n                    label=\"Label\"\n                    options={OPTIONS}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                  />\n                </div>\n              ))}\n              {valueTypes.map((vt) => (\n                <div key={`disabled-${vt}`} style={cellStyle(310)}>\n                  <p style={captionStyle}>disabled / {vt}</p>\n                  <Select\n                    size={size}\n                    disabled\n                    label=\"Label\"\n                    options={OPTIONS}\n                    placeholder=\"Value\"\n                    defaultValue={vt === 'Filled' ? 'btc' : undefined}\n                  />\n                </div>\n              ))}\n            </div>\n          </div>\n        ))}\n      </div>\n    );\n  }",
+      "source": "stories",
+      "compilable": true
+    },
     "ed5aa33f8e734dad460aa9b2a7c6fc0690efc9cda3b0854c642d59b2bbf55870": {
       "title": "Illustrations",
       "code": "{\n    const handleCopy = (el: string) => {\n      copy(el);\n    };\n\n    return <div style={{ display: 'grid', gap: 24, gridTemplateColumns: 'repeat(auto-fill, minmax(200px, 1fr))' }}>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusChecked' />\")}>\n        <Icons {...args} name='illusChecked' />\n        <span>illusChecked</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusEmailError' />\")}>\n        <Icons {...args} name='illusEmailError' />\n        <span>illusEmailError</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusLinkExpired' />\")}>\n        <Icons {...args} name='illusLinkExpired' />\n        <span>illusLinkExpired</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illus2FA' />\")}>\n        <Icons {...args} name='illus2FA' />\n        <span>illus2FA</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusLocked' />\")}>\n        <Icons {...args} name='illusLocked' />\n        <span>illusLocked</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusError' />\")}>\n        <Icons {...args} name='illusError' />\n        <span>illusError</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusRegionNotSupported' />\")}>\n        <Icons {...args} name='illusRegionNotSupported' />\n        <span>illusRegionNotSupported</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusID' />\")}>\n        <Icons {...args} name='illusID' />\n        <span>illusID</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusVerification' />\")}>\n        <Icons {...args} name='illusVerification' />\n        <span>illusVerification</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusPending' />\")}>\n        <Icons {...args} name='illusPending' color='#F4C600' />\n        <span>illusPending</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusPasskey' />\")}>\n        <Icons {...args} name='illusPasskey' />\n        <span>illusPasskey</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusAddAccount' />\")}>\n        <Icons {...args} name='illusAddAccount' />\n        <span>illusAddAccount</span>\n      </CopyIconBox>\n      <CopyIconBox onClick={() => handleCopy(\"<Icons name='illusRewards' />\")}>\n        <Icons {...args} name='illusRewards' />\n        <span>illusRewards</span>\n      </CopyIconBox>\n    </div>;\n  }",

package/scripts/mcp-server/index.generated.json

@@ -5195,7 +5195,7 @@
           "source": "readme"
         },
         {
-          "hash": "842244e70f89e2aaf6941718de836ab3a6e08d642a4d4bb2e80cee160158470f",
+          "hash": "02856991ce7e62c3b5b24ff6bbd476b4b64339cdfc87024f704198bb46927f2e",
           "source": "stories"
         },
         {
@@ -5203,11 +5203,11 @@
           "source": "stories"
         },
         {
-          "hash": "1d55eaab6342218fa931b8a061cfa308bbaa48c4ed6bcd3d40557b5b13b938e9",
+          "hash": "add9a76dff211d6a08651090b20be857169f75505126722a71a270593ac216e1",
           "source": "stories"
         },
         {
-          "hash": "af6172fd099200e93181aeb231c5d69c5b4b4d057a1f32935aa2f35ed86ffebe",
+          "hash": "de0d3ad5b313251b55282c90a8ec9860ebd8f4b6ebb25944dc225a2555ef3c4c",
           "source": "stories"
         },
         {
@@ -15827,7 +15827,7 @@
           "source": "stories"
         },
         {
-          "hash": "22db460cb1da47a1d59eeff302bd4b045cc8fa5f8597eba6047dfc4c668f58f6",
+          "hash": "ecb3b33f82daa905c85a8c557941ffaad4c414a76742779e1fef9abfa108a79f",
           "source": "stories"
         },
         {