@scania/tegel 0.0.4 → 0.0.6

package/dist/types/components/datetime/datetime.d.ts

@@ -11,10 +11,10 @@ export declare class Datetime {
   /** Set input in disabled state */
   disabled: boolean;
   /** Size of the input */
-  size: 'sm' | 'md' | '';
-  /** With setting */
+  size: 'sm' | 'md' | 'lg';
+  /** Resets min width rule */
   noMinWidth: boolean;
-  /** Set the variant of the the datetime component. */
+  /** Set the variant of the datetime component. */
   modeVariant: 'primary' | 'secondary';
   /** Name property */
   name: string;
@@ -29,7 +29,11 @@ export declare class Datetime {
   /** Listen to the focus state of the input */
   focusInput: boolean;
   /** Change event for the datetime */
-  customChange: EventEmitter;
+  sddsChange: EventEmitter;
+  /** Blur event for the datetime */
+  sddsBlur: EventEmitter<FocusEvent>;
+  /** Focus event for the datetime */
+  sddsFocus: EventEmitter<FocusEvent>;
   getDefaultValue: () => string;
   componentWillLoad(): void;
   handleFocusIn(): void;
@@ -37,6 +41,8 @@ export declare class Datetime {
   handleInput(e: any): void;
   handleChange(e: Event): void;
   /** Set the input as focus when clicking the whole datetime with suffix/prefix */
-  handleFocusClick(): void;
+  handleFocusClick(e: any): void;
+  /** Set the input as focus when clicking the whole datetime with suffix/prefix */
+  handleBlur(e: any): void;
   render(): any;
 }

package/dist/types/components/datetime/datetime.stories.d.ts

@@ -23,7 +23,7 @@ declare const _default: {
         };
       };
     };
-    type: {
+    state: {
       name: string;
       description: string;
       control: {
@@ -31,13 +31,18 @@ declare const _default: {
       };
       options: string[];
     };
-    defaultValue: {
+    type: {
       name: string;
       description: string;
       control: {
         type: string;
       };
       options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
     size: {
       name: string;
@@ -46,78 +51,74 @@ declare const _default: {
         type: string;
       };
       options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
-    minWidth: {
+    defaultValue: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-    };
-    disabled: {
-      description: string;
-      name: string;
-      control: {
-        type: string;
+      options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
       };
     };
-    label: {
+    noMinWidth: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-    };
-    labelText: {
-      description: string;
-      name: string;
-      control: {
-        type: string;
-      };
-      if: {
-        arg: string;
-        eq: boolean;
+      table: {
+        defaultValue: {
+          summary: boolean;
+        };
       };
     };
-    helper: {
+    label: {
       name: string;
       description: string;
       control: {
         type: string;
       };
     };
-    helperText: {
+    helper: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-      if: {
-        arg: string;
-        eq: boolean;
-      };
     };
-    state: {
+    disabled: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-      options: string[];
+      table: {
+        defaultValue: {
+          summary: boolean;
+        };
+      };
     };
   };
   args: {
+    modeVariant: string;
+    state: string;
     type: string;
     size: string;
     defaultValue: string;
-    minWidth: string;
+    noMinWidth: boolean;
+    label: string;
+    helper: string;
     disabled: boolean;
-    state: string;
-    label: boolean;
-    labelText: string;
-    helper: boolean;
-    helperText: string;
-    modeVariant: string;
   };
 };
 export default _default;

package/dist/types/components/divider/divider-webcomponent.stories.d.ts

@@ -0,0 +1,58 @@
+declare const _default: {
+  title: string;
+  parameters: {
+    layout: string;
+    notes: {
+      Divider: any;
+    };
+    design: {
+      name: string;
+      type: string;
+      url: string;
+    }[];
+  };
+  argTypes: {
+    orientation: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+        options: string[];
+      };
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
+    };
+    width: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      if: {
+        arg: string;
+        eq: string;
+      };
+    };
+    height: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      if: {
+        arg: string;
+        eq: string;
+      };
+    };
+  };
+  args: {
+    orientation: string;
+    width: number;
+    height: number;
+  };
+};
+export default _default;
+export declare const WebComponent: any;

package/dist/types/components/divider/divider.d.ts

@@ -0,0 +1,5 @@
+export declare class Divider {
+  /** Orientation of the Divider, horizontal if not specified. */
+  orientation: 'horizontal' | 'vertical';
+  render(): any;
+}

package/dist/types/components/divider/divider.stories.d.ts

@@ -9,18 +9,21 @@ declare const _default: {
     }[];
   };
   argTypes: {
-    type: {
+    orientation: {
       name: string;
       description: string;
       control: {
         type: string;
       };
       options: string[];
-      table: {
-        defaultValue: {
-          summary: string;
-        };
+    };
+    direction: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
       };
+      options: string[];
     };
     width: {
       name: string;
@@ -44,22 +47,14 @@ declare const _default: {
         eq: string;
       };
     };
-    direction: {
-      name: string;
-      description: string;
-      control: {
-        type: string;
-      };
-      options: string[];
-    };
   };
   args: {
-    type: string;
+    orientation: string;
+    direction: string;
     width: number;
     height: number;
-    direction: string;
   };
 };
 export default _default;
