@anker-in/headless-ui 1.0.26-alpha.1762500619766 → 1.0.26-alpha.1762509077023

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/cjs/biz-components/HeroBanner/Countdown.js +1 -1
  2. package/dist/cjs/biz-components/HeroBanner/Countdown.js.map +3 -3
  3. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js +1 -1
  4. package/dist/cjs/biz-components/ImageWithText/ImageWithText.js.map +3 -3
  5. package/dist/cjs/biz-components/ImageWithText/types.d.ts +2 -0
  6. package/dist/cjs/biz-components/ImageWithText/types.js.map +1 -1
  7. package/dist/cjs/biz-components/Ksp/index.js +1 -1
  8. package/dist/cjs/biz-components/Ksp/index.js.map +2 -2
  9. package/dist/cjs/biz-components/Title/index.js +1 -1
  10. package/dist/cjs/biz-components/Title/index.js.map +3 -3
  11. package/dist/cjs/biz-components/Title/types.d.ts +2 -1
  12. package/dist/cjs/biz-components/Title/types.js +1 -1
  13. package/dist/cjs/biz-components/Title/types.js.map +1 -1
  14. package/dist/cjs/stories/imageWithText.stories.js +2 -2
  15. package/dist/cjs/stories/imageWithText.stories.js.map +2 -2
  16. package/dist/cjs/types/props.d.ts +1 -1
  17. package/dist/cjs/types/props.js +1 -1
  18. package/dist/cjs/types/props.js.map +1 -1
  19. package/dist/esm/biz-components/HeroBanner/Countdown.js +1 -1
  20. package/dist/esm/biz-components/HeroBanner/Countdown.js.map +3 -3
  21. package/dist/esm/biz-components/ImageWithText/ImageWithText.js +1 -1
  22. package/dist/esm/biz-components/ImageWithText/ImageWithText.js.map +3 -3
  23. package/dist/esm/biz-components/ImageWithText/types.d.ts +2 -0
  24. package/dist/esm/biz-components/Ksp/index.js +1 -1
  25. package/dist/esm/biz-components/Ksp/index.js.map +2 -2
  26. package/dist/esm/biz-components/Title/index.js +1 -1
  27. package/dist/esm/biz-components/Title/index.js.map +3 -3
  28. package/dist/esm/biz-components/Title/types.d.ts +2 -1
  29. package/dist/esm/stories/imageWithText.stories.js +2 -2
  30. package/dist/esm/stories/imageWithText.stories.js.map +2 -2
  31. package/dist/esm/types/props.d.ts +1 -1
  32. package/package.json +1 -1
  33. package/tailwind.config.js +4 -2
