@flywheel-io/vision 2.1.0-beta.0 → 2.1.0

package/src/components/icon/icon.types.ts

@@ -1,331 +0,0 @@
-export type IconType = typeof allIcons[number];
-
-export const allIcons = <const>[
-  '3d-sphere-rotate-arrows',
-  'add-circle',
-  'add-new-create',
-  'add-row-above',
-  'add-row-below',
-  'add-server-databases-endpoint',
-  'add-server',
-  'add-user',
-  'ai',
-  'apple',
-  'apply-copy-duplicate',
-  'arrange-filter-sort',
-  'arrow-annotate',
-  'arrow-back-collapse',
-  'arrow-back',
-  'arrow-down',
-  'arrow-forward-collapse',
-  'arrow-forward',
-  'arrow-redo',
-  'arrow-rotate-restore',
-  'arrow-rotate',
-  'arrow-undo',
-  'arrow-up-high-priority',
-  'arrow-up-low-priority',
-  'arrow-up',
-  'arrow',
-  'barcode-serial',
-  'barcode-stack-scan',
-  'bell-notification',
-  'bezier-curve',
-  'blocks-code-test-checkmark',
-  'book-lab-flask',
-  'bookmark-plus-add',
-  'bookmark',
-  'brain',
-  'brightness-photo-edit',
-  'browser-internet-web-windows',
-  'brush-edit-create',
-  'bucket-paint',
-  'button-form-element',
-  'calendar-arrow-left-center',
-  'calendar-schedule',
-  'camera-photo-capture',
-  'cash-banknotes',
-  'certificate',
-  'chart-square',
-  'chart-trend-square',
-  'chat-messages-bubble',
-  'check-mark-certificate',
-  'checklist-tasks-chechmark-square',
-  'checklist',
-  'chevron-back',
-  'chevron-down',
-  'chevron-forward',
-  'chevron-input-number',
-  'chevron-up',
-  'circle-ellipses',
-  'circle',
-  'clap-applause-hands',
-  'clip-attachment',
-  'clock-history',
-  'clock-hour-4',
-  'clock-loading',
-  'close-circled',
-  'close',
-  'closed-freehand-vector-poly',
-  'cloud-network-add',
-  'cloud-storage-checkmark',
-  'cloud-upload',
-  'code-block-embed',
-  'code-text',
-  'color-design-profile',
-  'color-ven-design-profile-central',
-  'column-edit',
-  'computer-chip',
-  'contrast-photo-edit',
-  'copy-item',
-  'creative-commons',
-  'crosshair',
-  'crown-style-circle',
-  'cursor-select',
-  'curve-object-secet-cursor',
-  'data-tree',
-  'delivery-shipment-packages',
-  'dna-hospital-medical',
-  'document-file-add-plus-bottom-left',
-  'document-file-blank',
-  'document-file-checkmark-bottom-left',
-  'document-file-download',
-  'document-file-list-protocol',
-  'document-file-tar',
-  'document-file-upload-bottom-center',
-  'document-file-zip',
-  'document-status-done-checkmark',
-  'document-visible',
-  'documents-file',
-  'documents-files',
-  'done-check-tracked',
-  'done-check',
-  'download-status',
-  'download',
-  'drag-drop-indicator',
-  'draw-rectangle',
-  'earth-globe-fail',
-  'edit-boxed',
-  'edit-erase',
-  'edit',
-  'email-mail-checkmark-group',
-  'email',
-  'embed-circle',
-  'exchange',
-  'expand-pathfinder-dot-square-segmentation',
-  'facebook',
-  'file-blank-image-load-mask',
-  'file-download',
-  'file-text',
-  'files-library-content',
-  'files-library',
-  'files',
-  'filter-sort-add',
-  'filter-sort-check-mark',
-  'filter-sort-delete',
-  'filter',
-  'flag',
-  'flip-horizontal',
-  'flip-vertical',
-  'floppy-save',
-  'flywheel-mark-logo',
-  'flywheel-viewer-mark-logo',
-  'folder-add',
-  'folder-blank',
-  'folder-checked',
-  'folder-copy-expand-arrow-down',
-  'folder-copy-expand-arrow-up',
-  'folder-group',
-  'folder-open',
-  'folder-share',
-  'form-metadata-element',
-  'free-rights',
-  'freehand-vector-poly',
-  'full-screen-zoom',
-  'github-color-login',
-  'gitlab',
-  'graduate-hat',
-  'grid-dot-square',
-  'grid-layout',
-  'hammer-legal-square',
-  'hammer-screwdriver',
-  'hand-money-currency',
-  'header-form-element',
-  'home-modern-door',
-  'home-modern-option-lines',
-  'human-artificial-intelligence',
-  'icon-placeholder',
-  'image-photo-copy-left-down',
-  'image-picture-square',
-  'information-circle',
-  'invoice-checkmark-paid',
-  'invoice',
-  'italic',
-  'items-group-elements',
-  'key',
-  'keyboard',
-  'keychain',
-  'label-tag',
-  'laptop-health-medical-cross',
-  'layers',
-  'layout-grid',
-  'layout',
-  'line',
-  'link-unlink',
-  'link',
-  'linkedin',
-  'linux',
-  'list-paragraph-number',
-  'list-paragraph',
-  'list-test-lab-flask',
-  'livewire-tool',
-  'loading-status-checkmark',
-  'lock-unlock',
-  'lock',
-  'logout',
-  'lung',
-  'lungs',
-  'markdown',
-  'measure-angle',
-  'measure-ruler-calibration',
-  'media-library-imports-dowload',
-  'menu-burger-handle',
-  'menu-horizontal',
-  'menu-list-form-square',
-  'menu-vertical',
-  'message-chat-info',
-  'message-chat-question-support',
-  'message-checkmark-sent',
-  'message-question-checkmark',
-  'microphone-mic-rec-circle',
-  'microphone-mic-rec',
-  'microphone-mic-recording-circle',
-  'minus',
-  'modalities',
-  'molecule',
-  'money-coin',
-  'money-dollar',
-  'money',
-  'monitor-computer',
-  'mouse-big',
-  'move',
-  'music-play-resume',
-  'music-stop',
-  'mute',
-  'network-storage-alert',
-  'notebook-add-plus',
-  'notebook-open',
-  'notebook-pen-edit',
-  'notebook',
-  'notes-pen',
-  'object-search-zoom-plus',
-  'open',
-  'paint-roller',
-  'pause',
-  'pen-edit-circle',
-  'pencil-edit-create',
-  'photo-edit-brightness-invert',
-  'pie-chart',
-  'pie-graph-chart-sample',
-  'plus-add-rectangle',
-  'polygon',
-  'private-mode-protection-circle',
-  'protection-target',
-  'protective-mask',
-  'question-circle',
-  'quote',
-  'radiology-scan-circle',
-  'radiology-scan',
-  'reader-studies',
-  'rotate-arrow-manual',
-  'rotate-item-left',
-  'rotate-item-right',
-  'rotate-refresh',
-  'rotate',
-  'ruler-bidirectional',
-  'ruler',
-  'scanner',
-  'search-loop',
-  'search-user-profile-person',
-  'search-zoom-minus',
-  'search-zoom-plus',
-  'search',
-  'section-form-element',
-  'send-message-share',
-  'server-checkmark',
-  'server-database-endpoint',
-  'server-databases-checkmark-user',
-  'server-databases-connect',
-  'server-databases-download',
-  'server-databases-key-protection',
-  'server-databases-minimal-download',
-  'server-databases-sync-import',
-  'server-databases-sync',
-  'server-upload',
-  'server',
-  'servers-database',
-  'setting-gear',
-  'settings-adjust',
-  'settings-gear-square',
-  'settings-gear',
-  'settings-select',
-  'shapes-objects',
-  'share',
-  'shield-protect',
-  'show-visible',
-  'smiley-emoji-face',
-  'speed-dashboard',
-  'square-fill-outline',
-  'square-fill',
-  'square-outline',
-  'star',
-  'stars-light-sparkle',
-  'stomach',
-  'stop-minus',
-  'substract-group',
-  'switch',
-  'target-space-object-select',
-  'target',
-  'tasklist-to-do-checkmark',
-  'technology-cube-3d',
-  'test-lab-flask',
-  'text-bold',
-  'text-cross',
-  'text-h1',
-  'text-h2',
-  'text-input-form',
-  'text-long',
-  'text-short-form-element',
-  'text-underline',
-  'thumbs-up-like',
-  'timer-clock-style',
-  'trash-delete',
-  'twitter',
-  'undone-uncheck-untracked',
-  'unlimited-repeat-subscription-circle',
-  'upload',
-  'user-checked',
-  'user-delete-cross',
-  'user-document',
-  'user-group',
-  'user-key',
-  'user-lock',
-  'user-profile-cards-pool',
-  'user-profile-group-discovery',
-  'user-setting-gear',
-  'user',
-  'video-player-controls',
-  'visible-eye-hidden',
-  'volume-full',
-  'warning-circle',
-  'warning',
-  'window-finder-resize-arrow-down',
-  'window-finder-resize-arrow-up',
-  'window-resize-left',
-  'window-resize-right',
-  'window-zoom-plus-loupe',
-  'windows',
-  'workspace-mode',
-  'youtube',
-  'zendesk-logo',
-];

