mis-crystal-design-system 18.1.6-signal → 18.1.6-test-1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mis-crystal-design-system",
-  "version": "18.1.6-signal",
+  "version": "18.1.6-test-1",
   "peerDependencies": {
     "@angular/common": "*",
     "@angular/core": "*",
@@ -34,36 +34,36 @@
       "esm": "./esm2022/analytics/mis-crystal-design-system-analytics.mjs",
       "default": "./fesm2022/mis-crystal-design-system-analytics.mjs"
     },
-    "./checkbox": {
-      "types": "./checkbox/index.d.ts",
-      "esm2022": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
-      "esm": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
-      "default": "./fesm2022/mis-crystal-design-system-checkbox.mjs"
-    },
     "./async-search-dropdown": {
       "types": "./async-search-dropdown/index.d.ts",
       "esm2022": "./esm2022/async-search-dropdown/mis-crystal-design-system-async-search-dropdown.mjs",
       "esm": "./esm2022/async-search-dropdown/mis-crystal-design-system-async-search-dropdown.mjs",
       "default": "./fesm2022/mis-crystal-design-system-async-search-dropdown.mjs"
     },
+    "./checkbox": {
+      "types": "./checkbox/index.d.ts",
+      "esm2022": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
+      "esm": "./esm2022/checkbox/mis-crystal-design-system-checkbox.mjs",
+      "default": "./fesm2022/mis-crystal-design-system-checkbox.mjs"
+    },
     "./button": {
       "types": "./button/index.d.ts",
       "esm2022": "./esm2022/button/mis-crystal-design-system-button.mjs",
       "esm": "./esm2022/button/mis-crystal-design-system-button.mjs",
       "default": "./fesm2022/mis-crystal-design-system-button.mjs"
     },
-    "./chip": {
-      "types": "./chip/index.d.ts",
-      "esm2022": "./esm2022/chip/mis-crystal-design-system-chip.mjs",
-      "esm": "./esm2022/chip/mis-crystal-design-system-chip.mjs",
-      "default": "./fesm2022/mis-crystal-design-system-chip.mjs"
-    },
     "./datepicker_v2": {
       "types": "./datepicker_v2/index.d.ts",
       "esm2022": "./esm2022/datepicker_v2/mis-crystal-design-system-datepicker_v2.mjs",
       "esm": "./esm2022/datepicker_v2/mis-crystal-design-system-datepicker_v2.mjs",
       "default": "./fesm2022/mis-crystal-design-system-datepicker_v2.mjs"
     },