-export declare const Default: any;
+export declare const Native: any;
 export declare const Border: any;

package/dist/types/components/dropdown/dropdown-filter/dropdown-filter.d.ts

@@ -4,12 +4,16 @@ export declare class DropdownFilter {
   searchTerm: string;
   selectedOptionState: any;
   dropdownRef?: HTMLSddsDropdownElement;
+  /** Set the variant of the dropdown. */
+  modeVariant: 'primary' | 'secondary';
   /** Placeholder text for dropdown with no selected item */
   placeholder: string;
   /** Label for dropdown with no selected item */
   label: string;
   /** Add the value of the option to set it as default */
   defaultOption: string;
+  /** Direction that the dropdown will open. Default is auto. */
+  openDirection: 'down' | 'up' | 'auto';
   /** Add the value of the option as string to set it as new selected value */
   selectedOption: string;
   /** Add the value of the option to set it as default */
@@ -19,9 +23,9 @@ export declare class DropdownFilter {
   /** Set to true to make the width following the label text length */
   inline: boolean;
   /** Position of label */
-  labelPosition: 'no-label' | 'inside' | 'outside';
+  labelPosition: 'no-label' | 'outside';
   /** Support `error` state */
-  state: string;
+  state: boolean;
   /** Add helper text in the bottom of dropdown */
   helper: string;
   /** Data is an array of objects that contains label and value

package/dist/types/components/dropdown/dropdown-filter/dropdown-filter.stories.d.ts

@@ -10,20 +10,82 @@ declare const _default: {
     }[];
   };
   argTypes: {
+    modeVariant: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
+    };
+    state: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      table: {
+        defaultValue: {
+          summary: boolean;
+        };
+      };
+    };
     size: {
       name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
+    };
+    openDirection: {
+      name: string;
+      description: string;
       control: {
         type: string;
       };
       options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
+    };
+    labelPosition: {
+      name: string;
       description: string;
+      control: {
+        type: string;
+      };
+      options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
-    placeholder: {
+    labelText: {
       name: string;
-      type: string;
       description: string;
+      control: {
+        type: string;
+      };
+      if: {
+        arg: string;
+        neq: string;
+      };
     };
-    disabled: {
+    placeholder: {
       name: string;
       description: string;
       control: {
@@ -32,41 +94,43 @@ declare const _default: {
     };
     helper: {
       name: string;
+      description: string;
       control: {
         type: string;
       };
-      description: string;
     };
     defaultOption: {
-      description: string;
       name: string;
+      description: string;
       control: {
         type: string;
       };
       options: string[];
     };
-    openDirection: {
+    disabled: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-      options: string[];
       table: {
-        summary: {
-          defaultValue: string;
+        defaultValue: {
+          summary: boolean;
         };
       };
     };
   };
   args: {
+    modeVariant: string;
+    state: boolean;
     size: string;
+    openDirection: string;
+    labelPosition: string;
+    labelText: string;
     placeholder: string;
-    disabled: boolean;
     helper: string;
     defaultOption: string;
-    state: string;
-    openDirection: string;
+    disabled: boolean;
   };
 };
 export default _default;

package/dist/types/components/dropdown/dropdown-native.stories.d.ts

@@ -9,48 +9,63 @@ declare const _default: {
     }[];
   };
   argTypes: {
-    label: {
-      name: string;
-      type: string;
-      description: string;
-    };
-    size: {
+    modeVariant: {
       name: string;
       description: string;
       control: {
         type: string;
       };
       options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
-    disabled: {
+    state: {
       name: string;
       description: string;
       control: {
         type: string;
       };
     };
-    state: {
+    size: {
       name: string;
+      description: string;
       control: {
         type: string;
       };
       options: string[];
+    };
+    label: {
+      name: string;
       description: string;
+      control: {
+        type: string;
+      };
     };
     helper: {
       name: string;
+      description: string;
       control: {
         type: string;
       };
+    };
+    disabled: {
+      name: string;
       description: string;
+      control: {
+        type: string;
+      };
     };
   };
   args: {
-    label: string;
+    modeVariant: string;
+    state: boolean;
     size: string;
-    disabled: boolean;
-    state: string;
+    label: string;
     helper: string;
+    disabled: boolean;
   };
 };
 export default _default;

package/dist/types/components/dropdown/dropdown-option/dropdown-option.d.ts

@@ -8,12 +8,17 @@ export declare class DropdownOption {
   disabled: boolean;
   /** Value is a unique string that will be used for application logic */
   value: string;
-  selectOption: EventEmitter<any>;
+  /** @internal Fires on click on one of the dropdown items */
+  internalSddsSelect: EventEmitter<{
+    value: string | number;
+    label: string | number;
+    parent: HTMLSddsDropdownElement;
+  }>;
   isMultiSelectOption: boolean;
   changeFocusHandler(): void;
   removeFocusHandler(): void;
   onKeyDown(event: KeyboardEvent): void;
   componentWillLoad(): void;
-  selectOptionHandler(value: any): void;
+  handleClick(value: any): void;
   render(): any;
 }

package/dist/types/components/dropdown/dropdown-wc-default.stories.d.ts

@@ -26,63 +26,80 @@ declare const _default: {
         };
       };
     };