package/src/components/icon/icons.stories.scss

@@ -1,63 +0,0 @@
-span {
-  font-family: Inter, sans-serif;
-}
-
-code, pre {
-  font-family: monospace;
-  color: #a22424;
-}
-
-pre {
-  padding: 10px;
-  background-color: #eeeeee;
-  border: 1px solid #dddddd;
-}
-
-.icons {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 25px;
-  padding: 35px 0;
-  align-items: flex-start;
-
-  > span {
-    display: inline-flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 5px;
-    width: 100px;
-    height: 100px;
-    font-size: 12px;
-    position: relative;
-
-    &:hover {
-      background-color: var(--primary-hover);
-      border-radius: 8px;
-      cursor: pointer;
-    }
-
-    .empty {
-      display: none;
-    }
-
-    .copied {
-      position: absolute;
-      background-color: var(--green-base);
-      color: var(--typography-contrast);
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-weight: bold;
-      inset: 0;
-      border-radius: 8px;
-    }
-
-    > fw-icon {
-      padding-top: 12px;
-    }
-
-    > span, > fw-icon {
-      text-align: center;
-    }
-  }
-}

package/src/components/icon/icons.stories.ts

@@ -1,95 +0,0 @@
-import { Clipboard } from '@angular/cdk/clipboard';
-import { CommonModule } from '@angular/common';
-import { Component, importProvidersFrom, Input } from '@angular/core';
-import { FormsModule, ReactiveFormsModule, UntypedFormControl } from '@angular/forms';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { applicationConfig, Meta, moduleMetadata, StoryFn } from '@storybook/angular';
-import { Observable } from 'rxjs';
-import { map, startWith } from 'rxjs/operators';
-
-import { FwTextInputModule } from '../text-input/text-input.module';
-import { FwIconModule } from './icon.module';
-import { allIcons } from './icon.types';
-
-@Component({
-  standalone: true,
-  selector: 'stories-icon-demo',
-  imports: [FwTextInputModule, CommonModule, FwIconModule, ReactiveFormsModule],
-  styleUrls: ['../../scss/icons/icons.scss', './icons.stories.scss'],
-  template: `
-
-    <fw-text-input [formControl]="searchField" placeholder="Search Icons" leftIcon="search"></fw-text-input>
-
-    <div class="icons">
-      <span *ngFor="let name of filteredIcons$ | async" (click)="handleClick(name)">
-        <div [ngClass]="isCopied===name?'copied':'empty'">Copied!</div>
-        <fw-icon [color]="color" [size]="size">{{ name }}</fw-icon>
-        <span>{{ name }}</span>
-      </span>
-    </div>
-  `,
-})
-class IconDemoComponent {
-  @Input() color:
-    | 'primary'
-    | 'secondary'
-    | 'red'
-    | 'orange'
-    | 'green'
-    | 'slate'
-    | 'muted'
-    | 'typography';
-  @Input() size: 'large' | 'medium' | 'small';
-  isCopied = '';
-
-  readonly exampleClass = '<span class="icon-add-user"></span>';
-  readonly exampleLigature = '<fw-icon>add-user</fw-icon>';
-  readonly filteredIcons$: Observable<string[]>;
-  readonly searchField = new UntypedFormControl('');
-
-  constructor(private clipboard: Clipboard) {
-    this.filteredIcons$ = this.searchField.valueChanges.pipe(
-      startWith(''),
-      map((filter: string) => {
-        const filterLower = filter.toLowerCase();
-        return allIcons.filter(name => name.toLowerCase().includes(filterLower));
-      }),
-    );
-  }
-
-  handleClick(name: string): void {
-    this.isCopied = name;
-    this.clipboard.copy(name);
-    setTimeout(() => this.isCopied = '', 1000);
-  }
-}
-
-export default {
-  title: 'Components/Icons',
-  component: IconDemoComponent,
-  parameters: {
-    controls: {
-      exclude: ['exampleClass', 'exampleLigature', 'filteredIcons$', 'searchField'],
-    },
-    design: {
-      type: 'figma',
-      url: 'https://www.figma.com/file/p9qXznB9heIjRXwwNW7QUF/VDS---Icons?type=design&node-id=2-74&mode=design&t=Vf5RoAGE4njJWdO2-11',
-    },
-  },
-  args: {
-    color: 'primary',
-    size: 'medium',
-  },
-  decorators: [
-    moduleMetadata({
-      imports: [CommonModule, FormsModule, FwIconModule, ReactiveFormsModule],
-    }),
-    applicationConfig({
-      providers: [importProvidersFrom(NoopAnimationsModule)],
-    }),
-  ],
-} as Meta;
-
-const fwIconTemplate: StoryFn<IconDemoComponent> = (args) => ({ props: args });
-
-export const Icons = fwIconTemplate.bind({});