+    "./chip": {
+      "types": "./chip/index.d.ts",
+      "esm2022": "./esm2022/chip/mis-crystal-design-system-chip.mjs",
+      "esm": "./esm2022/chip/mis-crystal-design-system-chip.mjs",
+      "default": "./fesm2022/mis-crystal-design-system-chip.mjs"
+    },
     "./daterangepicker_v2": {
       "types": "./daterangepicker_v2/index.d.ts",
       "esm2022": "./esm2022/daterangepicker_v2/mis-crystal-design-system-daterangepicker_v2.mjs",

package/specificdatepicker/tz-sdp-container/tz-sdp-container.component.d.ts

@@ -8,11 +8,11 @@ export declare class TzDrpContainerComponent implements OnInit {
     private injectedData;
     private toast;
     readonly data: import("@angular/core").WritableSignal<IDatePickerData>;
-    private dayjsInstance;
+    private readonly dayjsInstance;
     private readonly rawWeekDays;
     readonly localSelectedDates: import("@angular/core").WritableSignal<ISSelectedDatesConfig[]>;
     readonly localSelectedDatesRange: import("@angular/core").WritableSignal<IRSelectedDatesConfig>;
-    readonly isDatesValid: import("@angular/core").WritableSignal<boolean>;
+    readonly isDatesValid: import("@angular/core").Signal<boolean>;
     readonly dateRangeSelected: import("@angular/core").WritableSignal<boolean>;
     readonly singleDatePickerSelected: import("@angular/core").WritableSignal<boolean>;
     readonly openElement: import("@angular/core").WritableSignal<boolean>;

package/table/table.component.d.ts

@@ -1,6 +1,7 @@
 import { AfterViewInit, ElementRef, OnChanges, OnInit, QueryList, Renderer2 } from "@angular/core";
 import { Filter, TableFilterComponent } from "./filter/filter.component";
 import { SortState } from "./sort-icons.directive";
+import { DropdownItem } from "mis-crystal-design-system/dropdown";
 import * as i0 from "@angular/core";
 export declare class TableComponent implements OnInit, AfterViewInit, OnChanges {
     private renderer;
@@ -27,7 +28,15 @@ export declare class TableComponent implements OnInit, AfterViewInit, OnChanges
     colHeaders: QueryList<ElementRef> | any;
     pages: import("@angular/core").WritableSignal<number[]>;
     tableLength: import("@angular/core").WritableSignal<number>;
+    selectedPage: import("@angular/core").WritableSignal<number>;
     pageSelected: import("@angular/core").OutputEmitterRef<number>;
+    pageSizeChanged: import("@angular/core").OutputEmitterRef<number>;
+    pageSizeOptions: import("@angular/core").Signal<{
+        label: string;
+        value: string;
+    }[]>;
+    showPageSizeDropdown: import("@angular/core").Signal<boolean>;
+    selectedPageSizeOption: import("@angular/core").WritableSignal<DropdownItem>;
     tableConfig: import("@angular/core").InputSignal<TableConfig>;
     subTableconfig: import("@angular/core").InputSignal<TableConfig>;
     tableDataLoading: import("@angular/core").InputSignal<boolean>;
@@ -82,8 +91,10 @@ export declare class TableComponent implements OnInit, AfterViewInit, OnChanges
     } | null;
     isRowDisabled(row: any): boolean;
     toggleCheckbox(): void;
+    onPageSizeChange(selectedOption: DropdownItem): void;
+    shouldShowPagination(): boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<TableComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "mis-table", never, { "tableConfig": { "alias": "tableConfig"; "required": false; "isSignal": true; }; "subTableconfig": { "alias": "subTableconfig"; "required": false; "isSignal": true; }; "tableDataLoading": { "alias": "tableDataLoading"; "required": false; "isSignal": true; }; "expandedIndex": { "alias": "expandedIndex"; "required": false; "isSignal": true; }; "tableData": { "alias": "tableData"; "required": false; "isSignal": true; }; "subTableData": { "alias": "subTableData"; "required": false; "isSignal": true; }; "subTableDataLoading": { "alias": "subTableDataLoading"; "required": false; "isSignal": true; }; "currentSort": { "alias": "currentSort"; "required": false; "isSignal": true; }; }, { "filtersUpdated": "filtersUpdated"; "pageSelected": "pageSelected"; "sortChange": "sortChange"; "headerAction": "headerAction"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TableComponent, "mis-table", never, { "tableConfig": { "alias": "tableConfig"; "required": false; "isSignal": true; }; "subTableconfig": { "alias": "subTableconfig"; "required": false; "isSignal": true; }; "tableDataLoading": { "alias": "tableDataLoading"; "required": false; "isSignal": true; }; "expandedIndex": { "alias": "expandedIndex"; "required": false; "isSignal": true; }; "tableData": { "alias": "tableData"; "required": false; "isSignal": true; }; "subTableData": { "alias": "subTableData"; "required": false; "isSignal": true; }; "subTableDataLoading": { "alias": "subTableDataLoading"; "required": false; "isSignal": true; }; "currentSort": { "alias": "currentSort"; "required": false; "isSignal": true; }; }, { "filtersUpdated": "filtersUpdated"; "pageSelected": "pageSelected"; "pageSizeChanged": "pageSizeChanged"; "sortChange": "sortChange"; "headerAction": "headerAction"; }, never, never, false, never>;
 }
 export interface TableConfig {
     height: string | "100%";
@@ -105,6 +116,8 @@ export interface PaginationConfig {
     totalNoOfRows: number;
     selectedPage?: number;
     disablePageJumping?: boolean;
+    showPageSizeDropdown?: boolean;
+    pageSizes?: number[];
 }
 export interface RowConfig {
     height?: string | undefined | null;

package/table/table.module.d.ts

@@ -11,9 +11,10 @@ import * as i8 from "mis-crystal-design-system/checkbox";
 import * as i9 from "@angular/cdk/scrolling";
 import * as i10 from "@angular/cdk/overlay";
 import * as i11 from "@angular/cdk/portal";
+import * as i12 from "mis-crystal-design-system/dropdown";
 export declare class TableModule {
     static forRoot(): ModuleWithProviders<TableModule>;
     static ɵfac: i0.ɵɵFactoryDeclaration<TableModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TableModule, [typeof i1.TableComponent, typeof i2.SubTableComponent, typeof i3.TableFilterComponent, typeof i4.CustomTableCellDirective, typeof i5.SortIconsDirective, typeof i6.ActionsCellComponent], [typeof i7.CommonModule, typeof i8.CheckboxModule, typeof i9.ScrollingModule, typeof i10.OverlayModule, typeof i11.PortalModule], [typeof i1.TableComponent, typeof i2.SubTableComponent, typeof i3.TableFilterComponent, typeof i4.CustomTableCellDirective, typeof i5.SortIconsDirective, typeof i6.ActionsCellComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<TableModule, [typeof i1.TableComponent, typeof i2.SubTableComponent, typeof i3.TableFilterComponent, typeof i4.CustomTableCellDirective, typeof i5.SortIconsDirective, typeof i6.ActionsCellComponent], [typeof i7.CommonModule, typeof i8.CheckboxModule, typeof i9.ScrollingModule, typeof i10.OverlayModule, typeof i11.PortalModule, typeof i12.DropdownModule], [typeof i1.TableComponent, typeof i2.SubTableComponent, typeof i3.TableFilterComponent, typeof i4.CustomTableCellDirective, typeof i5.SortIconsDirective, typeof i6.ActionsCellComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<TableModule>;
 }

package/timepicker/timepicker.component.d.ts

@@ -30,6 +30,8 @@ export declare class TimePickerComponent implements OnInit, OnDestroy {
     minTime: import("@angular/core").InputSignal<number>;
     triggerChange: import("@angular/core").InputSignal<boolean>;
     disable: import("@angular/core").InputSignal<boolean>;
+    disableUserInput: import("@angular/core").InputSignal<boolean>;
+    fontSize: import("@angular/core").InputSignal<string>;
     private computedFirstInterval;
     private _isInitializing;
     timeEmitter: import("@angular/core").OutputEmitterRef<ITime>;
@@ -50,5 +52,5 @@ export declare class TimePickerComponent implements OnInit, OnDestroy {
     populateDropdown(): void;
     ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "mis-timepicker", never, { "clockFormat": { "alias": "clockFormat"; "required": false; "isSignal": true; }; "timezone": { "alias": "timezone"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "inputWidth": { "alias": "inputWidth"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "interval": { "alias": "interval"; "required": false; "isSignal": true; }; "dateAsEpoch": { "alias": "dateAsEpoch"; "required": false; "isSignal": true; }; "firstInterval": { "alias": "firstInterval"; "required": false; "isSignal": true; }; "rangeValidity": { "alias": "rangeValidity"; "required": false; "isSignal": true; }; "showTooltip": { "alias": "showTooltip"; "required": false; "isSignal": true; }; "givenTime": { "alias": "givenTime"; "required": false; "isSignal": true; }; "minTime": { "alias": "minTime"; "required": false; "isSignal": true; }; "triggerChange": { "alias": "triggerChange"; "required": false; "isSignal": true; }; "disable": { "alias": "disable"; "required": false; "isSignal": true; }; }, { "timeEmitter": "timeEmitter"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "mis-timepicker", never, { "clockFormat": { "alias": "clockFormat"; "required": false; "isSignal": true; }; "timezone": { "alias": "timezone"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "inputWidth": { "alias": "inputWidth"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "interval": { "alias": "interval"; "required": false; "isSignal": true; }; "dateAsEpoch": { "alias": "dateAsEpoch"; "required": false; "isSignal": true; }; "firstInterval": { "alias": "firstInterval"; "required": false; "isSignal": true; }; "rangeValidity": { "alias": "rangeValidity"; "required": false; "isSignal": true; }; "showTooltip": { "alias": "showTooltip"; "required": false; "isSignal": true; }; "givenTime": { "alias": "givenTime"; "required": false; "isSignal": true; }; "minTime": { "alias": "minTime"; "required": false; "isSignal": true; }; "triggerChange": { "alias": "triggerChange"; "required": false; "isSignal": true; }; "disable": { "alias": "disable"; "required": false; "isSignal": true; }; "disableUserInput": { "alias": "disableUserInput"; "required": false; "isSignal": true; }; "fontSize": { "alias": "fontSize"; "required": false; "isSignal": true; }; }, { "timeEmitter": "timeEmitter"; }, never, never, false, never>;
 }

package/timerangepicker/timerangepicker.component.d.ts

@@ -17,6 +17,8 @@ export declare class TimeRangePickerComponent implements OnInit {
     gap: import("@angular/core").InputSignal<string>;
     disableStartTime: import("@angular/core").InputSignal<boolean>;
     disableEndTime: import("@angular/core").InputSignal<boolean>;
+    fontSize: import("@angular/core").InputSignal<string>;
+    disableUserInput: import("@angular/core").InputSignal<boolean>;
     timeRangeEmitter: import("@angular/core").OutputEmitterRef<ITimeRange>;
     startTime: import("@angular/core").WritableSignal<ITime>;
     endTime: import("@angular/core").WritableSignal<ITime>;
@@ -42,5 +44,5 @@ export declare class TimeRangePickerComponent implements OnInit {
     checkTimeValidity(time: string, date: number): boolean;
     rangeValidation(validity: boolean): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<TimeRangePickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TimeRangePickerComponent, "mis-timerangepicker", never, { "inputWidth": { "alias": "inputWidth"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "timezone": { "alias": "timezone"; "required": false; "isSignal": true; }; "startDateEpoch": { "alias": "startDateEpoch"; "required": false; "isSignal": true; }; "endDateEpoch": { "alias": "endDateEpoch"; "required": false; "isSignal": true; }; "givenStartTime": { "alias": "givenStartTime"; "required": false; "isSignal": true; }; "givenEndTime": { "alias": "givenEndTime"; "required": false; "isSignal": true; }; "clockFormat": { "alias": "clockFormat"; "required": false; "isSignal": true; }; "interval": { "alias": "interval"; "required": false; "isSignal": true; }; "showTooltip": { "alias": "showTooltip"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "disableStartTime": { "alias": "disableStartTime"; "required": false; "isSignal": true; }; "disableEndTime": { "alias": "disableEndTime"; "required": false; "isSignal": true; }; }, { "timeRangeEmitter": "timeRangeEmitter"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TimeRangePickerComponent, "mis-timerangepicker", never, { "inputWidth": { "alias": "inputWidth"; "required": false; "isSignal": true; }; "dropdownWidth": { "alias": "dropdownWidth"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "timezone": { "alias": "timezone"; "required": false; "isSignal": true; }; "startDateEpoch": { "alias": "startDateEpoch"; "required": false; "isSignal": true; }; "endDateEpoch": { "alias": "endDateEpoch"; "required": false; "isSignal": true; }; "givenStartTime": { "alias": "givenStartTime"; "required": false; "isSignal": true; }; "givenEndTime": { "alias": "givenEndTime"; "required": false; "isSignal": true; }; "clockFormat": { "alias": "clockFormat"; "required": false; "isSignal": true; }; "interval": { "alias": "interval"; "required": false; "isSignal": true; }; "showTooltip": { "alias": "showTooltip"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "disableStartTime": { "alias": "disableStartTime"; "required": false; "isSignal": true; }; "disableEndTime": { "alias": "disableEndTime"; "required": false; "isSignal": true; }; "fontSize": { "alias": "fontSize"; "required": false; "isSignal": true; }; "disableUserInput": { "alias": "disableUserInput"; "required": false; "isSignal": true; }; }, { "timeRangeEmitter": "timeRangeEmitter"; }, never, never, false, never>;
 }

package/button/button.directive.scss

@@ -1,71 +0,0 @@
-@import '../styles/mis-color-constants.scss';
-
-.mis-btn {
-  background: none;
-  outline: none;
-  border: none;
-  cursor: pointer;
-  border-radius: 4px;
-  vertical-align: middle;
-  text-align: center;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  text-decoration: none;
-  justify-content: center;
-
-  span,
-  img {
-    margin-right: 8px;
-  }
-
-  padding: 10px 16px;
-  font-size: 16px;
-  line-height: 24px;
-  &.mis-btn-lg {
-    padding: 16px;
-    font-weight: bold;
-  }
-  &.mis-btn-sm {
-    padding: 6px 12px;
-    font-size: 14px;
-    line-height: 20px;
-  }
-
-  background-color: transparent;
-  color: var(--brand-primary, $pmry_500);
-  &:hover {
-    background-color: var(--brand-primary-hover, $tr_hover);
-  }
-  &:focus {
-    background-color: var(--brand-primary-active, $tr_pressed);
-  }
-  &:disabled {
-    color: var(--text-tertiary, $text-disabled);
-    pointer-events: none;
-  }
-
-  &.mis-outline {
-    border: 1px solid var(--brand-primary, $pmry_500);
-
-    &:disabled {
-      color: var(--text-tertiary, $text-disabled);
-      border-color: var(--text-tertiary, $text-disabled);
-    }
-  }
-
-  &.mis-primary {
-    background-color: var(--brand-primary, $pmry_500);
-    color: var(--bg-primary, $text_white);
-    &:hover {
-      background-color: var(--brand-primary-dark, $pmry_600);
-    }
-    &:focus {
-      background-color: var(--brand-primary-darker, $pmry_700);
-    }
-    &:disabled {
-      background-color: var(--border-primary, $grey_seperators);
-      color: var(--text-tertiary, $text-disabled);
-    }
-  }
-}

package/drawer/drawer.scss

@@ -1,20 +0,0 @@
-.mis-drawer {
-  display: block;
-  transition: all 300ms ease-out;
-}
-.mis-drawer-overlay {
-  background: var(--bg-overlay-light, rgba(0, 0, 0, 0.12));
-}
-mis-datepicker-container {
-  z-index: 2100;
-}
-
-mis-loader {
-  z-index: 3000;
-}
-
-@keyframes slideOut {
-  to {
-    transform: translateX(100%);
-  }
-}

package/input/mis-input.component.scss

@@ -1,188 +0,0 @@
-@import "../styles/mis-color-constants.scss";
-
-.input-container {
-  position: relative;
-  padding-bottom: 24px;
-  &.mis-disabled {
-    .input-wrapper {
-      pointer-events: none !important;
-    }
-  }
-  .input-wrapper {
-    box-sizing: border-box;
-    display: flex;
-    align-items: center;
-    flex-direction: row;
-    flex-wrap: nowrap;
-    transition: all ease-in 60ms;
-    background-color: var(--bg-primary, $text_white);
-    padding: 3px 16px; // DONE CHANGE
-    gap: 16px;
-    .mis-input {
-      flex: 1 1 auto;
-      z-index: 0; // Ensures a new stacking context
-      position: relative;
-      display: flex;
-      align-items: center;
-    }
-    input {
-      flex: 1 1 auto;
-      border: none;
-      outline: none;
-      height: 100%;
-      padding: 0;
-      font-family: Lato;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 16px;
-      height: 24px;
-      color: var(--text-primary, $text_black);
-      background-color: transparent;
-      width: 100%;
-      vertical-align: middle;
-      position: relative;
-      &::placeholder {
-        transition: all ease-in 100ms;
-        opacity: 0;
-        transform-origin: left center;
-        color: transparent;
-      }
-    }
-    .mis-placeholder {
-      position: absolute;
-      font-family: Lato;
-      font-style: normal;
-      font-weight: normal;
-      font-size: 16px;
-      line-height: 24px;
-      color: var(--text-secondary, $text_muted);
-      transition: all ease-in 150ms;
-      pointer-events: none;
-    }
-
-    &:focus-within {
-      background-color: var(--bg-tertiary, $grey_bg);
-    }
-    &:focus-within {
-      border: 1px solid $pmry_500;
-    }
-    [mis-input-act],
-    [mis-input-icon] {
-      width: 18px;
-      height: 18px;
-      color: var(--text-secondary, $text_muted);
-      font-size: 24px;
-      line-height: 18px;
-    }
-    [mis-input-act] {
-      cursor: pointer;
-    }
-  }
-  &.no-hint {
-    padding-bottom: 0px;
-  }
-  &.has-value {
-    .mis-input .mis-placeholder {
-      color: transparent !important;
-    }
-  }
-
-  &.rounded {
-    input {
-      box-sizing: initial;
-    }
-    &.sm {
-      input {
-        padding: 3px 16px;
-      }
-    }
-    &.md {
-      input {
-        padding: 9px 16px;
-      }
-    }
-    &.lg {
-      input {
-        padding: 15px 16px;
-      }
-    }
-    .input-wrapper {
-      border-radius: 4px;
-      border: 1px solid var(--border-primary, $grey_seperators);
-      padding: 0;
-      // input:not(:disabled) {
-      //   &:hover,
-      //   &:focus {
-      //     background-color: $grey_bg;
-      //   }
-      // }
-      &:hover {
-        background-color: var(--bg-tertiary, $grey_bg);
-      }
-      &:focus-within {
-        border: 1px solid var(--brand-primary, $pmry_500);
-      }
-      // Placeholder visibility controlled by hasValue signal
-      .mis-placeholder {
-        color: var(--text-secondary, $text_muted);
-      }
-      .mis-placeholder {
-        margin-left: 16px;
-        transition-duration: 50ms;
-      }
-    }
-    &.has-error {
-      .input-wrapper {
-        border: 1px solid var(--brand-error, $sem_error) !important;
-      }
-    }
-  }
-  &.floating {
-    .input-wrapper {
-      padding-top: 24px;
-      padding-bottom: 7px; // DONE CHANGE
-      border-bottom: 1px solid var(--border-primary, $grey_seperators);
-      input:focus + .mis-placeholder {
-        color: var(--brand-primary, $pmry_500) !important;
-      }
-      input:not(:placeholder-shown) + .mis-placeholder,
-      input:focus + .mis-placeholder {
-        transform: translateY(calc(-100% + 6px)) !important;
-        font-size: 12px !important;
-        letter-spacing: 0.2px !important;
-      }
-      &:focus-within {
-        border: none;
-        border-bottom: 1px solid var(--brand-primary, $pmry_500);
-        input::placeholder {
-          color: var(--text-secondary, $text_muted);
-          opacity: 1;
-          font-size: 16px;
-        }
-      }
-    }
-    &.has-error {
-      .input-wrapper {
-        border-bottom: 1px solid var(--brand-error, $sem_error) !important;
-        .mis-placeholder {
-          color: var(--brand-error, $sem_error) !important;
-        }
-      }
-    }
-  }
-  [mis-input-hint],
-  [mis-input-error] {
-    position: absolute;
-    left: 0;
-    right: 0px;
-    bottom: 0px;
-    line-height: 24px;
-    height: 24px;
-    font-size: 12px;
-    color: var(--text-secondary, $text_muted);
-    letter-spacing: 0.2px;
-  }
-  [mis-input-error] {
-    color: var(--brand-error, $sem_error);
-  }
-}

package/modal/modal.scss

@@ -1,9 +0,0 @@
-.mis-modal {
-  display: block;
-  overflow: auto;
-  padding: 8px;
-  // transition: all 300ms ease-out;
-}
-.mis-modal-overlay {
-  background: var(--bg-overlay, rgba(0, 0, 0, 0.32));
-}