chore(Icon): remove the useless icon-set file listing all the icons (…

…#1125)
Endava · Jun 21, 2024 · 2162668 · 2162668
1 parent 8108b13
commit 2162668
Show file tree

Hide file tree

Showing 10 changed files with 12 additions and 1,350 deletions.
diff --git a/packages/beeq/project.json b/packages/beeq/project.json
@@ -120,15 +120,12 @@
     },
     "icons": {
       "executor": "@beeq/tools:icons",
-      "outputs": ["{options.downloadPath}", "{options.extractToPath}", "{options.outputDir}"],
+      "outputs": ["{options.downloadPath}", "{options.extractToPath}"],
       "options": {
         "assetsFolder": "assets",
         "downloadPath": "tmp",
         "extractToPath": "packages/beeq/src/components/icon/svg",
         "fileName": "main.zip",
-        "helperFile": "icons-set.ts",
-        "outputDir": "packages/beeq/src/components/icon/helper",
-        "sourceDir": "packages/beeq/src/components/icon/svg/regular",
         "svgFolder": "core-main",
         "sourceUrl": "https://github.com/phosphor-icons/core/archive/refs/heads"
       }

diff --git a/packages/beeq/src/components/icon/_storybook/bq-icon.stories.tsx b/packages/beeq/src/components/icon/_storybook/bq-icon.stories.tsx
@@ -1,12 +1,9 @@
 import type { Args, Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit-html';
 import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { repeat } from 'lit-html/directives/repeat.js';
 
 import mdx from './bq-icon.mdx';
-import { getRandomFromArray } from '../../../shared/utils';
 import { ICON_WEIGHT } from '../bq-icon.types';
-import { ICONS_SET } from '../helper/icons-set';
 
 const meta: Meta = {
   title: 'Components/Icon',
@@ -21,7 +18,7 @@ const meta: Meta = {
     icons: { table: { disable: true } },
     color: { control: 'text' },
     label: { control: 'text' },
-    name: { control: 'select', options: [...ICONS_SET] },
+    name: { control: 'text' },
     size: { control: 'number' },
     src: { control: 'text' },
     weight: { control: 'select', options: [...ICON_WEIGHT] },
@@ -66,15 +63,15 @@ export const Custom: Story = {
 };
 
 export const ExploreIcons: Story = {
-  render: (args: Args) => html`
+  render: () => html`
     <style>
       bq-button::part(button) {
         text-decoration: none;
       }
     </style>
-    <div class="mb-8 text-text-primary">
+    <div class="text-text-primary m-be-xl">
       <h1 class="text-xl font-bold">We didn't reinvent the wheel</h1>
-      <p class="mt-2">
+      <p class="m-bs-xs">
         BEEQ icons are based on
         <a
           class="bq-link"
@@ -92,31 +89,12 @@ export const ExploreIcons: Story = {
         (Below, you're seeing only a few examples of the icons that the library provides)
       </span>
     </div>
-    <bq-button class="mb-8" appearance="primary" href="https://phosphoricons.com/" target="_blank">
+    <bq-button appearance="primary" href="https://phosphoricons.com/" target="_blank">
       <bq-icon name="binoculars" weight="fill" slot="prefix"></bq-icon>
       Explore all the icons available
-      <bq-icon class="ml-4" name="caret-right" weight="regular" slot="suffix"></bq-icon>
+      <bq-icon class="ms-m" name="caret-right" weight="regular" slot="suffix"></bq-icon>
     </bq-button>
-    <div class="icon-grid mx-auto my-0 grid grid-cols-[repeat(auto-fill,_minmax(75px,_1fr))] gap-l gap-x-m">
-      ${repeat(
-        getRandomFromArray(args.icons, 36),
-        (icon) => icon,
-        (icon) => html`
-          <div class="group flex flex-col items-stretch text-center outline-0" role="button" tabindex="0">
-            <div
-              class="mb-s flex w-full justify-center rounded-m border-s border-solid border-stroke-primary px-0 py-m transition-[shadow,transform] group-hover:scale-125 group-hover:shadow-l"
-            >
-              ${Template({ ...args, name: icon })}
-            </div>
-            <span class="text-s leading-regular text-text-primary">${icon}</span>
-          </div>
-        `,
-      )}
-    </div>
   `,
-  args: {
-    icons: ICONS_SET,
-  },
   parameters: {
     chromatic: { disableSnapshot: true },
   },