+    state: {
+      name: string;
+      description: string;
+      control: {
+        type: string;
+      };
+      table: {
+        defaultValue: {
+          summary: boolean;
+        };
+      };
+    };
     size: {
       name: string;
+      description: string;
       control: {
         type: string;
       };
       options: string[];
-      description: string;
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
-    placeholder: {
+    openDirection: {
       name: string;
-      type: string;
       description: string;
+      control: {
+        type: string;
+      };
+      options: string[];
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
     labelPosition: {
       name: string;
+      description: string;
       control: {
         type: string;
       };
       options: string[];
-      description: string;
+      table: {
+        defaultValue: {
+          summary: string;
+        };
+      };
     };
     labelText: {
       name: string;
-      control: string;
       description: string;
+      control: {
+        type: string;
+      };
       if: {
         arg: string;
         neq: string;
       };
     };
-    disabled: {
+    placeholder: {
       name: string;
       description: string;
       control: {
         type: string;
       };
     };
-    state: {
-      name: string;
-      control: {
-        type: string;
-      };
-      options: string[];
-      description: string;
-    };
     helper: {
       name: string;
-      control: string;
       description: string;
-    };
-    helperText: {
-      name: string;
-      description: string;
-      control: string;
-      if: {
-        arg: string;
-        eq: boolean;
+      control: {
+        type: string;
       };
     };
     defaultOption: {
@@ -97,32 +114,30 @@ declare const _default: {
       };
       options: string[];
     };
-    openDirection: {
+    disabled: {
       name: string;
       description: string;
       control: {
         type: string;
       };
-      options: string[];
       table: {
-        summary: {
-          defaultValue: string;
+        defaultValue: {
+          summary: boolean;
         };
       };
     };
   };
   args: {
     modeVariant: string;
+    state: boolean;
     size: string;
-    placeholder: string;
-    state: string;
-    disabled: boolean;
+    openDirection: string;
     labelPosition: string;
     labelText: string;
-    helper: boolean;
-    helperText: string;
+    placeholder: string;
+    helper: string;
     defaultOption: string;
-    openDirection: string;
+    disabled: boolean;
   };
 };
 export default _default;