@designcrowd/fe-shared-lib 1.6.0 → 1.6.1

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 (185) hide show
  1. package/.github/workflows/claude.yml +72 -0
  2. package/.storybook/main.ts +2 -5
  3. package/CLAUDE.md +78 -55
  4. package/dist/css/tailwind-brandCrowd.css +25 -4
  5. package/dist/css/tailwind-brandPage.css +16 -3
  6. package/dist/css/tailwind-crazyDomains.css +25 -4
  7. package/dist/css/tailwind-designCom.css +25 -4
  8. package/dist/css/tailwind-designCrowd.css +25 -4
  9. package/index.js +1 -0
  10. package/package.json +36 -32
  11. package/src/atoms/components/AiPoweredLoader/AiPoweredLoader.stories.js +364 -0
  12. package/src/atoms/components/AiPoweredLoader/AiPoweredLoader.vue +296 -0
  13. package/src/atoms/components/Button/variants/ButtonGray.vue +3 -3
  14. package/src/atoms/components/Carousel/Carousel.vue +7 -2
  15. package/src/atoms/components/Icon/Icon.stories.js +5 -7
  16. package/src/atoms/components/Icon/Icon.vue +25 -15
  17. package/src/atoms/components/Icon/icons/crown-alt.vue +5 -0
  18. package/src/atoms/components/Icon/icons/crown.vue +6 -0
  19. package/src/atoms/components/Icon/icons/home-outline.vue +6 -0
  20. package/src/atoms/components/Icon/icons/page-blank.vue +6 -0
  21. package/src/atoms/components/Icon/icons/question-alt.vue +20 -0
  22. package/src/atoms/components/Price/Price.stories.js +42 -21
  23. package/src/experiences/components/AuthFlow/SignIn.vue +10 -3
  24. package/src/experiences/components/AuthFlow/SignUp.vue +1 -1
  25. package/src/experiences/components/SideNavigationPanel/MenuCta.vue +62 -0
  26. package/src/experiences/components/SideNavigationPanel/MenuItem.vue +40 -0
  27. package/src/experiences/components/SideNavigationPanel/SideNavigationPanel.stories.js +219 -0
  28. package/src/experiences/components/SideNavigationPanel/SideNavigationPanel.vue +48 -0
  29. package/src/experiences/components/SideNavigationPanel/types.ts +7 -0
  30. package/src/experiences/components/UploadYourLogoApplication/UploadYourLogoApplication.vue +5 -3
  31. package/src/experiences/components/UploadYourLogoOnBoarding/LogoUploader.vue +8 -1
  32. package/src/experiences/components/UploadYourLogoOnBoarding/LogoUploadingLoader.vue +17 -0
  33. package/src/experiences/components/UploadYourLogoOnBoarding/UploadYourLogoOnBoarding.vue +10 -1
  34. package/src/experiences/components/WebsitesContextualUpgradeModal/WebsiteContextualUpgradeModal.vue +2 -2
  35. package/tailwind.config.js +1 -1
  36. package/vite.config.ts +4 -0
  37. package/.claude/settings.local.json +0 -56
  38. package/.storybook-static/assets/Auth-DT64t5h-.css +0 -1
  39. package/.storybook-static/assets/Auth.stories-C6eXcTSu.js +0 -490
  40. package/.storybook-static/assets/AuthCrazyDomains.stories-DGvEoWCa.js +0 -73
  41. package/.storybook-static/assets/Button-5UzSGUF6.css +0 -1
  42. package/.storybook-static/assets/Button-DKdQT6Fq.js +0 -1
  43. package/.storybook-static/assets/ButtonGroup-DDPXuhxR.css +0 -1
  44. package/.storybook-static/assets/ButtonGroup.stories-DlrYMRSk.js +0 -504
  45. package/.storybook-static/assets/ButtonPrimary-Bu6bXb_c.css +0 -1
  46. package/.storybook-static/assets/ButtonPrimary-BvWW6Duz.js +0 -1
  47. package/.storybook-static/assets/Buttons.stories-CKmd6hkZ.js +0 -761
  48. package/.storybook-static/assets/ButtonsCrazyDomains.stories-DdEuOUrn.js +0 -199
  49. package/.storybook-static/assets/Checkbox.mixin-DkHpdvGa.js +0 -1
  50. package/.storybook-static/assets/Checkbox.stories-DPBUC2Mx.js +0 -246
  51. package/.storybook-static/assets/Checktile.stories-ByaFwplD.js +0 -88
  52. package/.storybook-static/assets/CollapsiblePanel.stories-Y6q3gP9j.js +0 -56
  53. package/.storybook-static/assets/ColorPicker.stories-DdxPUB_R.js +0 -73
  54. package/.storybook-static/assets/CopyToClipboardText.stories-J9qndWxd.js +0 -32
  55. package/.storybook-static/assets/Dropdown.stories-1zKPATii.js +0 -159
  56. package/.storybook-static/assets/DropdownItem-BV-BdThU.css +0 -1
  57. package/.storybook-static/assets/DropdownItem-DA6TdpDb.js +0 -1
  58. package/.storybook-static/assets/FormControl.mixin-DcEBwrV3.js +0 -1
  59. package/.storybook-static/assets/HashRouteModal.stories-BGxvqE22.js +0 -60
  60. package/.storybook-static/assets/HelloBar-CYEZR2kQ.js +0 -1
  61. package/.storybook-static/assets/HelloBar.stories-597Kxj0W.js +0 -342
  62. package/.storybook-static/assets/Icon-C17LFvsP.js +0 -145
  63. package/.storybook-static/assets/Icon.stories-B9iAmcTU.js +0 -151
  64. package/.storybook-static/assets/Icon.stories-CR5vT9H7.js +0 -791
  65. package/.storybook-static/assets/Loader-BWGoT_xC.js +0 -1
  66. package/.storybook-static/assets/LogoBusinessBrandColours-CExzox1Z.js +0 -1
  67. package/.storybook-static/assets/LogoBusinessBrandColours-CeAaMKke.css +0 -1
  68. package/.storybook-static/assets/LogoBusinessBrandColours.stories-kuxAH8B8.js +0 -36
  69. package/.storybook-static/assets/Masonry-C2MNiGg0.css +0 -1
  70. package/.storybook-static/assets/Masonry.stories-CTXJLQ_i.js +0 -71
  71. package/.storybook-static/assets/Modal-CGwEIF5R.css +0 -1
  72. package/.storybook-static/assets/Modal-CydTNprT.js +0 -1
  73. package/.storybook-static/assets/Modal.stories-DZiG5NGM.js +0 -345
  74. package/.storybook-static/assets/Notice.stories-ChOj8CWm.js +0 -222
  75. package/.storybook-static/assets/NumberStepper-Blffv09R.css +0 -1
  76. package/.storybook-static/assets/NumberStepper.stories-CVbKJ_oJ.js +0 -64
  77. package/.storybook-static/assets/PaymentConfigList-BpUMV6cp.css +0 -1
  78. package/.storybook-static/assets/PaymentConfigList.stories-DUD7OZBS.js +0 -130
  79. package/.storybook-static/assets/Picture-B8m1I9xN.js +0 -1
  80. package/.storybook-static/assets/Picture.stories-MMzybhJ6.js +0 -119
  81. package/.storybook-static/assets/Pill-DLXZ_TL8.js +0 -1
  82. package/.storybook-static/assets/Pill.stories-DCP7szJm.js +0 -18
  83. package/.storybook-static/assets/PillBar-os4mJV3M.css +0 -1
  84. package/.storybook-static/assets/PillBar.stories-Bry-zQ6f.js +0 -41
  85. package/.storybook-static/assets/Price-C4GZbDSa.js +0 -1
  86. package/.storybook-static/assets/Price.stories-CMHly9V0.js +0 -337
  87. package/.storybook-static/assets/PromoCard.stories-xsbFtADE.js +0 -299
  88. package/.storybook-static/assets/PublishBrandPageModal-Q9-mNG1q.css +0 -1
  89. package/.storybook-static/assets/PublishBrandPageModal.stories-C9XzW_1m.js +0 -324
  90. package/.storybook-static/assets/SearchBar.stories-DaIneOSz.js +0 -12
  91. package/.storybook-static/assets/Select-DnioWQmi.css +0 -1
  92. package/.storybook-static/assets/Select.stories-BmGYB4pw.js +0 -108
  93. package/.storybook-static/assets/SellDomainNameList.fixtures-LC6fjr_b.js +0 -1
  94. package/.storybook-static/assets/SellDomainNameListModal-DH6khE10.css +0 -1
  95. package/.storybook-static/assets/SellDomainNameListModal-ymtVclFP.js +0 -1
  96. package/.storybook-static/assets/SellDomainNameListModal.stories-DvGvylgx.js +0 -71
  97. package/.storybook-static/assets/SellDomainNameListSearchResult-Cpxq0jDA.css +0 -1
  98. package/.storybook-static/assets/SellDomainNameListSearchResult-D-1CrQyf.js +0 -1
  99. package/.storybook-static/assets/SellDomainNameSearchWithResults-bX--zu97.js +0 -1
  100. package/.storybook-static/assets/SellDomainNameSearchWithResults.stories-DRUJjSdH.js +0 -37
  101. package/.storybook-static/assets/SellDomainNameWidget.stories-CC3LX10s.js +0 -36
  102. package/.storybook-static/assets/SignIn-CPjf8_2O.css +0 -1
  103. package/.storybook-static/assets/SignIn-DI0DSDFe.js +0 -1
  104. package/.storybook-static/assets/Slider-Cog2FFdj.css +0 -1
  105. package/.storybook-static/assets/Slider.stories-B2KGwnJy.js +0 -141
  106. package/.storybook-static/assets/SparkleIcon.stories-Dk904hVE.js +0 -547
  107. package/.storybook-static/assets/StarRating-BtKh7pzm.css +0 -1
  108. package/.storybook-static/assets/StarRating.stories-d2mgOuo2.js +0 -45
  109. package/.storybook-static/assets/TabMenu.stories-Cg2yenqj.js +0 -47
  110. package/.storybook-static/assets/TextCopyField-B66NKTk_.js +0 -1
  111. package/.storybook-static/assets/TextCopyField.stories-B4_ZlfLU.js +0 -47
  112. package/.storybook-static/assets/TextInput-CMoUjT_5.js +0 -1
  113. package/.storybook-static/assets/TextInput.stories-oyyxxf3j.js +0 -233
  114. package/.storybook-static/assets/Textarea.stories-BvhZR6K2.js +0 -207
  115. package/.storybook-static/assets/Toggle.stories-yT5-rL2k.js +0 -161
  116. package/.storybook-static/assets/Tooltip-DyXIgFQH.css +0 -1
  117. package/.storybook-static/assets/Tooltip-ZukyujG5.js +0 -1
  118. package/.storybook-static/assets/Tooltip.stories-sJFylRS_.js +0 -953
  119. package/.storybook-static/assets/UploadYourLogoApplication-Dmw8QcH3.css +0 -1
  120. package/.storybook-static/assets/UploadYourLogoApplication.stories-C9AvzHO_.js +0 -186
  121. package/.storybook-static/assets/UploadYourLogoDropzone-B1ffcicv.js +0 -24
  122. package/.storybook-static/assets/UploadYourLogoDropzone-DQqACf-e.css +0 -1
  123. package/.storybook-static/assets/UploadYourLogoDropzone.stories-D1Dt2ord.js +0 -55
  124. package/.storybook-static/assets/UploadedLogoSearchResultCard.stories-D8oF1Yrx.js +0 -79
  125. package/.storybook-static/assets/WebsiteContextualUpgradeModal-8u1zOZrW.css +0 -1
  126. package/.storybook-static/assets/WebsiteContextualUpgradeModal.stories-mtcvWOAg.js +0 -211
  127. package/.storybook-static/assets/_commonjsHelpers-CE1G-McA.js +0 -1
  128. package/.storybook-static/assets/_plugin-vue_export-helper-DlAUqK2U.js +0 -1
  129. package/.storybook-static/assets/api-lSJGRrF2.js +0 -1
  130. package/.storybook-static/assets/axe-DrS73Vi2.js +0 -20
  131. package/.storybook-static/assets/brand-crowd-api.client-D45NKshX.js +0 -1
  132. package/.storybook-static/assets/bundled-translations-BoWhEDU_.js +0 -1
  133. package/.storybook-static/assets/bundled-translations.de-DE-C4lqla4O.js +0 -1
  134. package/.storybook-static/assets/bundled-translations.es-ES-BxMIllUH.js +0 -1
  135. package/.storybook-static/assets/bundled-translations.fr-CA-MxZpyz0w.js +0 -1
  136. package/.storybook-static/assets/bundled-translations.fr-FR-N7UPCZVr.js +0 -1
  137. package/.storybook-static/assets/bundled-translations.pt-BR-C8tscYuG.js +0 -1
  138. package/.storybook-static/assets/bundled-translations.pt-PT-Dszj5Xfa.js +0 -1
  139. package/.storybook-static/assets/carousel-BelyIYOK.css +0 -1
  140. package/.storybook-static/assets/carousel.stories-CJw3-Iy6.js +0 -668
  141. package/.storybook-static/assets/event-constants-CMO9VQVu.js +0 -1
  142. package/.storybook-static/assets/iframe-B3A6OXQU.js +0 -1104
  143. package/.storybook-static/assets/index-B-eiLVzF.js +0 -7
  144. package/.storybook-static/assets/index-QquxUozE.js +0 -6
  145. package/.storybook-static/assets/matchers-5TDFFDYO-HJu_DfWo.js +0 -14
  146. package/.storybook-static/assets/mediaQueryMixin-CISNqd93.js +0 -1
  147. package/.storybook-static/assets/preload-helper-PPVm8Dsz.js +0 -1
  148. package/.storybook-static/assets/tracking-ATsLLehC.js +0 -1
  149. package/.storybook-static/css/tailwind-brandCrowd.css +0 -2508
  150. package/.storybook-static/css/tailwind-brandPage.css +0 -2188
  151. package/.storybook-static/css/tailwind-crazyDomains.css +0 -2508
  152. package/.storybook-static/css/tailwind-designCom.css +0 -2508
  153. package/.storybook-static/css/tailwind-designCrowd.css +0 -2508
  154. package/.storybook-static/favicon-wrapper.svg +0 -46
  155. package/.storybook-static/favicon.svg +0 -1
  156. package/.storybook-static/iframe.html +0 -713
  157. package/.storybook-static/index.html +0 -148
  158. package/.storybook-static/index.json +0 -1
  159. package/.storybook-static/nunito-sans-bold-italic.woff2 +0 -0
  160. package/.storybook-static/nunito-sans-bold.woff2 +0 -0
  161. package/.storybook-static/nunito-sans-italic.woff2 +0 -0
  162. package/.storybook-static/nunito-sans-regular.woff2 +0 -0
  163. package/.storybook-static/project.json +0 -1
  164. package/.storybook-static/sb-addons/a11y-1/manager-bundle.js +0 -57
  165. package/.storybook-static/sb-addons/links-2/manager-bundle.js +0 -3
  166. package/.storybook-static/sb-addons/storybook-core-server-presets-0/common-manager-bundle.js +0 -628
  167. package/.storybook-static/sb-addons/themes-3/manager-bundle.js +0 -3
  168. package/.storybook-static/sb-common-assets/favicon-wrapper.svg +0 -46
  169. package/.storybook-static/sb-common-assets/favicon.svg +0 -1
  170. package/.storybook-static/sb-common-assets/nunito-sans-bold-italic.woff2 +0 -0
  171. package/.storybook-static/sb-common-assets/nunito-sans-bold.woff2 +0 -0
  172. package/.storybook-static/sb-common-assets/nunito-sans-italic.woff2 +0 -0
  173. package/.storybook-static/sb-common-assets/nunito-sans-regular.woff2 +0 -0
  174. package/.storybook-static/sb-manager/globals-runtime.js +0 -77935
  175. package/.storybook-static/sb-manager/globals.js +0 -24
  176. package/.storybook-static/sb-manager/manager-stores.js +0 -23
  177. package/.storybook-static/sb-manager/runtime.js +0 -20404
  178. package/.storybook-static/vite-inject-mocker-entry.js +0 -2
  179. package/docs/plans/2026-01-30-upgrade-vite7-storybook10-design.md +0 -177
  180. package/docs/plans/2026-01-30-upgrade-vite7-storybook10.md +0 -388
  181. package/public/css/tailwind-brandCrowd.css +0 -2508
  182. package/public/css/tailwind-brandPage.css +0 -2188
  183. package/public/css/tailwind-crazyDomains.css +0 -2508
  184. package/public/css/tailwind-designCom.css +0 -2508
  185. package/public/css/tailwind-designCrowd.css +0 -2508
