@uxuissk/design-system-core 3.0.0 → 3.0.1

package/dist/main.d.ts

@@ -70,6 +70,78 @@ export declare class AddonPhoneCountry extends LitElement implements BaseAttribu
     static styles: CSSResult;
 }
 
+export declare interface ADTBulkActionEvent {
+    action: string;
+    selected: string[];
+}
+
+export declare interface ADTColumn {
+    key: string;
+    label: string;
+    width?: string;
+    sortable?: boolean;
+    align?: "left" | "center" | "right";
+    render?: (value: unknown, row: ADTRow) => TemplateResult | string;
+}
+
+export declare interface ADTPageChangeEvent {
+    page: number;
+}
+
+export declare interface ADTRow {
+    id: string;
+    expandContent?: TemplateResult | string;
+    [key: string]: unknown;
+}
+
+export declare interface ADTSelectionChangeEvent {
+    selected: string[];
+}
+
+export declare interface ADTSortChangeEvent {
+    key: string;
+    dir: "asc" | "desc";
+}
+
+export declare class AdvancedDataTable extends LitElement {
+    static registeredName: string;
+    columns: ADTColumn[];
+    rows: ADTRow[];
+    loading: boolean;
+    emptyMessage: string;
+    page: number;
+    pageSize: number;
+    total: number;
+    pageSizeOptions: number[];
+    selectable: boolean;
+    expandable: boolean;
+    sortKey: string;
+    sortDir: "asc" | "desc";
+    testId?: string;
+    private _selected;
+    private _expanded;
+    private get _allSelected();
+    private get _someSelected();
+    private _toggleAll;
+    private _toggleRow;
+    private _emitSelection;
+    private _onSort;
+    private _toggleExpand;
+    private get _totalPages();
+    private _goTo;
+    private _onPageSizeChange;
+    private _onBulkAction;
+    private _clearSelection;
+    private _sortIcon;
+    private _renderSkeletonRows;
+    private _renderCell;
+    private _renderRow;
+    private _renderBulkBar;
+    private _renderPagination;
+    render(): TemplateResult<1>;
+    static styles: CSSResult;
+}
+
 export declare class Alert extends LitElement implements ThemeValue {
     static registeredName: string;
     theme?: Theme;
@@ -92,6 +164,32 @@ export declare class Alert extends LitElement implements ThemeValue {
 
 export declare const applyTheme: (theme: DeepPartial<Theme>) => Theme;
 
+export declare class AppShell extends LitElement {
+    static registeredName: string;
+    navbarHeight: string;
+    sidebarWidth: string;
+    sidebarCollapsedWidth: string;
+    sidebarCollapsed: boolean;
+    noSidebar: boolean;
+    noNavbar: boolean;
+    testId?: string;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
+export declare type AppShellBrand = "sellsuki" | "patona" | "shipmunk" | "akita" | "sellsukipay" | "sukispace" | "oc2plus" | "ccs3";
+
+export declare class AppShellProvider extends LitElement {
+    static registeredName: string;
+    brand: AppShellBrand;
+    testId?: string;
+    connectedCallback(): void;
+    willUpdate(changed: Map<string | number | symbol, unknown>): void;
+    private _applyBrand;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
 export declare class Avatar extends LitElement implements ThemeValue {
     static registeredName: string;
     theme?: Theme;
@@ -135,6 +233,29 @@ export declare class Badge extends LitElement {
 
 export declare type BadgeVariants = "solid" | "outline" | "subtle";
 
+export declare class BarChart extends LitElement {
+    static registeredName: string;
+    series: BarChartSeries[];
+    labels: string[];
+    height: number;
+    showGrid: boolean;
+    showLegend: boolean;
+    barGap: number;
+    testId?: string;
+    private _width;
+    private _ro?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
+export declare interface BarChartSeries {
+    label: string;
+    values: number[];
+    color?: string;
+}
+
 declare type BaseAttributes = {
     testId?: string;
 } & ThemeValue;
@@ -391,8 +512,11 @@ export declare class CodeBlock extends LitElement {
     language?: string | undefined;
     copyButton: boolean;
     code: string;
-    private highlight;
-    private __loadLanguage;
+    shikiTheme: string;
+    private _highlightedHtml;
+    private _doHighlight;
+    connectedCallback(): void;
+    updated(changed: Map<string | number | symbol, unknown>): void;
     render(): TemplateResult_2<1> | typeof nothing;
     private clickCopy;
     static styles: CSSResult[];
@@ -538,6 +662,7 @@ export declare class DatePicker extends LitElement {
     private updateInputValueChange;
     private handleOnBlur;
     private handleOnFocus;
+    private handleKeydown;
     private handleDate;
     private handleChangedDate;
     private handleClickOutside;
@@ -602,6 +727,26 @@ export declare class Divider extends LitElement implements ThemeValue {
     static styles: CSSResult;
 }
 
+export declare class DonutChart extends LitElement {
+    static registeredName: string;
+    slices: DonutSlice[];
+    size: number;
+    thickness: number;
+    showLegend: boolean;
+    centerLabel: string;
+    centerValue: string;
+    testId?: string;
+    private _arc;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
+export declare interface DonutSlice {
+    label: string;
+    value: number;
+    color?: string;
+}
+
 export declare class DownloadFile extends LitElement {
     static registeredName: string;
     theme?: Theme;
@@ -680,6 +825,10 @@ export declare class Dropdown extends LitElement {
     hideSuccessIcon: boolean;
     state: DropdownState;
     forceOpen: undefined;
+    private _searchQuery;
+    private _handleSearchInput;
+    private _filterOptions;
+    private _resetSearch;
     private clearSelection;
     protected willUpdate(changedProperties: Map<string | number | symbol, unknown>): void;
     private handleClickContainer;
@@ -771,7 +920,12 @@ export declare class DynamicTable extends LitElement {
     columnsWidth?: string[];
     backgroundColor?: string;
     stripedBackgroundColor?: string;
+    selectable: boolean;
+    selectedRows: string[];
+    private _selectedRows;
     state: TableState;
+    willUpdate(changed: Map<string | number | symbol, unknown>): void;
+    private _handleBulkActionClick;
     updated(): void;
     private checkScrollEnd;
     render(): TemplateResult_2<1> | typeof nothing;
@@ -813,28 +967,42 @@ export declare class ExpandableCard extends LitElement {
     static styles: CSSResult;
 }
 
-export declare type FontFamilyGroup = "sans" | "serif" | "mono";
-
-export declare type FontWeight = "thin" | "extralight" | "light" | "normal" | "medium" | "semibold" | "bold" | "extrabold" | "black";
+export declare class FeaturePageScaffold extends LitElement {
+    static registeredName: string;
+    padding: string;
+    fullHeight: boolean;
+    testId?: string;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
 
-export declare class Grid extends LitElement {
+export declare class FilterBar extends LitElement {
     static registeredName: string;
-    theme?: Theme;
     testId?: string;
-    draggable: boolean;
-    gap: string;
-    gridItemSize: number;
-    maxColumns: number;
-    items: GridItem[];
-    slottedChildren: Node[];
-    constructor();
-    private grid;
-    static styles: CSSResult[];
-    firstUpdated(): void;
-    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    placeholder: string;
+    search: string;
+    showSearch: boolean;
+    disabled: boolean;
+    size: "sm" | "md" | "lg";
+    private _searchValue;
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _onSearchInput;
+    private _onClear;
+    private _emitChange;
     render(): TemplateResult_2<1>;
+    private _renderSearch;
+    static styles: CSSResult;
 }
 
+export declare interface FilterBarChangeEvent {
+    search: string;
+}
+
+export declare type FontFamilyGroup = "sans" | "serif" | "mono";
+
+export declare type FontWeight = "thin" | "extralight" | "light" | "normal" | "medium" | "semibold" | "bold" | "extrabold" | "black";
+
 export declare interface GridItem {
     id: number;
     x: number;
@@ -1007,16 +1175,19 @@ declare class Image_2 extends LitElement implements ThemeValue {
 export { Image_2 as Image }
 
 export declare class ImageCropper extends LitElement {
+    static registeredName: string;
     src: string;
+    shape: "circle" | "square";
     maskSize: number;
     maskPadding: number;
     maxExportSize?: number;
     fitToMask: boolean;
+    testId?: string;
     private croppieInstance?;
     private containerId;
     createRenderRoot(): this;
     render(): TemplateResult_2<1>;
-    updated(): void;
+    updated(changed: Map<string, unknown>): void;
     crop(format?: "jpeg" | "png" | "webp"): Promise<string | null>;
     disconnectedCallback(): void;
     static styles: CSSResult;
@@ -1158,6 +1329,32 @@ declare type kv = {
     [key: string]: string;
 };
 
+export declare class LineChart extends LitElement {
+    static registeredName: string;
+    series: LineChartSeries[];
+    labels: string[];
+    height: number;
+    smooth: boolean;
+    showDots: boolean;
+    showGrid: boolean;
+    showLegend: boolean;
+    testId?: string;
+    private _width;
+    private _ro?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _computePoints;
+    private _pathD;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
+export declare interface LineChartSeries {
+    label: string;
+    values: number[];
+    color?: string;
+}
+
 declare type LocaleKey = "en" | "fr" | "th";
 
 declare type LocaleKey_2 = "en" | "fr" | "th";
@@ -1268,6 +1465,18 @@ export declare class Modal extends LitElement {
     static styles: CSSResult;
 }
 
+export declare class PageHeader extends LitElement {
+    static registeredName: string;
+    title: string;
+    subtitle: string;
+    showBack: boolean;
+    backLabel: string;
+    testId?: string;
+    private _onBack;
+    render(): TemplateResult_2<1>;
+    static styles: CSSResult;
+}
+
 export declare class Pagination extends LitElement {
     static registeredName: string;
     theme?: Theme;
@@ -1490,6 +1699,7 @@ export declare class RangeDatePicker extends LitElement {
     private handleClickTo;
     private handleOnBlur;
     private handleOnFocus;
+    private handleKeydown;
     private handleDateChanged;
     private handleChangedDateFrom;
     private handleChangedDateTo;
@@ -1542,6 +1752,29 @@ export declare class Sidebar extends LitElement {
     static styles: CSSResult;
 }
 
+export declare interface SidebarAccount {
+    id: string;
+    name: string;
+    role?: string;
+    avatar?: string;
+}
+
+export declare class SidebarAccountSwitcher extends LitElement {
+    static registeredName: string;
+    account?: SidebarAccount;
+    accounts: SidebarAccount[];
+    expanded: boolean;
+    testId?: string;
+    private _open;
+    private _toggle;
+    private _handleOutsideClick;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _selectAccount;
+    render(): TemplateResult_2<1> | typeof nothing;
+    static styles: CSSResult;
+}
+
 export declare class SidebarGroup extends LitElement {
     static registeredName: string;
     private state?;
@@ -1762,6 +1995,9 @@ export declare class TableRow extends LitElement {
 export declare type TableState = {
     sortingColumnId?: string;
     stripedBackgroundColor?: string;
+    selectable?: boolean;
+    selectedRows: string[];
+    toggleRow: (rowKey: string) => void;
 };
 
 export declare class Tabs extends LitElement {
@@ -2259,6 +2495,23 @@ export declare class WidgetExample extends LitElement implements Widget, ThemeVa
     static styles: CSSResult;
 }
 
+export declare class WidgetGrid extends LitElement {
+    static registeredName: string;
+    testId?: string;
+    draggable: boolean;
+    gap: string;
+    gridItemSize: number;
+    maxColumns: number;
+    items: GridItem[];
+    private _slottedChildren;
+    private _grid;
+    constructor();
+    static styles: CSSResult[];
+    firstUpdated(): void;
+    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    render(): TemplateResult_2<1>;
+}
+
 export declare class WidgetMatric extends LitElement implements Widget, ThemeValue {
     static registeredName: string;
     theme?: Theme;
@@ -2503,578 +2756,3 @@ export declare class WidgetUserDetail extends LitElement implements Widget, Them
 }
 
 export { }
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-i18n-provider": I18nProvider;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-theme-provider": ThemeProvider;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-badge": Badge;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-alert": Alert;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-avatar": Avatar;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-toast-provider": ToastProvider;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-card-select": CardSelect;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-card-group": CardGroup;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-checkbox": Checkbox;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-button": Button;
-    }
-}
-
-
-declare global {
-    interface HTMLElementContainerNameMap {
-        "ssk-code-block": CodeBlock;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-divider": Divider;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-i18n-template": Template;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-i18n-translate": Translate;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-heading": Heading;
-    }
-}
-
-
-declare global {
-    interface HTMLElementContainerNameMap {
-        "ssk-container": Container;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-date-display": DateDisplay;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-image": Image;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-input-tag": Inputtag;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-input-addon": InputAddon;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-logo": Logo;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-menu-group": MenuGroup;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-menu-items": MenuItems;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-spinner": Spinner;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-pin-code": PinCode;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-radio": Radio;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-text": Text;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-radio-group": RadioGroup;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-textarea": Textarea;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-toggle": Toggle;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-tag": Tag;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-top-navbar": TopNavbar;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-example': WidgetExample;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-matric': WidgetMatric;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-user-detail': WidgetUserDetail;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-title': WidgetTitle;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-table': WidgetTable;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-addon-phone-country": AddonPhoneCountry;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-calendar": Calendar;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-expandable-card": ExpandableCard;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-download-file": DownloadFile;
-    }
-}
-
-
-declare global {
-    interface HTMLElementModalNameMap {
-        "ssk-modal": Modal;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-misc-icon": MiscIcon;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-pagination": Pagination;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-progress-bar": ProgressBar;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-stepper": Stepper;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-skeleton": Skeleton;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-table": Table;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-tabs": Tabs;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-time": Time;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-timeline": Timeline;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-tooltip": Tooltip;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        'ssk-widget-grid': Grid;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-wave-icon": WaveIcon;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-card": Card;
-    }
-}
-
-
-declare global {
-    interface HTMLElementToastNameMap {
-        "ssk-toast": Toast;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-input": Input;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-accordion": Accordion;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-input-range": InputRange;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-country-icon": CountryIcon;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-tab-button": TabButton;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-accordion-item": AccordionItem;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-tab-header": TabHeader;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-table-cell": TableCell;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-header-cell": HeaderCell;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-icon": Icon;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-dynamic-table": DynamicTable;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-table-row": TableRow;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-date-picker": DatePicker;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-range-date-picker": RangeDatePicker;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-drawer": Drawer;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-drawer-header": DrawerHeader;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-dropdown-button": DropdownButton;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-dropdown": Dropdown;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-dropdown-option": DropdownOption;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-dropdown-preview": DropdownPreview;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-sidebar-group": SidebarGroup;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-sidebar-item": SidebarItems;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-sidebar-header": SidebarHeader;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-sidebar-list": SidebarList;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-sidebar": Sidebar;
-    }
-}
-
-
-declare global {
-    interface HTMLElementTagNameMap {
-        "ssk-cell": Cell;
-    }
-}
-