package/dist/esm/stories/imageWithText.stories.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/stories/imageWithText.stories.tsx"],
4
- "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport ImageWithText from '../biz-components/ImageWithText/index.js'\nimport type { ImageWithTextProps } from '../biz-components/ImageWithText/types.js'\n\nconst meta = {\n title: 'Biz Components/ImageWithText',\n component: ImageWithText,\n parameters: {\n layout: 'padded',\n docs: {\n description: {\n component:\n '\u591A\u529F\u80FD\u56FE\u6587\u5C55\u793A\u7EC4\u4EF6\uFF0C\u652F\u63012\u79CD\u6A21\u5F0F\uFF1A\\n\\n' +\n '1. **\u57FA\u7840\u6A21\u5F0F**\uFF1A\u652F\u6301\u56FE\u7247/\u89C6\u9891\uFF0C4\u79CD\u5E03\u5C40\u4F4D\u7F6E(\u4E0A\u4E0B\u5DE6\u53F3)\uFF0C\u53EF\u9009\u529F\u80FD\u5217\u8868\u5C55\u793A\uFF0C\u652F\u6301\u4E09\u7AEF(PC/Pad/Mobile)\u72EC\u7ACB\u914D\u7F6E\\n' +\n '2. **Tab\u6A21\u5F0F**\uFF1ATab\u5207\u6362\u5C55\u793A\uFF0C\u652F\u6301\u56FE\u7247/\u89C6\u9891\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u914D\u7F6E\\n\\n' +\n '\u6240\u6709\u6A21\u5F0F\u90FD\u652F\u6301\u4E09\u7AEF\u54CD\u5E94\u5F0F\u914D\u7F6E\uFF08\u684C\u9762\u7AEF\u3001\u5E73\u677F\u7AEF\u3001\u79FB\u52A8\u7AEF\uFF09',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof ImageWithText>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst defaultData: ImageWithTextProps['data'] = {\n theme: 'light',\n title: 'Precise Navigation',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Precise Navigation',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n subtitle: 'iPath Laser Navigation plans optimal cleaning routes with pinpoint accuracy to ensure nothing is missed.',\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Precise Navigation Mobile',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Precise Navigation Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n}\n\nexport const Default: Story = {\n args: {\n data: defaultData,\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u9ED8\u8BA4\u5E03\u5C40(\u5DE6\u4FA7)\uFF1A\u56FE\u7247\u5728\u5DE6\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u53F3\u4FA7\uFF0C\u8FD9\u662F\u6700\u5E38\u7528\u7684\u5E03\u5C40\u65B9\u5F0F',\n },\n },\n },\n}\n\nexport const DarkTheme: Story = {\n args: {\n data: {\n ...defaultData,\n theme: 'dark',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u6DF1\u8272\u4E3B\u9898\uFF1A\u901A\u8FC7\u8BBE\u7F6Etheme\u4E3Adark\u542F\u7528\u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithDescriptionText: Story = {\n args: {\n data: {\n ...defaultData,\n desc: '20,000Pa',\n descIcon:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E26\u63CF\u8FF0\u6587\u672C\uFF1A\u6DFB\u52A0desc\u548CdescIcon\u5B57\u6BB5\u663E\u793A\u989D\u5916\u7684\u4EA7\u54C1\u63CF\u8FF0\u4FE1\u606F',\n },\n },\n },\n}\n\nexport const WithDescriptionTextDark: Story = {\n args: {\n data: {\n ...defaultData,\n theme: 'dark',\n desc: '20,000Pa',\n descIcon:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E26\u63CF\u8FF0\u6587\u672C\u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithoutSubtitle: Story = {\n args: {\n data: {\n theme: 'light',\n title: 'Precise Navigation',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Precise Navigation',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Precise Navigation Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Precise Navigation Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u65E0\u526F\u6807\u9898\uFF1A\u53EA\u663E\u793A\u6807\u9898\u548C\u56FE\u7247\uFF0C\u4E0D\u663E\u793A\u526F\u6807\u9898',\n },\n },\n },\n}\n\nexport const MinimalContent: Story = {\n args: {\n data: {\n theme: 'light',\n title: 'Simple Title',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Simple Title',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Simple Title Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Simple Title Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u6700\u5C0F\u5185\u5BB9\uFF1A\u4EC5\u5305\u542B\u6807\u9898\u548C\u56FE\u7247\u7684\u6700\u7B80\u914D\u7F6E',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F - \u5E03\u5C40\u4F4D\u7F6E\u53D8\u4F53 ====================\n\nexport const LayoutRight: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'right',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u53F3\u4FA7\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u53F3\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u5DE6\u4FA7\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Aright\u5B9E\u73B0',\n },\n },\n },\n}\n\nexport const LayoutTop: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'top',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u9876\u90E8\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u4E0A\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0B\u65B9\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Atop\u5B9E\u73B0\uFF0C\u9002\u5408\u7AD6\u5C4F\u5C55\u793A',\n },\n },\n },\n}\n\nexport const LayoutBottom: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'bottom',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E95\u90E8\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u4E0B\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0A\u65B9\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Abottom\u5B9E\u73B0',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u652F\u6301 ====================\n\nconst videoData: ImageWithTextProps['data'] = {\n title: 'DuoSpiral\u2122 Detangle Brushes',\n subtitle: 'DuoSpiral\u2122 brushes prevent hair from getting tangled for a hassle-free cleaning experience.',\n mediaType: 'video',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n alt: 'DuoSpiral\u2122 Detangle Brushes',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'image/png',\n },\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'DuoSpiral\u2122 Detangle Brushes Video',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n alt: 'DuoSpiral\u2122 Detangle Brushes Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n mimeType: 'image/png',\n },\n mobileVideo: {\n url: 'https://cdn.shopify.com/videos/c/o/v/00a233ef01dc40628874e563c8abffac.mp4',\n alt: 'DuoSpiral\u2122 Detangle Brushes Mobile Video',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n mimeType: 'video/mp4',\n },\n}\n\nexport const WithVideo: Story = {\n args: {\n data: videoData,\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u652F\u6301(\u9ED8\u8BA4\u5DE6\u4FA7\u5E03\u5C40)\uFF1A\u901A\u8FC7\u8BBE\u7F6EmediaType\u4E3Avideo\uFF0C\u4F7F\u7528video\u548CmobileVideo\u5B57\u6BB5\u5C55\u793A\u89C6\u9891\u5185\u5BB9\uFF0C\u652F\u6301\u684C\u9762\u7AEF\u548C\u79FB\u52A8\u7AEF\u4E0D\u540C\u89C6\u9891\uFF0C\u5E26\u61D2\u52A0\u8F7D\u529F\u80FD',\n },\n },\n },\n}\n\nexport const WithVideoRight: Story = {\n args: {\n data: {\n ...videoData,\n layout: 'right',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u53F3\u4FA7\u5E03\u5C40\uFF1A\u89C6\u9891\u5728\u53F3\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u5DE6\u4FA7\uFF0C\u7ED3\u5408mediaType\u548Clayout\u5B9E\u73B0',\n },\n },\n },\n}\n\nexport const WithVideoTop: Story = {\n args: {\n data: {\n ...videoData,\n layout: 'top',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u9876\u90E8\u5E03\u5C40\uFF1A\u89C6\u9891\u5728\u4E0A\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0B\u65B9\uFF0C\u9002\u5408\u5F3A\u8C03\u89C6\u9891\u5185\u5BB9\u7684\u573A\u666F',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 ====================\n\nconst featureData: ImageWithTextProps['data'] = {\n title: 'AI.See\u2122 Obstacle Avoidance',\n subtitle: 'Advanced AI and RGB visual recognition.',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance.png?v=1751341747',\n alt: 'AI.See\u2122 Obstacle Avoidance',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance.png?v=1751341747',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-pad-ai.png?v=1752582807',\n alt: 'AI.See\u2122 Obstacle Avoidance Pad',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-pad-ai.png?v=1752582807',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance-mob.png?v=1751341780',\n alt: 'AI.See\u2122 Obstacle Avoidance Mobile',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance-mob.png?v=1751341780',\n mimeType: 'image/png',\n },\n items: [\n {\n icon: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n text: 'LED',\n desc: 'Equipped with LEDs for dark environments',\n },\n {\n icon: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon2_fb84c5b0-dfe6-4930-b637-a8735ed0f946.svg?v=1751875015',\n text: '200+',\n desc: 'Identifies and avoids 200+ objects.',\n },\n ],\n}\n\nexport const WithItems: Story = {\n args: {\n data: featureData,\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868\uFF1A\u901A\u8FC7\u6DFB\u52A0items\u6570\u7EC4\u5C55\u793A\u4EA7\u54C1\u529F\u80FD\u7279\u6027\u5217\u8868\uFF0C\u652F\u6301\u56FE\u7247/\u89C6\u9891\u548C\u5E03\u5C40\u4F4D\u7F6E\u914D\u7F6E',\n },\n },\n },\n}\n\nexport const WithItemsImageRight: Story = {\n args: {\n data: {\n ...featureData,\n layout: 'right',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u56FE\u7247\u5728\u53F3\u4FA7\uFF1A\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Aright\u5C06\u56FE\u7247\u653E\u7F6E\u5728\u53F3\u4FA7',\n },\n },\n },\n}\n\nexport const WithItemsDark: Story = {\n args: {\n data: {\n ...featureData,\n theme: 'dark',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithItemsVideo: Story = {\n args: {\n data: {\n title: 'AI.See\u2122 Obstacle Avoidance',\n subtitle: 'Advanced AI and RGB visual recognition.',\n mediaType: 'video',\n video: videoData.video,\n padVideo: videoData.video,\n mobVideo: {\n url: 'https://cdn.shopify.com/videos/c/o/v/00a233ef01dc40628874e563c8abffac.mp4',\n alt: 'AI Feature Video',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n mimeType: 'video/mp4',\n },\n poster: videoData.image,\n padPoster: videoData.image,\n mobPoster: videoData.mobileImage,\n items: featureData.items,\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u89C6\u9891\u652F\u6301\uFF1A\u529F\u80FD\u5217\u8868\u6A21\u5F0F\u4E5F\u652F\u6301\u89C6\u9891\u5C55\u793A\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u914D\u7F6E',\n },\n },\n },\n}\n\n// ==================== TabWithImage \u6A21\u5F0F ====================\n\nconst tabData: ImageWithTextProps['data'] = {\n desc: 'Effortless customization at your fingertips.',\n title: 'Smart App Control',\n datalist: [\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n alt: 'Customizable Cleaning Modes',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n mimeType: 'image/png',\n },\n title: 'Customizable Cleaning Modes',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n alt: 'Customizable Cleaning Modes Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n alt: 'Customizable Cleaning Modes Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n mimeType: 'image/png',\n },\n },\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e55fcd7a-cebf-45c1-bb71-452abdaf95ae_Frame_2121235327_1.png?v=1751439903',\n alt: 'Multi-Floor Mapping',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e55fcd7a-cebf-45c1-bb71-452abdaf95ae_Frame_2121235327_1.png?v=1751439903',\n mimeType: 'image/png',\n },\n title: 'Multi-Floor Mapping',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ccdbbbff-5c33-4805-a434-e04a12e32a72_Frame_2121235493.png?v=1752735394',\n alt: 'Multi-Floor Mapping Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ccdbbbff-5c33-4805-a434-e04a12e32a72_Frame_2121235493.png?v=1752735394',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ac28983f-6257-469d-81bb-03dfb54429b6_Frame_2121235514_1.png?v=1752735193',\n alt: 'Multi-Floor Mapping Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ac28983f-6257-469d-81bb-03dfb54429b6_Frame_2121235514_1.png?v=1752735193',\n mimeType: 'image/png',\n },\n },\n ],\n}\n\nexport const TabMode: Story = {\n args: {\n data: tabData,\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F\uFF1A\u5F53data\u4E2D\u5305\u542Bdatalist\u6570\u7EC4\u65F6\u81EA\u52A8\u542F\u7528\uFF0C\u652F\u6301Tab\u5207\u6362\u548C\u56FE\u7247\u52A8\u753B\u6548\u679C',\n },\n },\n },\n}\n\nexport const TabModeThreeItems: Story = {\n args: {\n data: {\n ...tabData,\n datalist: [\n ...tabData.datalist!,\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n alt: 'Smart Scheduling',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n mimeType: 'image/png',\n },\n title: 'Smart Scheduling',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n alt: 'Smart Scheduling Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n alt: 'Smart Scheduling Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n mimeType: 'image/png',\n },\n },\n ],\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F - \u4E09\u4E2ATab\u9879',\n },\n },\n },\n}\n\nexport const TabModeWithVideo: Story = {\n args: {\n data: {\n title: 'Smart App Control',\n desc: 'Effortless customization at your fingertips.',\n mediaType: 'video',\n datalist: [\n {\n title: 'Customizable Cleaning Modes',\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'Customizable Cleaning Modes Video',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n poster: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n alt: 'Customizable Cleaning Modes Poster',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'image/png',\n },\n image: tabData.datalist![0].image,\n imgPad: tabData.datalist![0].imgPad,\n imageMob: tabData.datalist![0].imageMob,\n },\n {\n title: 'Multi-Floor Mapping',\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'Multi-Floor Mapping Video',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n poster: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n alt: 'Multi-Floor Mapping Poster',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'image/png',\n },\n image: tabData.datalist![1].image,\n imgPad: tabData.datalist![1].imgPad,\n imageMob: tabData.datalist![1].imageMob,\n },\n ],\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F - \u89C6\u9891\u652F\u6301\uFF1ATab\u6A21\u5F0F\u73B0\u5728\u4E5F\u652F\u6301\u89C6\u9891\uFF0C\u901A\u8FC7\u8BBE\u7F6EmediaType\u4E3Avideo\u542F\u7528\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u89C6\u9891\u914D\u7F6E',\n },\n },\n },\n}\n\nexport const WithCustomStyles: Story = {\n args: {\n data: defaultData,\n className: 'custom-image-with-text',\n },\n parameters: {\n docs: {\n description: {\n story: `\n\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A\n\n**\u6839\u5143\u7D20\uFF1A**\n- \\`.image-with-text\\` - \u7EC4\u4EF6\u6839\u5BB9\u5668\n- \\`.image-with-text--dark\\` - \u6DF1\u8272\u4E3B\u9898\u4FEE\u9970\u7B26\n- \\`.image-with-text--light\\` - \u6D45\u8272\u4E3B\u9898\u4FEE\u9970\u7B26\n\n**\u5185\u5BB9\u533A\u57DF\uFF1A**\n- \\`.image-with-text__content\\` - \u5185\u5BB9\u5BB9\u5668\n- \\`.image-with-text__title\\` - \u6807\u9898\n- \\`.image-with-text__subtitle\\` - \u526F\u6807\u9898\n\n**\u63CF\u8FF0\u533A\u57DF\uFF1A**\n- \\`.image-with-text__description\\` - \u63CF\u8FF0\u5BB9\u5668\n- \\`.image-with-text__description-icon\\` - \u63CF\u8FF0\u56FE\u6807\n- \\`.image-with-text__description-text\\` - \u63CF\u8FF0\u6587\u672C\n\n**\u56FE\u7247\u533A\u57DF\uFF1A**\n- \\`.image-with-text__image-wrapper\\` - \u56FE\u7247\u5916\u5C42\u5BB9\u5668\n- \\`.image-with-text__image\\` - \u56FE\u7247\u5143\u7D20\n\n**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**\n\\`\\`\\`css\n/* \u81EA\u5B9A\u4E49\u5E03\u5C40\u95F4\u8DDD */\n.image-with-text {\n gap: 48px;\n}\n\n/* \u81EA\u5B9A\u4E49\u6807\u9898\u6837\u5F0F */\n.image-with-text__title {\n color: #2563eb;\n font-weight: 800;\n}\n\n/* \u81EA\u5B9A\u4E49\u56FE\u7247\u60AC\u505C\u6548\u679C */\n.image-with-text__image:hover {\n transform: scale(1.05);\n transition: transform 0.3s ease;\n}\n\n/* \u81EA\u5B9A\u4E49\u63CF\u8FF0\u56FE\u6807 */\n.image-with-text__description-icon {\n filter: brightness(1.2);\n}\n\\`\\`\\`\n `,\n },\n },\n },\n}\n"],
5
- "mappings": "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CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,0NACT,CACF,CACF,CACF,EAIMK,EAAsC,CAC1C,KAAM,+CACN,MAAO,oBACP,SAAU,CACR,CACE,MAAO,CACL,IAAK,gIACL,IAAK,8BACL,aACE,gIACF,SAAU,WACZ,EACA,MAAO,8BACP,OAAQ,CACN,IAAK,gIACL,IAAK,kCACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,gIACL,IAAK,qCACL,aACE,gIACF,SAAU,WACZ,CACF,EACA,CACE,MAAO,CACL,IAAK,kIACL,IAAK,sBACL,aACE,kIACF,SAAU,WACZ,EACA,MAAO,sBACP,OAAQ,CACN,IAAK,gIACL,IAAK,0BACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,kIACL,IAAK,6BACL,aACE,kIACF,SAAU,WACZ,CACF,CACF,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAMD,CACR,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,yLACT,CACF,CACF,CACF,EAEaE,EAA2B,CACtC,KAAM,CACJ,KAAM,CACJ,GAAGF,EACH,SAAU,CACR,GAAGA,EAAQ,SACX,CACE,MAAO,CACL,IAAK,gIACL,IAAK,mBACL,aACE,gIACF,SAAU,WACZ,EACA,MAAO,mBACP,OAAQ,CACN,IAAK,gIACL,IAAK,uBACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,gIACL,IAAK,0BACL,aACE,gIACF,SAAU,WACZ,CACF,CACF,CACF,CACF,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,kDACT,CACF,CACF,CACF,EAEaG,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,MAAO,oBACP,KAAM,+CACN,UAAW,QACX,SAAU,CACR,CACE,MAAO,8BACP,MAAO,CACL,IAAK,4EACL,IAAK,oCACL,aAAc,8HACd,SAAU,WACZ,EACA,OAAQ,CACN,IAAK,8HACL,IAAK,qCACL,aAAc,8HACd,SAAU,WACZ,EACA,MAAOH,EAAQ,SAAU,CAAC,EAAE,MAC5B,OAAQA,EAAQ,SAAU,CAAC,EAAE,OAC7B,SAAUA,EAAQ,SAAU,CAAC,EAAE,QACjC,EACA,CACE,MAAO,sBACP,MAAO,CACL,IAAK,4EACL,IAAK,4BACL,aAAc,8HACd,SAAU,WACZ,EACA,OAAQ,CACN,IAAK,8HACL,IAAK,6BACL,aAAc,8HACd,SAAU,WACZ,EACA,MAAOA,EAAQ,SAAU,CAAC,EAAE,MAC5B,OAAQA,EAAQ,SAAU,CAAC,EAAE,OAC7B,SAAUA,EAAQ,SAAU,CAAC,EAAE,QACjC,CACF,CACF,CACF,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,oPACT,CACF,CACF,CACF,EAEaI,EAA0B,CACrC,KAAM,CACJ,KAAMvB,EACN,UAAW,wBACb,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SA+CT,CACF,CACF,CACF",
4
+ "sourcesContent": ["import React from 'react'\nimport type { Meta, StoryObj } from '@storybook/react'\nimport ImageWithText from '../biz-components/ImageWithText/index.js'\nimport type { ImageWithTextProps } from '../biz-components/ImageWithText/types.js'\n\nconst meta = {\n title: 'Biz Components/ImageWithText',\n component: ImageWithText,\n parameters: {\n layout: 'padded',\n docs: {\n description: {\n component:\n '\u591A\u529F\u80FD\u56FE\u6587\u5C55\u793A\u7EC4\u4EF6\uFF0C\u652F\u63012\u79CD\u6A21\u5F0F\uFF1A\\n\\n' +\n '1. **\u57FA\u7840\u6A21\u5F0F**\uFF1A\u652F\u6301\u56FE\u7247/\u89C6\u9891\uFF0C4\u79CD\u5E03\u5C40\u4F4D\u7F6E(\u4E0A\u4E0B\u5DE6\u53F3)\uFF0C\u53EF\u9009\u529F\u80FD\u5217\u8868\u5C55\u793A\uFF0C\u652F\u6301\u4E09\u7AEF(PC/Pad/Mobile)\u72EC\u7ACB\u914D\u7F6E\\n' +\n '2. **Tab\u6A21\u5F0F**\uFF1ATab\u5207\u6362\u5C55\u793A\uFF0C\u652F\u6301\u56FE\u7247/\u89C6\u9891\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u914D\u7F6E\\n\\n' +\n '\u6240\u6709\u6A21\u5F0F\u90FD\u652F\u6301\u4E09\u7AEF\u54CD\u5E94\u5F0F\u914D\u7F6E\uFF08\u684C\u9762\u7AEF\u3001\u5E73\u677F\u7AEF\u3001\u79FB\u52A8\u7AEF\uFF09',\n },\n },\n },\n tags: ['autodocs'],\n} satisfies Meta<typeof ImageWithText>\n\nexport default meta\n\ntype Story = StoryObj<typeof meta>\n\nconst defaultData: ImageWithTextProps['data'] = {\n theme: 'light',\n title: 'Precise Navigation',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Precise Navigation',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n subtitle: 'iPath Laser Navigation plans optimal cleaning routes with pinpoint accuracy to ensure nothing is missed.',\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Precise Navigation Mobile',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Precise Navigation Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n items: [\n {\n icon: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n alt: 'LED',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n mimeType: 'image/svg+xml',\n },\n text: 'LED',\n desc: 'Equipped with LEDs for dark environments',\n },\n {\n icon: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon2_fb84c5b0-dfe6-4930-b637-a8735ed0f946.svg?v=1751875015',\n alt: '200+',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon2_fb84c5b0-dfe6-4930-b637-a8735ed0f946.svg?v=1751875015',\n mimeType: 'image/svg+xml',\n },\n text: '200+',\n desc: 'Identifies and avoids 200+ objects.',\n },\n ],\n}\n\nexport const Default: Story = {\n args: {\n data: defaultData,\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u9ED8\u8BA4\u5E03\u5C40(\u5DE6\u4FA7)\uFF1A\u56FE\u7247\u5728\u5DE6\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u53F3\u4FA7\uFF0C\u8FD9\u662F\u6700\u5E38\u7528\u7684\u5E03\u5C40\u65B9\u5F0F',\n },\n },\n },\n}\n\nexport const DarkTheme: Story = {\n args: {\n data: {\n ...defaultData,\n theme: 'dark',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u6DF1\u8272\u4E3B\u9898\uFF1A\u901A\u8FC7\u8BBE\u7F6Etheme\u4E3Adark\u542F\u7528\u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithDescriptionText: Story = {\n args: {\n data: {\n ...defaultData,\n desc: '20,000Pa',\n descIcon:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E26\u63CF\u8FF0\u6587\u672C\uFF1A\u6DFB\u52A0desc\u548CdescIcon\u5B57\u6BB5\u663E\u793A\u989D\u5916\u7684\u4EA7\u54C1\u63CF\u8FF0\u4FE1\u606F',\n },\n },\n },\n}\n\nexport const WithDescriptionTextDark: Story = {\n args: {\n data: {\n ...defaultData,\n theme: 'dark',\n desc: '20,000Pa',\n descIcon:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E26\u63CF\u8FF0\u6587\u672C\u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithoutSubtitle: Story = {\n args: {\n data: {\n theme: 'light',\n title: 'Precise Navigation',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Precise Navigation',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Precise Navigation Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Precise Navigation Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u65E0\u526F\u6807\u9898\uFF1A\u53EA\u663E\u793A\u6807\u9898\u548C\u56FE\u7247\uFF0C\u4E0D\u663E\u793A\u526F\u6807\u9898',\n },\n },\n },\n}\n\nexport const MinimalContent: Story = {\n args: {\n data: {\n theme: 'light',\n title: 'Simple Title',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n alt: 'Simple Title',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/precise_navigation.png?v=1751271008',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n alt: 'Simple Title Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/3eff1459-0ad0-4484-9768-6912c863e0b7_eufy_E25_HydroJet_Robot_Vacuum_20_000_Pa_Suction_All-in-One_Cleaning_1.png?v=1752660252',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n alt: 'Simple Title Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/mob-e25-precise-navigation.png?v=1752581556',\n mimeType: 'image/png',\n },\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u6700\u5C0F\u5185\u5BB9\uFF1A\u4EC5\u5305\u542B\u6807\u9898\u548C\u56FE\u7247\u7684\u6700\u7B80\u914D\u7F6E',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F - \u5E03\u5C40\u4F4D\u7F6E\u53D8\u4F53 ====================\n\nexport const LayoutRight: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'right',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u53F3\u4FA7\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u53F3\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u5DE6\u4FA7\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Aright\u5B9E\u73B0',\n },\n },\n },\n}\n\nexport const LayoutTop: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'top',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u9876\u90E8\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u4E0A\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0B\u65B9\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Atop\u5B9E\u73B0\uFF0C\u9002\u5408\u7AD6\u5C4F\u5C55\u793A',\n },\n },\n },\n}\n\nexport const LayoutBottom: Story = {\n args: {\n data: {\n ...defaultData,\n layout: 'bottom',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u5E95\u90E8\u5E03\u5C40\uFF1A\u56FE\u7247\u5728\u4E0B\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0A\u65B9\uFF0C\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Abottom\u5B9E\u73B0',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u652F\u6301 ====================\n\nconst videoData: ImageWithTextProps['data'] = {\n title: 'DuoSpiral\u2122 Detangle Brushes',\n subtitle: 'DuoSpiral\u2122 brushes prevent hair from getting tangled for a hassle-free cleaning experience.',\n mediaType: 'video',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n alt: 'DuoSpiral\u2122 Detangle Brushes',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'image/png',\n },\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'DuoSpiral\u2122 Detangle Brushes Video',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n alt: 'DuoSpiral\u2122 Detangle Brushes Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n mimeType: 'image/png',\n },\n mobVideo: {\n url: 'https://cdn.shopify.com/videos/c/o/v/00a233ef01dc40628874e563c8abffac.mp4',\n alt: 'DuoSpiral\u2122 Detangle Brushes Mobile Video',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_3_790f438a-3cb2-4a8b-a79b-4f47825ee911.png?v=1752820811',\n mimeType: 'video/mp4',\n },\n}\n\nexport const WithVideo: Story = {\n args: {\n data: videoData,\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u652F\u6301(\u9ED8\u8BA4\u5DE6\u4FA7\u5E03\u5C40)\uFF1A\u901A\u8FC7\u8BBE\u7F6EmediaType\u4E3Avideo\uFF0C\u4F7F\u7528video\u548CmobileVideo\u5B57\u6BB5\u5C55\u793A\u89C6\u9891\u5185\u5BB9\uFF0C\u652F\u6301\u684C\u9762\u7AEF\u548C\u79FB\u52A8\u7AEF\u4E0D\u540C\u89C6\u9891\uFF0C\u5E26\u61D2\u52A0\u8F7D\u529F\u80FD',\n },\n },\n },\n}\n\nexport const WithVideoRight: Story = {\n args: {\n data: {\n ...videoData,\n layout: 'right',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u53F3\u4FA7\u5E03\u5C40\uFF1A\u89C6\u9891\u5728\u53F3\u4FA7\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u5DE6\u4FA7\uFF0C\u7ED3\u5408mediaType\u548Clayout\u5B9E\u73B0',\n },\n },\n },\n}\n\nexport const WithVideoTop: Story = {\n args: {\n data: {\n ...videoData,\n layout: 'top',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F - \u89C6\u9891\u9876\u90E8\u5E03\u5C40\uFF1A\u89C6\u9891\u5728\u4E0A\u65B9\uFF0C\u6587\u5B57\u5185\u5BB9\u5728\u4E0B\u65B9\uFF0C\u9002\u5408\u5F3A\u8C03\u89C6\u9891\u5185\u5BB9\u7684\u573A\u666F',\n },\n },\n },\n}\n\n// ==================== \u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 ====================\n\nconst featureData: ImageWithTextProps['data'] = {\n title: 'AI.See\u2122 Obstacle Avoidance',\n subtitle: 'Advanced AI and RGB visual recognition.',\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance.png?v=1751341747',\n alt: 'AI.See\u2122 Obstacle Avoidance',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance.png?v=1751341747',\n mimeType: 'image/png',\n },\n padImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-pad-ai.png?v=1752582807',\n alt: 'AI.See\u2122 Obstacle Avoidance Pad',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e25-pad-ai.png?v=1752582807',\n mimeType: 'image/png',\n },\n mobileImage: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance-mob.png?v=1751341780',\n alt: 'AI.See\u2122 Obstacle Avoidance Mobile',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/aiAvoidance-mob.png?v=1751341780',\n mimeType: 'image/png',\n },\n items: [\n {\n icon: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n alt: 'LED',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon_8330e9da-f343-4f9b-8f7c-fe0a0eccbe2f.svg?v=1751875015',\n mimeType: 'image/svg+xml',\n },\n text: 'LED',\n desc: 'Equipped with LEDs for dark environments',\n },\n {\n icon: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon2_fb84c5b0-dfe6-4930-b637-a8735ed0f946.svg?v=1751875015',\n alt: '200+',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/icon2_fb84c5b0-dfe6-4930-b637-a8735ed0f946.svg?v=1751875015',\n mimeType: 'image/svg+xml',\n },\n text: '200+',\n desc: 'Identifies and avoids 200+ objects.',\n },\n ],\n}\n\nexport const WithItems: Story = {\n args: {\n data: featureData,\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868\uFF1A\u901A\u8FC7\u6DFB\u52A0items\u6570\u7EC4\u5C55\u793A\u4EA7\u54C1\u529F\u80FD\u7279\u6027\u5217\u8868\uFF0C\u652F\u6301\u56FE\u7247/\u89C6\u9891\u548C\u5E03\u5C40\u4F4D\u7F6E\u914D\u7F6E',\n },\n },\n },\n}\n\nexport const WithItemsImageRight: Story = {\n args: {\n data: {\n ...featureData,\n layout: 'right',\n },\n },\n parameters: {\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u56FE\u7247\u5728\u53F3\u4FA7\uFF1A\u901A\u8FC7\u8BBE\u7F6Elayout\u4E3Aright\u5C06\u56FE\u7247\u653E\u7F6E\u5728\u53F3\u4FA7',\n },\n },\n },\n}\n\nexport const WithItemsDark: Story = {\n args: {\n data: {\n ...featureData,\n theme: 'dark',\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u6DF1\u8272\u4E3B\u9898',\n },\n },\n },\n}\n\nexport const WithItemsVideo: Story = {\n args: {\n data: {\n title: 'AI.See\u2122 Obstacle Avoidance',\n subtitle: 'Advanced AI and RGB visual recognition.',\n mediaType: 'video',\n video: videoData.video,\n padVideo: videoData.video,\n mobVideo: videoData.mobVideo,\n items: featureData.items,\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: '\u57FA\u7840\u6A21\u5F0F + \u529F\u80FD\u5217\u8868 - \u89C6\u9891\u652F\u6301\uFF1A\u529F\u80FD\u5217\u8868\u6A21\u5F0F\u4E5F\u652F\u6301\u89C6\u9891\u5C55\u793A\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u914D\u7F6E',\n },\n },\n },\n}\n\n// ==================== TabWithImage \u6A21\u5F0F ====================\n\nconst tabData: ImageWithTextProps['data'] = {\n desc: 'Effortless customization at your fingertips.',\n title: 'Smart App Control',\n datalist: [\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n alt: 'Customizable Cleaning Modes',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n mimeType: 'image/png',\n },\n title: 'Customizable Cleaning Modes',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n alt: 'Customizable Cleaning Modes Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n alt: 'Customizable Cleaning Modes Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n mimeType: 'image/png',\n },\n },\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e55fcd7a-cebf-45c1-bb71-452abdaf95ae_Frame_2121235327_1.png?v=1751439903',\n alt: 'Multi-Floor Mapping',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/e55fcd7a-cebf-45c1-bb71-452abdaf95ae_Frame_2121235327_1.png?v=1751439903',\n mimeType: 'image/png',\n },\n title: 'Multi-Floor Mapping',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ccdbbbff-5c33-4805-a434-e04a12e32a72_Frame_2121235493.png?v=1752735394',\n alt: 'Multi-Floor Mapping Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ccdbbbff-5c33-4805-a434-e04a12e32a72_Frame_2121235493.png?v=1752735394',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ac28983f-6257-469d-81bb-03dfb54429b6_Frame_2121235514_1.png?v=1752735193',\n alt: 'Multi-Floor Mapping Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/ac28983f-6257-469d-81bb-03dfb54429b6_Frame_2121235514_1.png?v=1752735193',\n mimeType: 'image/png',\n },\n },\n ],\n}\n\nexport const TabMode: Story = {\n args: {\n data: tabData,\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F\uFF1A\u5F53data\u4E2D\u5305\u542Bdatalist\u6570\u7EC4\u65F6\u81EA\u52A8\u542F\u7528\uFF0C\u652F\u6301Tab\u5207\u6362\u548C\u56FE\u7247\u52A8\u753B\u6548\u679C',\n },\n },\n },\n}\n\nexport const TabModeThreeItems: Story = {\n args: {\n data: {\n ...tabData,\n datalist: [\n ...tabData.datalist!,\n {\n image: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n alt: 'Smart Scheduling',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/4e735b0f-8e44-4715-ae1e-d18977ca5404_Frame_2121235327.png?v=1751439585',\n mimeType: 'image/png',\n },\n title: 'Smart Scheduling',\n imgPad: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n alt: 'Smart Scheduling Pad',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/efc82cbc-e848-4ba8-95ae-9e2766323588_Frame_2121235504.png?v=1752664131',\n mimeType: 'image/png',\n },\n imageMob: {\n url: 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n alt: 'Smart Scheduling Mobile',\n thumbnailURL:\n 'https://cdn.shopify.com/s/files/1/0521/9411/5753/files/7ef86e71-eba4-46a5-ab44-61c8bf7c2232_Frame_2121235328.png?v=1752582614',\n mimeType: 'image/png',\n },\n },\n ],\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F - \u4E09\u4E2ATab\u9879',\n },\n },\n },\n}\n\nexport const TabModeWithVideo: Story = {\n args: {\n data: {\n title: 'Smart App Control',\n desc: 'Effortless customization at your fingertips.',\n mediaType: 'video',\n datalist: [\n {\n title: 'Customizable Cleaning Modes',\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'Customizable Cleaning Modes Video',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n image: tabData.datalist![0].image,\n imgPad: tabData.datalist![0].imgPad,\n imageMob: tabData.datalist![0].imageMob,\n },\n {\n title: 'Multi-Floor Mapping',\n video: {\n url: 'https://cdn.shopify.com/videos/c/o/v/82766208a03240b2b0a5f461578923dc.mp4',\n alt: 'Multi-Floor Mapping Video',\n thumbnailURL: 'https://cdn.shopify.com/s/files/1/0504/7094/4954/files/videoframe_0_2_a320c1e6-6860-481b-9d1d-fc8a3338ebaf.png?v=1752820806',\n mimeType: 'video/mp4',\n },\n image: tabData.datalist![1].image,\n imgPad: tabData.datalist![1].imgPad,\n imageMob: tabData.datalist![1].imageMob,\n },\n ],\n },\n },\n parameters: {\n backgrounds: {\n default: 'dark',\n },\n docs: {\n description: {\n story: 'TabWithImage\u6A21\u5F0F - \u89C6\u9891\u652F\u6301\uFF1ATab\u6A21\u5F0F\u73B0\u5728\u4E5F\u652F\u6301\u89C6\u9891\uFF0C\u901A\u8FC7\u8BBE\u7F6EmediaType\u4E3Avideo\u542F\u7528\uFF0C\u652F\u6301\u4E09\u7AEF\u72EC\u7ACB\u89C6\u9891\u914D\u7F6E',\n },\n },\n },\n}\n\nexport const WithCustomStyles: Story = {\n args: {\n data: defaultData,\n className: 'custom-image-with-text',\n },\n parameters: {\n docs: {\n description: {\n story: `\n\u8BE5\u793A\u4F8B\u5C55\u793A\u4E86\u5982\u4F55\u901A\u8FC7\u6DFB\u52A0\u81EA\u5B9A\u4E49 CSS \u7C7B\u6765\u81EA\u5B9A\u4E49\u7EC4\u4EF6\u6837\u5F0F\u3002\u7EC4\u4EF6\u4E2D\u5DF2\u6DFB\u52A0\u4EE5\u4E0B CSS \u7C7B\u4FBF\u4E8E\u6837\u5F0F\u5B9A\u5236\uFF1A\n\n**\u6839\u5143\u7D20\uFF1A**\n- \\`.image-with-text\\` - \u7EC4\u4EF6\u6839\u5BB9\u5668\n- \\`.image-with-text--dark\\` - \u6DF1\u8272\u4E3B\u9898\u4FEE\u9970\u7B26\n- \\`.image-with-text--light\\` - \u6D45\u8272\u4E3B\u9898\u4FEE\u9970\u7B26\n\n**\u5185\u5BB9\u533A\u57DF\uFF1A**\n- \\`.image-with-text__content\\` - \u5185\u5BB9\u5BB9\u5668\n- \\`.image-with-text__title\\` - \u6807\u9898\n- \\`.image-with-text__subtitle\\` - \u526F\u6807\u9898\n\n**\u63CF\u8FF0\u533A\u57DF\uFF1A**\n- \\`.image-with-text__description\\` - \u63CF\u8FF0\u5BB9\u5668\n- \\`.image-with-text__description-icon\\` - \u63CF\u8FF0\u56FE\u6807\n- \\`.image-with-text__description-text\\` - \u63CF\u8FF0\u6587\u672C\n\n**\u56FE\u7247\u533A\u57DF\uFF1A**\n- \\`.image-with-text__image-wrapper\\` - \u56FE\u7247\u5916\u5C42\u5BB9\u5668\n- \\`.image-with-text__image\\` - \u56FE\u7247\u5143\u7D20\n\n**\u793A\u4F8B CSS \u7528\u6CD5\uFF1A**\n\\`\\`\\`css\n/* \u81EA\u5B9A\u4E49\u5E03\u5C40\u95F4\u8DDD */\n.image-with-text {\n gap: 48px;\n}\n\n/* \u81EA\u5B9A\u4E49\u6807\u9898\u6837\u5F0F */\n.image-with-text__title {\n color: #2563eb;\n font-weight: 800;\n}\n\n/* \u81EA\u5B9A\u4E49\u56FE\u7247\u60AC\u505C\u6548\u679C */\n.image-with-text__image:hover {\n transform: scale(1.05);\n transition: transform 0.3s ease;\n}\n\n/* \u81EA\u5B9A\u4E49\u63CF\u8FF0\u56FE\u6807 */\n.image-with-text__description-icon {\n filter: brightness(1.2);\n}\n\\`\\`\\`\n `,\n },\n },\n },\n}\n"],
5
+ "mappings": "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J,YAAa,CACX,MAAO,gFACT,CACF,CACF,CACF,EAEaI,EAAwB,CACnC,KAAM,CACJ,KAAM,CACJ,MAAO,kCACP,SAAU,0CACV,UAAW,QACX,MAAOR,EAAU,MACjB,SAAUA,EAAU,MACpB,SAAUA,EAAU,SACpB,MAAOI,EAAY,KACrB,CACF,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,0NACT,CACF,CACF,CACF,EAIMK,EAAsC,CAC1C,KAAM,+CACN,MAAO,oBACP,SAAU,CACR,CACE,MAAO,CACL,IAAK,gIACL,IAAK,8BACL,aACE,gIACF,SAAU,WACZ,EACA,MAAO,8BACP,OAAQ,CACN,IAAK,gIACL,IAAK,kCACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,gIACL,IAAK,qCACL,aACE,gIACF,SAAU,WACZ,CACF,EACA,CACE,MAAO,CACL,IAAK,kIACL,IAAK,sBACL,aACE,kIACF,SAAU,WACZ,EACA,MAAO,sBACP,OAAQ,CACN,IAAK,gIACL,IAAK,0BACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,kIACL,IAAK,6BACL,aACE,kIACF,SAAU,WACZ,CACF,CACF,CACF,EAEaC,EAAiB,CAC5B,KAAM,CACJ,KAAMD,CACR,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,yLACT,CACF,CACF,CACF,EAEaE,EAA2B,CACtC,KAAM,CACJ,KAAM,CACJ,GAAGF,EACH,SAAU,CACR,GAAGA,EAAQ,SACX,CACE,MAAO,CACL,IAAK,gIACL,IAAK,mBACL,aACE,gIACF,SAAU,WACZ,EACA,MAAO,mBACP,OAAQ,CACN,IAAK,gIACL,IAAK,uBACL,aACE,gIACF,SAAU,WACZ,EACA,SAAU,CACR,IAAK,gIACL,IAAK,0BACL,aACE,gIACF,SAAU,WACZ,CACF,CACF,CACF,CACF,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,kDACT,CACF,CACF,CACF,EAEaG,EAA0B,CACrC,KAAM,CACJ,KAAM,CACJ,MAAO,oBACP,KAAM,+CACN,UAAW,QACX,SAAU,CACR,CACE,MAAO,8BACP,MAAO,CACL,IAAK,4EACL,IAAK,oCACL,aAAc,8HACd,SAAU,WACZ,EACA,MAAOH,EAAQ,SAAU,CAAC,EAAE,MAC5B,OAAQA,EAAQ,SAAU,CAAC,EAAE,OAC7B,SAAUA,EAAQ,SAAU,CAAC,EAAE,QACjC,EACA,CACE,MAAO,sBACP,MAAO,CACL,IAAK,4EACL,IAAK,4BACL,aAAc,8HACd,SAAU,WACZ,EACA,MAAOA,EAAQ,SAAU,CAAC,EAAE,MAC5B,OAAQA,EAAQ,SAAU,CAAC,EAAE,OAC7B,SAAUA,EAAQ,SAAU,CAAC,EAAE,QACjC,CACF,CACF,CACF,EACA,WAAY,CACV,YAAa,CACX,QAAS,MACX,EACA,KAAM,CACJ,YAAa,CACX,MAAO,oPACT,CACF,CACF,CACF,EAEaI,EAA0B,CACrC,KAAM,CACJ,KAAMvB,EACN,UAAW,wBACb,EACA,WAAY,CACV,KAAM,CACJ,YAAa,CACX,MAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SA+CT,CACF,CACF,CACF",
6
6
  "names": ["ImageWithText", "meta", "imageWithText_stories_default", "defaultData", "Default", "DarkTheme", "WithDescriptionText", "WithDescriptionTextDark", "WithoutSubtitle", "MinimalContent", "LayoutRight", "LayoutTop", "LayoutBottom", "videoData", "WithVideo", "WithVideoRight", "WithVideoTop", "featureData", "WithItems", "WithItemsImageRight", "WithItemsDark", "WithItemsVideo", "tabData", "TabMode", "TabModeThreeItems", "TabModeWithVideo", "WithCustomStyles"]
7
7
  }
package/dist/esm/types/props.d.ts CHANGED
@@ -32,7 +32,7 @@ export type Media = {
32
32
  baseUrl?: string;
33
33
  url: string;
34
34
  thumbnailURL: string;
35
- mimeType: 'video/mp4' | 'image/jpeg' | 'image/png' | 'image/webp';
35
+ mimeType: 'video/mp4' | 'image/jpeg' | 'image/png' | 'image/webp' | 'image/svg+xml';
36
36
  filename?: string;
37
37
  width?: number;
38
38
  height?: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "1.0.26-alpha.1762500619766",
3
+ "version": "1.0.26-alpha.1762509077023",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",
package/tailwind.config.js CHANGED
@@ -188,8 +188,10 @@ module.exports = {
188
188
  },
189
189
  },
190
190
  plugins: [
191
- function ({ addUtilities, theme }) {
192
- const maskUtilities = {
191
+ function (options) {
192
+ var addUtilities = options.addUtilities
193
+ var theme = options.theme
194
+ var maskUtilities = {
193
195
  '.mask-fade-vertical': {
194
196
  '-webkit-mask-image': theme('maskImage.fade-vertical'),
195
197
  'mask-image': theme('maskImage.fade-vertical'),