@@ -1,791 +0,0 @@
1
- import{I as a}from"./Icon-C17LFvsP.js";import"./iframe-B3A6OXQU.js";import"./preload-helper-PPVm8Dsz.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const s={title:"Components/Icons",component:a},e=()=>({components:{Icon:a},data(){return{sizes:["xs","sm","md","lg","xl","2xl","3xl","4xl"],icons:[{name:"websites-upgrade-to-add-page"},{name:"websites-upgrade-to-contact-form"},{name:"websites-upgrade-to-remove-watermark"},{name:"websites-upgrade-to-publish"},{name:"websites-upgrade-to-videos"},{name:"websites-upgrade-to-maps"},{name:"add-page"},{name:"ai"},{name:"arrow-down"},{name:"arrow-left"},{name:"arrow-right"},{name:"arrow-up"},{name:"arrow-up-underline"},{name:"attach"},{name:"auth-facebook"},{name:"auth-facebook-white"},{name:"auth-google"},{name:"badge"},{name:"briefcase"},{name:"brush"},{name:"banner"},{name:"banner-centered"},{name:"button-arrow"},{name:"button-arrow-left"},{name:"button-arrow-right"},{name:"button-brushstroke"},{name:"button-brushstroke-left"},{name:"button-brushstroke-right"},{name:"button-dashed-oval"},{name:"button-dashed-rectangle"},{name:"button-dashed-rounded"},{name:"button-doubleline-oval"},{name:"button-doubleline-rectangle"},{name:"button-doubleline-rounded"},{name:"button-paper"},{name:"button-paper-top"},{name:"button-paper-bottom"},{name:"button-softshadow-oval"},{name:"button-softshadow-rectangle"},{name:"button-softshadow-rounded"},{name:"business"},{name:"business-card-filled"},{name:"business-card-filled"},{name:"cap"},{name:"card"},{name:"cart-empty"},{name:"calendar"},{name:"check"},{name:"check-thin"},{name:"chevron-down"},{name:"chevron-left"},{name:"chevron-right"},{name:"chevron-right-wide"},{name:"chevron-up"},{name:"clipboard-check"},{name:"close"},{name:"community"},{name:"column-1"},{name:"column-2"},{name:"column-3"},{name:"column-4"},{name:"copy"},{name:"delete"},{name:"designs"},{name:"desktop"},{name:"divider-thick"},{name:"divider-thin"},{name:"divider"},{name:"donate"},{name:"download"},{name:"duplicate"},{name:"edit"},{name:"edit-line"},{name:"ellipsis"},{name:"error"},{name:"envelope-email"},{name:"eye-crossed"},{name:"eye-open"},{name:"fees"},{name:"file"},{name:"filter"},{name:"filter-crazy-domains"},{name:"flag"},{name:"folder"},{name:"form"},{name:"form-message"},{name:"contact-message"},{name:"fullscreen"},{name:"fullscreen-exit"},{name:"globe"},{name:"globe-crazy-domains"},{name:"godaddy"},{name:"hamburger"},{name:"hamburger-1"},{name:"hamburger-2"},{name:"hamburger-3"},{name:"hamburger-4"},{name:"nav-style-tab-display-style-1"},{name:"nav-style-tab-display-style-2"},{name:"nav-style-hamburger-display-style-1"},{name:"nav-style-hamburger-display-style-2"},{name:"nav-style-hamburger-display-style-3"},{name:"nav-style-hamburger-display-style-4"},{name:"header-desktop-nav-style-tab-display-style-1"},{name:"header-desktop-nav-style-tab-display-style-2"},{name:"header-desktop-nav-style-tab-display-style-3"},{name:"header-desktop-nav-style-tab-display-style-4"},{name:"header-desktop-nav-style-tab-display-style-5"},{name:"header-desktop-nav-style-tab-display-style-6"},{name:"header-desktop-nav-style-tab-display-style-no-logo-1"},{name:"header-desktop-nav-style-tab-display-style-no-logo-2"},{name:"header-desktop-nav-style-tab-display-style-no-logo-3"},{name:"header-mobile-nav-style-tab-display-style-1"},{name:"header-mobile-nav-style-tab-display-style-2"},{name:"header-desktop-nav-style-hamburger-display-style-1"},{name:"header-desktop-nav-style-hamburger-display-style-2"},{name:"header-desktop-nav-style-hamburger-display-style-no-logo-1"},{name:"header-desktop-nav-style-hamburger-display-style-no-logo-2"},{name:"header-desktop-nav-style-hamburger-display-style-no-logo-3"},{name:"header-mobile-nav-style-hamburger-display-style-1"},{name:"header-mobile-nav-style-hamburger-display-style-2"},{name:"header-mobile-nav-style-hamburger-display-style-3"},{name:"header-mobile-nav-style-hamburger-display-style-4"},{name:"footer-centered"},{name:"footer-left"},{name:"footer-display-style-1"},{name:"footer-display-style-2"},{name:"home"},{name:"home-crazy-domains"},{name:"info"},{name:"jobs"},{name:"display-style-about-1"},{name:"display-style-about-2"},{name:"display-style-about-3"},{name:"display-style-about-4"},{name:"display-style-about-5"},{name:"display-style-about-6"},{name:"display-style-images-1"},{name:"display-style-images-2"},{name:"display-style-images-3"},{name:"display-style-images-4"},{name:"display-style-images-5"},{name:"display-style-images-6"},{name:"display-style-banner-1"},{name:"display-style-banner-2"},{name:"display-style-banner-3"},{name:"display-style-banner-4"},{name:"display-style-banner-5"},{name:"display-style-banner-6"},{name:"display-style-banner-7"},{name:"display-style-banner-8"},{name:"display-style-banner-9"},{name:"display-style-contact-1"},{name:"display-style-contact-2"},{name:"display-style-contact-4"},{name:"display-style-contact-5"},{name:"display-style-contact-6"},{name:"letterhead-filled"},{name:"link"},{name:"location"},{name:"lock"},{name:"macos-command"},{name:"map"},{name:"message"},{name:"minus"},{name:"minus-circle-light"},{name:"mobile"},{name:"mug"},{name:"other"},{name:"pause"},{name:"page-buttons"},{name:"page-hamburger"},{name:"page-tabs"},{name:"palette"},{name:"payment"},{name:"payments-featured"},{name:"payments-textonly"},{name:"payments-thumbnail"},{name:"pen-tool"},{name:"phone"},{name:"plus"},{name:"plus-circle"},{name:"plus-circle-light"},{name:"poll"},{name:"portfolio"},{name:"preview"},{name:"printing"},{name:"processing"},{name:"question"},{name:"reload"},{name:"reorderable"},{name:"resize"},{name:"media"},{name:"search"},{name:"secure"},{name:"send"},{name:"services"},{name:"settings"},{name:"share"},{name:"shield-tick"},{name:"sms"},{name:"social-facebook"},{name:"social-facebook-color"},{name:"social-facebook-crazy-domains"},{name:"social-google"},{name:"social-google-crazy-domains"},{name:"social-instagram-color"},{name:"social-instagram-crazy-domains"},{name:"social-linkedin-color"},{name:"social-share"},{name:"social-twitter-color"},{name:"social-twitter-crazy-domains"},{name:"social-youtube-crazy-domains"},{name:"star-filled"},{name:"star-hollow"},{name:"sticker"},{name:"stop"},{name:"submit"},{name:"time"},{name:"text-image"},{name:"testimonial-centered"},{name:"testimonial-big-image"},{name:"testimonial-columns"},{name:"text-image-left"},{name:"text-image-center"},{name:"text-image-only"},{name:"text-image-right"},{name:"tooltip-bottom"},{name:"tooltip-left"},{name:"tooltip-right"},{name:"tooltip-top"},{name:"upgrade"},{name:"upgrade-alt"},{name:"upload"},{name:"upload-arrow"},{name:"user-accounts"},{name:"user-headset"},{name:"watchlist-filled"},{name:"watchlist-hollow"},{name:"watchlist-hollow-alt"},{name:"link-in-bio-filled"},{name:"digital-business-card-filled"},{name:"website-filled"},{name:"website"},{name:"wholesale"},{name:"zoom"},{name:"zoom-in"},{name:"zoom-out"},{name:"background"},{name:"content"},{name:"images"},{name:"images-gallery"},{name:"image-gallery-grid"},{name:"image-gallery-carousel"},{name:"image-gallery-masonry"},{name:"bc-mast"},{name:"request-payment"},{name:"shop"},{name:"styles"},{name:"templates"},{name:"maker-animate"},{name:"maker-custom-landscape"},{name:"maker-email"},{name:"maker-email-symbol"},{name:"maker-etsy"},{name:"maker-facebook"},{name:"maker-favicon"},{name:"maker-flyer"},{name:"maker-gift-certificate"},{name:"maker-globe"},{name:"maker-image"},{name:"maker-instagram"},{name:"maker-invoice"},{name:"maker-invitation"},{name:"maker-link"},{name:"maker-linkedin"},{name:"maker-menu"},{name:"maker-phone"},{name:"maker-pinterest"},{name:"maker-postcard"},{name:"maker-poster"},{name:"maker-profile"},{name:"maker-qrcode"},{name:"maker-snapchat"},{name:"maker-soundcloud"},{name:"maker-text"},{name:"maker-thankyou-card"},{name:"maker-tiktok"},{name:"maker-t-shirt"},{name:"maker-tumblr"},{name:"maker-twitch"},{name:"maker-twitter"},{name:"maker-video"},{name:"maker-whatsapp"},{name:"maker-uppercase"},{name:"maker-youtube"},{name:"maker-zoom"},{name:"maker-align-center"},{name:"maker-align-justify"},{name:"maker-align-left"},{name:"maker-align-right"},{name:"maker-italic"},{name:"maker-bold"},{name:"maker-play"},{name:"maker-pause"},{name:"maker-eraser"},{name:"layout-ibn-tcn",altText:"Layout"},{name:"layout-ibn-tcs",altText:"Layout"},{name:"layout-ibs-tcn",altText:"Layout"},{name:"layout-icn-ctc",altText:"Layout"},{name:"layout-icn-ctt",altText:"Layout"},{name:"layout-icn-ctb",altText:"Layout"},{name:"layout-itn-tjn",altText:"Layout"},{name:"layout-iln-tjn",altText:"Layout"},{name:"layout-irn-tjn",altText:"Layout"},{name:"layout-iln-tcn",altText:"Layout"},{name:"layout-iln-tln",altText:"Layout"},{name:"layout-ils-tln",altText:"Layout"},{name:"layout-irn-tcn",altText:"Layout"},{name:"layout-irn-trn",altText:"Layout"},{name:"layout-irs-trn",altText:"Layout"},{name:"layout-itn-tcn",altText:"Layout"},{name:"layout-itn-tcs",altText:"Layout"},{name:"layout-its-tcn",altText:"Layout"},{name:"reset"},{name:"undo"},{name:"redo"},{name:"filters"},{name:"layer"},{name:"layer-bring-front"},{name:"layer-send-back"},{name:"opacity"},{name:"ban"},{name:"shape"},{name:"flip-horizontal"},{name:"flip-vertical"},{name:"volume"},{name:"volume-muted"},{name:"crop"},{name:"pages"},{name:"arrow-top-right"},{name:"aspect-ratio1_1"},{name:"aspect-ratio2_3"},{name:"aspect-ratio3_2"},{name:"aspect-ratio3_4"},{name:"aspect-ratio4_3"},{name:"aspect-ratio9_16"},{name:"aspect-ratio16_9"},{name:"aspect-ratio-circle"},{name:"aspect-ratio-original"}]}},template:`
2
- <table class="tw-w-full">
3
- <thead>
4
- <tr>
5
- <th class="tw-text-center tw-p-4 tw-bg-grayscale-400 tw-font-sans">Icon ({{icons.length}})</th>
6
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
7
- </tr>
8
- </thead>
9
- <tr v-for="(icon, i) in icons" :key="i" :class="{'tw-bg-grayscale-200': i % 2 !== 0}">
10
- <td class="tw-p-4 tw-bg-grayscale-400">
11
- <div class="tw-grid tw-grid-cols-8 tw-gap-4 tw-items-center" style="grid-template-columns: repeat(8, minmax(0, 1fr));">
12
- <Icon
13
- v-for="size in sizes"
14
- viewBox="0 0 96 96"
15
- :name="icon.name"
16
- :alt-text="icon.altText"
17
- :size="size"
18
- />
19
- </div>
20
- </td>
21
- <td class="tw-p-4">
22
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
23
- &lt;Icon :name="{{ icon.name }}" :alt-text="{{ icon.altText }}" size="{{ sizes.join('|') }}" /&gt;
24
- </code>
25
- </td>
26
- </tr>
27
- </table>
28
- `});e.story={name:"Icon Library"};e.parameters={...e.parameters,docs:{...e.parameters?.docs,source:{originalSource:`() => {
29
- return {
30
- components: {
31
- Icon
32
- },
33
- data() {
34
- return {
35
- sizes: ['xs', 'sm', 'md', 'lg', 'xl', '2xl', '3xl', '4xl'],
36
- icons: [{
37
- name: 'websites-upgrade-to-add-page'
38
- }, {
39
- name: 'websites-upgrade-to-contact-form'
40
- }, {
41
- name: 'websites-upgrade-to-remove-watermark'
42
- }, {
43
- name: 'websites-upgrade-to-publish'
44
- }, {
45
- name: 'websites-upgrade-to-videos'
46
- }, {
47
- name: 'websites-upgrade-to-maps'
48
- }, {
49
- name: 'add-page'
50
- }, {
51
- name: 'ai'
52
- }, {
53
- name: 'arrow-down'
54
- }, {
55
- name: 'arrow-left'
56
- }, {
57
- name: 'arrow-right'
58
- }, {
59
- name: 'arrow-up'
60
- }, {
61
- name: 'arrow-up-underline'
62
- }, {
63
- name: 'attach'
64
- }, {
65
- name: 'auth-facebook'
66
- }, {
67
- name: 'auth-facebook-white'
68
- }, {
69
- name: 'auth-google'
70
- }, {
71
- name: 'badge'
72
- }, {
73
- name: 'briefcase'
74
- }, {
75
- name: 'brush'
76
- }, {
77
- name: 'banner'
78
- }, {
79
- name: 'banner-centered'
80
- }, {
81
- name: 'button-arrow'
82
- }, {
83
- name: 'button-arrow-left'
84
- }, {
85
- name: 'button-arrow-right'
86
- }, {
87
- name: 'button-brushstroke'
88
- }, {
89
- name: 'button-brushstroke-left'
90
- }, {
91
- name: 'button-brushstroke-right'
92
- }, {
93
- name: 'button-dashed-oval'
94
- }, {
95
- name: 'button-dashed-rectangle'
96
- }, {
97
- name: 'button-dashed-rounded'
98
- }, {
99
- name: 'button-doubleline-oval'
100
- }, {
101
- name: 'button-doubleline-rectangle'
102
- }, {
103
- name: 'button-doubleline-rounded'
104
- }, {
105
- name: 'button-paper'
106
- }, {
107
- name: 'button-paper-top'
108
- }, {
109
- name: 'button-paper-bottom'
110
- }, {
111
- name: 'button-softshadow-oval'
112
- }, {
113
- name: 'button-softshadow-rectangle'
114
- }, {
115
- name: 'button-softshadow-rounded'
116
- }, {
117
- name: 'business'
118
- }, {
119
- name: 'business-card-filled'
120
- }, {
121
- name: 'business-card-filled'
122
- }, {
123
- name: 'cap'
124
- }, {
125
- name: 'card'
126
- }, {
127
- name: 'cart-empty'
128
- }, {
129
- name: 'calendar'
130
- }, {
131
- name: 'check'
132
- }, {
133
- name: 'check-thin'
134
- }, {
135
- name: 'chevron-down'
136
- }, {
137
- name: 'chevron-left'
138
- }, {
139
- name: 'chevron-right'
140
- }, {
141
- name: 'chevron-right-wide'
142
- }, {
143
- name: 'chevron-up'
144
- }, {
145
- name: 'clipboard-check'
146
- }, {
147
- name: 'close'
148
- }, {
149
- name: 'community'
150
- }, {
151
- name: 'column-1'
152
- }, {
153
- name: 'column-2'
154
- }, {
155
- name: 'column-3'
156
- }, {
157
- name: 'column-4'
158
- }, {
159
- name: 'copy'
160
- }, {
161
- name: 'delete'
162
- }, {
163
- name: 'designs'
164
- }, {
165
- name: 'desktop'
166
- }, {
167
- name: 'divider-thick'
168
- }, {
169
- name: 'divider-thin'
170
- }, {
171
- name: 'divider'
172
- }, {
173
- name: 'donate'
174
- }, {
175
- name: 'download'
176
- }, {
177
- name: 'duplicate'
178
- }, {
179
- name: 'edit'
180
- }, {
181
- name: 'edit-line'
182
- }, {
183
- name: 'ellipsis'
184
- }, {
185
- name: 'error'
186
- }, {
187
- name: 'envelope-email'
188
- }, {
189
- name: 'eye-crossed'
190
- }, {
191
- name: 'eye-open'
192
- }, {
193
- name: 'fees'
194
- }, {
195
- name: 'file'
196
- }, {
197
- name: 'filter'
198
- }, {
199
- name: 'filter-crazy-domains'
200
- }, {
201
- name: 'flag'
202
- }, {
203
- name: 'folder'
204
- }, {
205
- name: 'form'
206
- }, {
207
- name: 'form-message'
208
- }, {
209
- name: 'contact-message'
210
- }, {
211
- name: 'fullscreen'
212
- }, {
213
- name: 'fullscreen-exit'
214
- }, {
215
- name: 'globe'
216
- }, {
217
- name: 'globe-crazy-domains'
218
- }, {
219
- name: 'godaddy'
220
- }, {
221
- name: 'hamburger'
222
- }, {
223
- name: 'hamburger-1'
224
- }, {
225
- name: 'hamburger-2'
226
- }, {
227
- name: 'hamburger-3'
228
- }, {
229
- name: 'hamburger-4'
230
- }, {
231
- name: 'nav-style-tab-display-style-1'
232
- }, {
233
- name: 'nav-style-tab-display-style-2'
234
- }, {
235
- name: 'nav-style-hamburger-display-style-1'
236
- }, {
237
- name: 'nav-style-hamburger-display-style-2'
238
- }, {
239
- name: 'nav-style-hamburger-display-style-3'
240
- }, {
241
- name: 'nav-style-hamburger-display-style-4'
242
- }, {
243
- name: 'header-desktop-nav-style-tab-display-style-1'
244
- }, {
245
- name: 'header-desktop-nav-style-tab-display-style-2'
246
- }, {
247
- name: 'header-desktop-nav-style-tab-display-style-3'
248
- }, {
249
- name: 'header-desktop-nav-style-tab-display-style-4'
250
- }, {
251
- name: 'header-desktop-nav-style-tab-display-style-5'
252
- }, {
253
- name: 'header-desktop-nav-style-tab-display-style-6'
254
- }, {
255
- name: 'header-desktop-nav-style-tab-display-style-no-logo-1'
256
- }, {
257
- name: 'header-desktop-nav-style-tab-display-style-no-logo-2'
258
- }, {
259
- name: 'header-desktop-nav-style-tab-display-style-no-logo-3'
260
- }, {
261
- name: 'header-mobile-nav-style-tab-display-style-1'
262
- }, {
263
- name: 'header-mobile-nav-style-tab-display-style-2'
264
- }, {
265
- name: 'header-desktop-nav-style-hamburger-display-style-1'
266
- }, {
267
- name: 'header-desktop-nav-style-hamburger-display-style-2'
268
- }, {
269
- name: 'header-desktop-nav-style-hamburger-display-style-no-logo-1'
270
- }, {
271
- name: 'header-desktop-nav-style-hamburger-display-style-no-logo-2'
272
- }, {
273
- name: 'header-desktop-nav-style-hamburger-display-style-no-logo-3'
274
- }, {
275
- name: 'header-mobile-nav-style-hamburger-display-style-1'
276
- }, {
277
- name: 'header-mobile-nav-style-hamburger-display-style-2'
278
- }, {
279
- name: 'header-mobile-nav-style-hamburger-display-style-3'
280
- }, {
281
- name: 'header-mobile-nav-style-hamburger-display-style-4'
282
- }, {
283
- name: 'footer-centered'
284
- },
285
- // TODO - deprecate
286
- {
287
- name: 'footer-left'
288
- },
289
- // TODO - deprecate
290
-
291
- {
292
- name: 'footer-display-style-1'
293
- }, {
294
- name: 'footer-display-style-2'
295
- }, {
296
- name: 'home'
297
- }, {
298
- name: 'home-crazy-domains'
299
- }, {
300
- name: 'info'
301
- }, {
302
- name: 'jobs'
303
- }, {
304
- name: 'display-style-about-1'
305
- }, {
306
- name: 'display-style-about-2'
307
- }, {
308
- name: 'display-style-about-3'
309
- }, {
310
- name: 'display-style-about-4'
311
- }, {
312
- name: 'display-style-about-5'
313
- }, {
314
- name: 'display-style-about-6'
315
- }, {
316
- name: 'display-style-images-1'
317
- }, {
318
- name: 'display-style-images-2'
319
- }, {
320
- name: 'display-style-images-3'
321
- }, {
322
- name: 'display-style-images-4'
323
- }, {
324
- name: 'display-style-images-5'
325
- }, {
326
- name: 'display-style-images-6'
327
- }, {
328
- name: 'display-style-banner-1'
329
- }, {
330
- name: 'display-style-banner-2'
331
- }, {
332
- name: 'display-style-banner-3'
333
- }, {
334
- name: 'display-style-banner-4'
335
- }, {
336
- name: 'display-style-banner-5'
337
- }, {
338
- name: 'display-style-banner-6'
339
- }, {
340
- name: 'display-style-banner-7'
341
- }, {
342
- name: 'display-style-banner-8'
343
- }, {
344
- name: 'display-style-banner-9'
345
- }, {
346
- name: 'display-style-contact-1'
347
- }, {
348
- name: 'display-style-contact-2'
349
- }, {
350
- name: 'display-style-contact-4'
351
- }, {
352
- name: 'display-style-contact-5'
353
- }, {
354
- name: 'display-style-contact-6'
355
- }, {
356
- name: 'letterhead-filled'
357
- }, {
358
- name: 'link'
359
- }, {
360
- name: 'location'
361
- }, {
362
- name: 'lock'
363
- }, {
364
- name: 'macos-command'
365
- }, {
366
- name: 'map'
367
- }, {
368
- name: 'message'
369
- }, {
370
- name: 'minus'
371
- }, {
372
- name: 'minus-circle-light'
373
- }, {
374
- name: 'mobile'
375
- }, {
376
- name: 'mug'
377
- }, {
378
- name: 'other'
379
- }, {
380
- name: 'pause'
381
- }, {
382
- name: 'page-buttons'
383
- }, {
384
- name: 'page-hamburger'
385
- }, {
386
- name: 'page-tabs'
387
- }, {
388
- name: 'palette'
389
- }, {
390
- name: 'payment'
391
- }, {
392
- name: 'payments-featured'
393
- }, {
394
- name: 'payments-textonly'
395
- }, {
396
- name: 'payments-thumbnail'
397
- }, {
398
- name: 'pen-tool'
399
- }, {
400
- name: 'phone'
401
- }, {
402
- name: 'plus'
403
- }, {
404
- name: 'plus-circle'
405
- }, {
406
- name: 'plus-circle-light'
407
- }, {
408
- name: 'poll'
409
- }, {
410
- name: 'portfolio'
411
- }, {
412
- name: 'preview'
413
- }, {
414
- name: 'printing'
415
- }, {
416
- name: 'processing'
417
- }, {
418
- name: 'question'
419
- }, {
420
- name: 'reload'
421
- }, {
422
- name: 'reorderable'
423
- }, {
424
- name: 'resize'
425
- }, {
426
- name: 'media'
427
- }, {
428
- name: 'search'
429
- }, {
430
- name: 'secure'
431
- }, {
432
- name: 'send'
433
- }, {
434
- name: 'services'
435
- }, {
436
- name: 'settings'
437
- }, {
438
- name: 'share'
439
- }, {
440
- name: 'shield-tick'
441
- }, {
442
- name: 'sms'
443
- }, {
444
- name: 'social-facebook'
445
- }, {
446
- name: 'social-facebook-color'
447
- }, {
448
- name: 'social-facebook-crazy-domains'
449
- }, {
450
- name: 'social-google'
451
- }, {
452
- name: 'social-google-crazy-domains'
453
- }, {
454
- name: 'social-instagram-color'
455
- }, {
456
- name: 'social-instagram-crazy-domains'
457
- }, {
458
- name: 'social-linkedin-color'
459
- }, {
460
- name: 'social-share'
461
- }, {
462
- name: 'social-twitter-color'
463
- }, {
464
- name: 'social-twitter-crazy-domains'
465
- }, {
466
- name: 'social-youtube-crazy-domains'
467
- }, {
468
- name: 'star-filled'
469
- }, {
470
- name: 'star-hollow'
471
- }, {
472
- name: 'sticker'
473
- }, {
474
- name: 'stop'
475
- }, {
476
- name: 'submit'
477
- }, {
478
- name: 'time'
479
- }, {
480
- name: 'text-image'
481
- }, {
482
- name: 'testimonial-centered'
483
- }, {
484
- name: 'testimonial-big-image'
485
- }, {
486
- name: 'testimonial-columns'
487
- }, {
488
- name: 'text-image-left'
489
- }, {
490
- name: 'text-image-center'
491
- }, {
492
- name: 'text-image-only'
493
- }, {
494
- name: 'text-image-right'
495
- }, {
496
- name: 'tooltip-bottom'
497
- }, {
498
- name: 'tooltip-left'
499
- }, {
500
- name: 'tooltip-right'
501
- }, {
502
- name: 'tooltip-top'
503
- }, {
504
- name: 'upgrade'
505
- }, {
506
- name: 'upgrade-alt'
507
- }, {
508
- name: 'upload'
509
- }, {
510
- name: 'upload-arrow'
511
- }, {
512
- name: 'user-accounts'
513
- }, {
514
- name: 'user-headset'
515
- }, {
516
- name: 'watchlist-filled'
517
- }, {
518
- name: 'watchlist-hollow'
519
- }, {
520
- name: 'watchlist-hollow-alt'
521
- }, {
522
- name: 'link-in-bio-filled'
523
- }, {
524
- name: 'digital-business-card-filled'
525
- }, {
526
- name: 'website-filled'
527
- }, {
528
- name: 'website'
529
- }, {
530
- name: 'wholesale'
531
- }, {
532
- name: 'zoom'
533
- }, {
534
- name: 'zoom-in'
535
- }, {
536
- name: 'zoom-out'
537
- }, {
538
- name: 'background'
539
- }, {
540
- name: 'content'
541
- }, {
542
- name: 'images'
543
- }, {
544
- name: 'images-gallery'
545
- }, {
546
- name: 'image-gallery-grid'
547
- }, {
548
- name: 'image-gallery-carousel'
549
- }, {
550
- name: 'image-gallery-masonry'
551
- }, {
552
- name: 'bc-mast'
553
- }, {
554
- name: 'request-payment'
555
- }, {
556
- name: 'shop'
557
- }, {
558
- name: 'styles'
559
- }, {
560
- name: 'templates'
561
- }, {
562
- name: 'maker-animate'
563
- }, {
564
- name: 'maker-custom-landscape'
565
- }, {
566
- name: 'maker-email'
567
- }, {
568
- name: 'maker-email-symbol'
569
- }, {
570
- name: 'maker-etsy'
571
- }, {
572
- name: 'maker-facebook'
573
- }, {
574
- name: 'maker-favicon'
575
- }, {
576
- name: 'maker-flyer'
577
- }, {
578
- name: 'maker-gift-certificate'
579
- }, {
580
- name: 'maker-globe'
581
- }, {
582
- name: 'maker-image'
583
- }, {
584
- name: 'maker-instagram'
585
- }, {
586
- name: 'maker-invoice'
587
- }, {
588
- name: 'maker-invitation'
589
- }, {
590
- name: 'maker-link'
591
- }, {
592
- name: 'maker-linkedin'
593
- }, {
594
- name: 'maker-menu'
595
- }, {
596
- name: 'maker-phone'
597
- }, {
598
- name: 'maker-pinterest'
599
- }, {
600
- name: 'maker-postcard'
601
- }, {
602
- name: 'maker-poster'
603
- }, {
604
- name: 'maker-profile'
605
- }, {
606
- name: 'maker-qrcode'
607
- }, {
608
- name: 'maker-snapchat'
609
- }, {
610
- name: 'maker-soundcloud'
611
- }, {
612
- name: 'maker-text'
613
- }, {
614
- name: 'maker-thankyou-card'
615
- }, {
616
- name: 'maker-tiktok'
617
- }, {
618
- name: 'maker-t-shirt'
619
- }, {
620
- name: 'maker-tumblr'
621
- }, {
622
- name: 'maker-twitch'
623
- }, {
624
- name: 'maker-twitter'
625
- }, {
626
- name: 'maker-video'
627
- }, {
628
- name: 'maker-whatsapp'
629
- }, {
630
- name: 'maker-uppercase'
631
- }, {
632
- name: 'maker-youtube'
633
- }, {
634
- name: 'maker-zoom'
635
- }, {
636
- name: 'maker-align-center'
637
- }, {
638
- name: 'maker-align-justify'
639
- }, {
640
- name: 'maker-align-left'
641
- }, {
642
- name: 'maker-align-right'
643
- }, {
644
- name: 'maker-italic'
645
- }, {
646
- name: 'maker-bold'
647
- }, {
648
- name: 'maker-play'
649
- }, {
650
- name: 'maker-pause'
651
- }, {
652
- name: 'maker-eraser'
653
- }, {
654
- name: 'layout-ibn-tcn',
655
- altText: 'Layout'
656
- }, {
657
- name: 'layout-ibn-tcs',
658
- altText: 'Layout'
659
- }, {
660
- name: 'layout-ibs-tcn',
661
- altText: 'Layout'
662
- }, {
663
- name: 'layout-icn-ctc',
664
- altText: 'Layout'
665
- }, {
666
- name: 'layout-icn-ctt',
667
- altText: 'Layout'
668
- }, {
669
- name: 'layout-icn-ctb',
670
- altText: 'Layout'
671
- }, {
672
- name: 'layout-itn-tjn',
673
- altText: 'Layout'
674
- }, {
675
- name: 'layout-iln-tjn',
676
- altText: 'Layout'
677
- }, {
678
- name: 'layout-irn-tjn',
679
- altText: 'Layout'
680
- }, {
681
- name: 'layout-iln-tcn',
682
- altText: 'Layout'
683
- }, {
684
- name: 'layout-iln-tln',
685
- altText: 'Layout'
686
- }, {
687
- name: 'layout-ils-tln',
688
- altText: 'Layout'
689
- }, {
690
- name: 'layout-irn-tcn',
691
- altText: 'Layout'
692
- }, {
693
- name: 'layout-irn-trn',
694
- altText: 'Layout'
695
- }, {
696
- name: 'layout-irs-trn',
697
- altText: 'Layout'
698
- }, {
699
- name: 'layout-itn-tcn',
700
- altText: 'Layout'
701
- }, {
702
- name: 'layout-itn-tcs',
703
- altText: 'Layout'
704
- }, {
705
- name: 'layout-its-tcn',
706
- altText: 'Layout'
707
- }, {
708
- name: 'reset'
709
- }, {
710
- name: 'undo'
711
- }, {
712
- name: 'redo'
713
- }, {
714
- name: 'filters'
715
- }, {
716
- name: 'layer'
717
- }, {
718
- name: 'layer-bring-front'
719
- }, {
720
- name: 'layer-send-back'
721
- }, {
722
- name: 'opacity'
723
- }, {
724
- name: 'ban'
725
- }, {
726
- name: 'shape'
727
- }, {
728
- name: 'flip-horizontal'
729
- }, {
730
- name: 'flip-vertical'
731
- }, {
732
- name: 'volume'
733
- }, {
734
- name: 'volume-muted'
735
- }, {
736
- name: 'crop'
737
- }, {
738
- name: 'pages'
739
- }, {
740
- name: 'arrow-top-right'
741
- }, {
742
- name: 'aspect-ratio1_1'
743
- }, {
744
- name: 'aspect-ratio2_3'
745
- }, {
746
- name: 'aspect-ratio3_2'
747
- }, {
748
- name: 'aspect-ratio3_4'
749
- }, {
750
- name: 'aspect-ratio4_3'
751
- }, {
752
- name: 'aspect-ratio9_16'
753
- }, {
754
- name: 'aspect-ratio16_9'
755
- }, {
756
- name: 'aspect-ratio-circle'
757
- }, {
758
- name: 'aspect-ratio-original'
759
- }]
760
- };
761
- },
762
- template: \`
763
- <table class="tw-w-full">
764
- <thead>
765
- <tr>
766
- <th class="tw-text-center tw-p-4 tw-bg-grayscale-400 tw-font-sans">Icon ({{icons.length}})</th>
767
- <th class="tw-text-left tw-p-4 tw-bg-grayscale-400 tw-font-sans">Code</th>
768
- </tr>
769
- </thead>
770
- <tr v-for="(icon, i) in icons" :key="i" :class="{'tw-bg-grayscale-200': i % 2 !== 0}">
771
- <td class="tw-p-4 tw-bg-grayscale-400">
772
- <div class="tw-grid tw-grid-cols-8 tw-gap-4 tw-items-center" style="grid-template-columns: repeat(8, minmax(0, 1fr));">
773
- <Icon
774
- v-for="size in sizes"
775
- viewBox="0 0 96 96"
776
- :name="icon.name"
777
- :alt-text="icon.altText"
778
- :size="size"
779
- />
780
- </div>
781
- </td>
782
- <td class="tw-p-4">
783
- <code class="tw-bg-info-100 tw-p-2 tw-rounded tw-bg-gray-400 tw-border tw-border-solid tw-border-info-300 tw-text-info-900">
784
- &lt;Icon :name="{{ icon.name }}" :alt-text="{{ icon.altText }}" size="{{ sizes.join('|') }}" /&gt;
785
- </code>
786
- </td>
787
- </tr>
788
- </table>
789
- \`
790
- };
791
- }`,...e.parameters?.docs?.source}}};const o=["IconSample"];export{e as IconSample,o as __namedExportsOrder,s as default};