carriera-intern 0.0.0 → 1.1.76

package/projects/carriera-intern-components/src/app/components/input/stories/dropdown.stories.ts

@@ -1,376 +0,0 @@
-// Storybook
-import { Meta, moduleMetadata, StoryObj } from '@storybook/angular';
-import { FormGroup, FormControl, ReactiveFormsModule } from '@angular/forms';
-
-// Component
-import { InputComponent } from '../input.component';
-
-// Models
-import { CaiInputConfig } from '../models';
-
-// Options
-import { dropdownOptions } from './dropdown-options';
-
-const meta: Meta<InputComponent> = {
-  title: 'Components/Input/All Dropdowns',
-  component: InputComponent,
-  decorators: [
-    moduleMetadata({
-      imports: [ReactiveFormsModule],
-    }),
-  ],
-};
-
-export default meta;
-type Story = StoryObj<InputComponent>;
-
-const baseConfig: CaiInputConfig = {
-  type: 'text',
-  name: 'Dropdown',
-  search: true,
-  dropdown: true,
-  optionLabel: 'name',
-};
-
-const render = (args: any, width: string = '280px') => ({
-  props: {
-    ...args,
-    form: new FormGroup({
-      input: new FormControl(),
-    }),
-  },
-  template: `
-    <div style="display: flex; gap: 12px; box-sizing: border-box;">
-      <form [formGroup]="form" style="width: ${width};">
-        <cai-input [config]="config" formControlName="input" [options]="options"></cai-input>
-      </form>
-      <pre style="margin-top: 12px">{{ form.value | json }}</pre>
-    </div>
-  `,
-  parameters: {
-    layout: 'fullscreen',
-  },
-});
-
-// --- Stories ---
-
-// Single Option
-
-export const Default: Story = {
-  args: {
-    config: baseConfig,
-    options: dropdownOptions.basic,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Broker: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'broker',
-      name: 'Broker',
-    },
-    options: dropdownOptions.broker,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const Shipper: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'shipper',
-    },
-    options: dropdownOptions.shipper,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const Contact: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'contact',
-      name: 'Contact',
-    },
-    options: dropdownOptions.contact,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Bank: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'bank',
-      name: 'Bank',
-      add: true,
-      writeAddValue: true,
-    },
-    options: dropdownOptions.bank,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Dispatcher: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'dispatcher',
-      name: 'Dispatcher',
-    },
-    options: dropdownOptions.dispatcher,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Truck: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'truck',
-      name: 'Truck',
-    },
-    options: dropdownOptions.truck,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Trailer: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'trailer',
-      name: 'Trailer',
-    },
-    options: dropdownOptions.trailer,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Hazardous: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'hazardous',
-      name: 'Hazardous',
-    },
-    options: dropdownOptions.hazardous,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const State: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'state',
-      name: 'State',
-      fullState: true,
-    },
-    options: dropdownOptions.state,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Owner: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'owner',
-      name: 'Owner',
-    },
-    options: dropdownOptions.owner,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const Fuelcard: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'fuelcard',
-      name: 'Fuelcard',
-    },
-    options: dropdownOptions.fuelcard,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const PM: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'pm',
-      name: 'PM',
-    },
-    options: dropdownOptions.pm,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Color: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'color',
-      name: 'Color',
-    },
-    options: dropdownOptions.color,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Make: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'make',
-      name: 'Make',
-    },
-    options: dropdownOptions.truckMake,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const Provider: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'provider',
-      name: 'Provider',
-    },
-    options: dropdownOptions.provider,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-// Grouped
-
-export const Toll: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'toll',
-      name: 'Toll',
-    },
-    options: dropdownOptions.toll,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const FuelStopTransaction: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'fuel-stop-transaction',
-      name: 'Fuel Stop',
-      add: true,
-    },
-    options: dropdownOptions.fuelStopTransaction,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const Dispatch: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'dispatch',
-      name: 'Dispatch',
-    },
-    options: dropdownOptions.dispatch,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const DispatchFTL: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'ftl-dispatch',
-      name: 'FTL Dispatch',
-    },
-    options: dropdownOptions.dispatch,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const DispatchNoBoard: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'dispatch',
-      name: 'Dispatch No Board',
-    },
-    options: dropdownOptions.dispatchNoBoard,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-// Load Split
-export const SplitDriver: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'split-driver',
-      name: 'Split Driver',
-    },
-    options: dropdownOptions.splitDriver,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const SplitTruck: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'split-truck',
-      name: 'Split Truck',
-    },
-    options: dropdownOptions.splitTruck,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-export const SplitTrailer: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'split-trailer',
-      name: 'Split Trailer',
-    },
-    options: dropdownOptions.splitTrailer,
-  },
-  render: (args) => render(args, '280px'),
-};
-
-// Other
-
-export const Multiple: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      dropdown: 'multiple',
-      name: 'Multiple',
-    },
-    options: dropdownOptions.basic,
-  },
-  render: (args) => render(args, '612px'),
-};
-
-export const Subcontent: Story = {
-  args: {
-    config: {
-      ...baseConfig,
-      type: 'number',
-      dropdown: 'subcontent',
-      name: 'Subcontent',
-      search: false,
-    },
-    preselectedUnit: null,
-    options: dropdownOptions.subcontent,
-  },
-  render: (args) => render(args, '280px'),
-};