@yokowasis/types-webcomponents 1.0.1 → 1.0.2

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2026 yokowasis
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2026 yokowasis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,59 +1,59 @@
-# @yokowasis/types-webcomponents
-
-TypeScript type definitions for the custom elements in the yokowasis webcomponents project.
-
-## Install
-
-```bash
-npm install -D @yokowasis/types-webcomponents
-```
-
-or
-
-```bash
-pnpm add -D @yokowasis/types-webcomponents
-```
-
-## What it provides
-
-- `HTMLElementTagNameMap` entries for custom elements like `cs-dashboard`, `cs-data-table`, `cs-input`, and more.
-- JSX intrinsic element typing.
-- Svelte `svelteHTML.IntrinsicElements` typing.
-- Global helper typings for `toast`, `getVal`, and `setVal`.
-
-## Usage
-
-No runtime import is required. Ensure your `tsconfig.json` includes the package types (usually automatic under `node_modules`).
-
-## Use In IDE (VS Code)
-
-1. Install the package:
-
-```bash
-npm install -D @yokowasis/types-webcomponents
-```
-
-2. Make sure TypeScript loads the package types.
-
-Usually it works automatically. If not, add this to your `tsconfig.json`:
-
-```json
-{
-  "compilerOptions": {
-    "types": ["@yokowasis/types-webcomponents"]
-  }
-}
-```
-
-3. Restart TypeScript Server in VS Code:
-
-- Open Command Palette
-- Run: `TypeScript: Restart TS Server`
-
-4. If autocomplete is still missing, add a local declaration bridge (for example `src/app.d.ts`):
-
-```ts
-/// <reference types="@yokowasis/types-webcomponents" />
-```
-
-Then reload VS Code window.
+# @yokowasis/types-webcomponents
+
+TypeScript type definitions for the custom elements in the yokowasis webcomponents project.
+
+## Install
+
+```bash
+npm install -D @yokowasis/types-webcomponents
+```
+
+or
+
+```bash
+pnpm add -D @yokowasis/types-webcomponents
+```
+
+## What it provides
+
+- `HTMLElementTagNameMap` entries for custom elements like `cs-dashboard`, `cs-data-table`, `cs-input`, and more.
+- JSX intrinsic element typing.
+- Svelte `svelteHTML.IntrinsicElements` typing.
+- Global helper typings for `toast`, `getVal`, and `setVal`.
+
+## Usage
+
+No runtime import is required. Ensure your `tsconfig.json` includes the package types (usually automatic under `node_modules`).
+
+## Use In IDE (VS Code)
+
+1. Install the package:
+
+```bash
+npm install -D @yokowasis/types-webcomponents
+```
+
+2. Make sure TypeScript loads the package types.
+
+Usually it works automatically. If not, add this to your `tsconfig.json`:
+
+```json
+{
+  "compilerOptions": {
+    "types": ["@yokowasis/types-webcomponents"]
+  }
+}
+```
+
+3. Restart TypeScript Server in VS Code:
+
+- Open Command Palette
+- Run: `TypeScript: Restart TS Server`
+
+4. If autocomplete is still missing, add a local declaration bridge (for example `src/app.d.ts`):
+
+```ts
+/// <reference types="@yokowasis/types-webcomponents" />
+```
+
+Then reload VS Code window.

package/index.d.ts

@@ -1,488 +1,488 @@
-type CSIcons =
-  | "add"
-  | "apps"
-  | "calendar"
-  | "cancel"
-  | "check"
-  | "chevron_left"
-  | "chevron_right"
-  | "cloud"
-  | "dashboard"
-  | "delete"
-  | "document"
-  | "dropdown"
-  | "edit"
-  | "error"
-  | "excel"
-  | "home"
-  | "info"
-  | "invoice"
-  | "key"
-  | "list"
-  | "mail"
-  | "maintenance"
-  | "pdf"
-  | "reload"
-  | "send"
-  | "server"
-  | "signin"
-  | "signout"
-  | "signup"
-  | "upload"
-  | "user"
-  | "warning"
-  | "word";
-
-type ToastPosition = "top-right" | "top-left" | "bottom-right" | "bottom-left";
-type ToastType =
-  | "primary"
-  | "secondary"
-  | "success"
-  | "danger"
-  | "info"
-  | "warning";
-type DataTableFieldType =
-  | "text"
-  | "number"
-  | "password"
-  | "date"
-  | "time"
-  | "select"
-  | "radio"
-  | "checkbox"
-  | "upload"
-  | "rtf";
-
-interface DashboardNavChild {
-  title: string;
-  link: string;
-}
-
-interface DashboardNavItem {
-  title: string;
-  link?: string;
-  icon?: string;
-  active?: boolean;
-  childs?: DashboardNavChild[];
-}
-
-interface DashboardTopLink {
-  title: string;
-  icon?: string;
-  link?: string;
-}
-
-interface DataTableColumn {
-  key: string;
-  title: string;
-  type?: DataTableFieldType;
-  data?: string | string[];
-  dataValue?: string | string[];
-  renderer?: (
-    value: unknown,
-    row: Record<string, unknown>,
-    rowIndex: number,
-    column: DataTableColumn,
-  ) => string;
-  readonly?: boolean;
-  placeholder?: string;
-  note?: string;
-}
-
-interface CSDashboardElement extends HTMLElement {
-  logo: string;
-  title: string;
-  subtitle: string;
-  sidebar: Record<string, DashboardNavItem[]>;
-  breadcrumb: string[];
-  links: DashboardTopLink[];
-  activePath: string;
-}
-
-interface CSInputElement extends HTMLElement {
-  value: string;
-  label?: string;
-  icon?: CSIcons;
-  type?: "text" | "number" | "password" | "date" | "time";
-  note?: string;
-  mode?: string;
-  readonly?: string | boolean;
-  placeholder?: string;
-  theme?: "mui" | "tailwind" | string;
-  onchange?: (event: Event) => void;
-}
-
-interface CSSelectElement extends HTMLElement {
-  value?: string;
-  data?: string;
-  dataValue?: string;
-  label?: string;
-  placeholder?: string;
-  onchange?: (event: CustomEvent<{ target: { value: string } }>) => void;
-}
-
-interface CSRadioElement extends HTMLElement {
-  type: "radio" | "checkbox";
-  value?: string;
-  label?: string;
-  data?: string;
-  dataValue?: string;
-  cols?: number | string;
-  note?: string;
-  style?: string;
-  onchange?: (event: CustomEvent<{ target: HTMLInputElement }>) => void;
-}
-
-interface CSUploadElement extends HTMLElement {
-  value?: string;
-  label?: string;
-  note?: string;
-  mode?: string;
-  limit?: number | string;
-  server?: string;
-  onchange?: (event: Event | CustomEvent<{ target: HTMLInputElement }>) => void;
-  uploadBlob(blob: Blob, filename: string, server: string): Promise<string>;
-  fetchFileSize(url: string): Promise<void>;
-  formatFileSize(bytes: number): string;
-}
-
-interface CSRTFElement extends HTMLElement {
-  value?: string;
-  rows?: number | string;
-  label?: string;
-  placeholder?: string;
-  note?: string;
-  toolbar?: string;
-  server?: string;
-  mode?: string;
-  editorReady: boolean;
-  onchange?: (event: CustomEvent<{ target: unknown }>) => void;
-  uploadBlob(blob: Blob, filename: string, server: string): Promise<string>;
-  remove(): void;
-}
-
-interface CSModalElement extends HTMLElement {
-  open?: boolean;
-  title?: string;
-  width?: string;
-  confirmText?: string;
-  confirm?: () => void;
-  close?: () => void;
-  show(): void;
-  hide(): void;
-}
-
-interface CSDataTableElement extends HTMLElement {
-  columns: DataTableColumn[];
-  data: Array<Record<string, unknown>>;
-  onAdd?: (payload: Record<string, unknown>) => unknown;
-  onEdit?: (
-    payload: Record<string, unknown>,
-    row: Record<string, unknown>,
-    rowIndex: number,
-  ) => unknown;
-  onDelete?: (row: Record<string, unknown>, rowIndex: number) => unknown;
-}
-
-interface CSSortableElement extends HTMLElement {
-  deleteable?: "" | "true" | "false";
-  insertable?: "" | "true" | "false";
-  readonly items: Element[];
-}
-
-interface CSToastElement extends HTMLElement {
-  showToast(
-    message: string,
-    type?: ToastType,
-    position?: ToastPosition,
-    durationMs?: number,
-  ): void;
-  showLoadingToast(
-    message?: string,
-    position?: ToastPosition,
-  ): HTMLElement | null;
-  removeToast(toastEl?: HTMLElement | null): void;
-  getToastContainer(position: ToastPosition): HTMLElement | null;
-}
-
-interface CSSidebarElement extends HTMLElement {
-  title?: string;
-  description?: string;
-  links?: string;
-  urls?: string;
-  logo?: string;
-  show?: string;
-}
-
-interface CSInfoCardElement extends HTMLElement {
-  title?: string;
-  value?: string;
-  unit?: string;
-  link?: string;
-  background?: string;
-}
-
-interface CSIconElement extends HTMLElement {
-  c?: CSIcons;
-  icon?: CSIcons;
-  color?: string;
-  invert?: "" | "true" | "false";
-}
-
-interface CSListIconElement extends HTMLElement {}
-
-type CSIntrinsicElements = {
-  "cs-dashboard": Partial<CSDashboardElement> & {
-    id: string;
-    logo?: string;
-    title?: string;
-    subtitle?: string;
-    breadcrumb?: string;
-    sidebar?: Record<string, DashboardNavItem[]>;
-    links?: DashboardTopLink[];
-    activePath?: string;
-    onbreadcrumbclick?: (
-      event: CustomEvent<{ index: number; item: string }>,
-    ) => void;
-  };
-  "cs-input": Partial<CSInputElement> & {
-    id: string;
-    value?: string;
-    label?: string;
-    icon?: CSIcons;
-    type?: "text" | "number" | "password" | "date" | "time";
-    note?: string;
-    mode?: "dark" | string;
-    readonly?: "readonly" | "true" | "false" | boolean;
-    placeholder?: string;
-    theme?: "mui" | "tailwind" | string;
-    onchange?: (event: Event) => void;
-  };
-  "cs-select": Partial<CSSelectElement> & {
-    id: string;
-    value?: string;
-    label?: string;
-    data?: string | string[];
-    dataValue?: string | string[];
-    "data-value"?: string;
-    datavalue?: string;
-    placeholder?: string;
-    onchange?: (event: CustomEvent<{ target: { value: string } }>) => void;
-  };
-  "cs-radio": Partial<CSRadioElement> & {
-    id: string;
-    type: "radio" | "checkbox";
-    value?: string;
-    label?: string;
-    data?: string | string[];
-    dataValue?: string | string[];
-    "data-value"?: string;
-    datavalue?: string;
-    cols?: number | string;
-    note?: string;
-    style?: string;
-    onchange?: (event: CustomEvent<{ target: HTMLInputElement }>) => void;
-  };
-  "cs-upload": Partial<CSUploadElement> & {
-    id: string;
-    value?: string;
-    label?: string;
-    note?: string;
-    mode?: "dark" | string;
-    limit?: number | string;
-    server?: string;
-    onchange?: (
-      event: Event | CustomEvent<{ target: HTMLInputElement }>,
-    ) => void;
-  };
-  "cs-rtf": Partial<CSRTFElement> & {
-    id?: string;
-    value?: string;
-    rows?: number | string;
-    label?: string;
-    placeholder?: string;
-    note?: string;
-    toolbar?: string;
-    server?: string;
-    mode?: "dark" | string;
-    onchange?: (event: CustomEvent<{ target: unknown }>) => void;
-    onready?: (event: CustomEvent<{ editor: unknown; id: string }>) => void;
-  };
-  "cs-modal": Partial<CSModalElement> & {
-    id?: string;
-    open?: boolean | "" | "true" | "false";
-    title?: string;
-    width?: string;
-    "confirm-text"?: string;
-    onconfirm?: (event: CustomEvent<{ target: CSModalElement }>) => void;
-    onclose?: (event: CustomEvent) => void;
-    children?: unknown;
-  };
-  "cs-data-table": Partial<CSDataTableElement> & {
-    id?: string;
-    title?: string;
-    columns?: DataTableColumn[] | string;
-    data?: Array<Record<string, unknown>> | string;
-    "page-size"?: number | string;
-    "page-size-options"?: string;
-    download?: boolean | "" | "true" | "false";
-    import?: boolean | "" | "true" | "false";
-    onadd?: (event: CustomEvent<{ payload: Record<string, unknown> }>) => void;
-    onedit?: (
-      event: CustomEvent<{
-        payload: Record<string, unknown>;
-        row: Record<string, unknown>;
-        rowIndex: number;
-      }>,
-    ) => void;
-    ondelete?: (
-      event: CustomEvent<{ row: Record<string, unknown>; rowIndex: number }>,
-    ) => void;
-    onimport?: (
-      event: CustomEvent<{ successCount: number; skippedCount: number }>,
-    ) => void;
-    "ondelete-checked"?: (
-      event: CustomEvent<{
-        deleted: Array<{ row: Record<string, unknown>; rowIndex: number }>;
-      }>,
-    ) => void;
-  };
-  "cs-sortable": Partial<CSSortableElement> & {
-    id?: string;
-    deleteable?: boolean | "" | "true" | "false";
-    insertable?: boolean | "" | "true" | "false";
-    "oncs-insert"?: (event: CustomEvent<{}>) => void;
-    "oncs-delete"?: (
-      event: CustomEvent<{ index: number; item: Element | null }>,
-    ) => void;
-    "oncs-reorder"?: (
-      event: CustomEvent<{ from: number; to: number; items: Element[] }>,
-    ) => void;
-  };
-  "cs-toast": Partial<CSToastElement> & {
-    id?: string;
-  };
-  "cs-sidebar": Partial<CSSidebarElement> & {
-    id: string;
-    title?: string;
-    description?: string;
-    links?: string | string[];
-    urls?: string | string[];
-    logo?: string;
-    show?: string;
-  };
-  "cs-infocard": Partial<CSInfoCardElement> & {
-    id?: string;
-    title?: string;
-    "btn-title"?: string;
-    value?: string;
-    unit?: string;
-    link?: string;
-    background?: string;
-  };
-  "i-c": Partial<CSIconElement> & {
-    id?: string;
-    c?: CSIcons;
-    icon?: CSIcons;
-    color?: string;
-    invert?: boolean | "" | "true" | "false";
-  };
-  "list-icon": Partial<CSListIconElement>;
-};
-
-declare module "solid-js" {
-  namespace JSX {
-    interface IntrinsicElements extends CSIntrinsicElements {}
-  }
-}
-
-declare module "react" {
-  namespace JSX {
-    interface IntrinsicElements extends CSIntrinsicElements {}
-  }
-}
-
-declare global {
-  const toast: {
-    push: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    error: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    info: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    success: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    warn: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    warning: (
-      message: string,
-      duration?: number,
-      position?: ToastPosition,
-    ) => void;
-    loading: (message: string, position?: ToastPosition) => HTMLElement | null;
-    hide: (toastEl?: HTMLElement | null) => void;
-    dismiss: (toastEl?: HTMLElement | null) => void;
-  };
-
-  const setVal: (id: string, value: string) => void;
-  const getVal: (id: string) => string;
-
-  interface Window {
-    showToast: (
-      message: string,
-      type?: ToastType,
-      position?: ToastPosition,
-      durationMs?: number,
-    ) => void;
-    showLoadingToast: (
-      message?: string,
-      position?: ToastPosition,
-    ) => HTMLElement | null;
-    removeToast: (toastEl?: HTMLElement | null) => void;
-    toast: typeof toast;
-    getVal: (id: string) => string;
-    setVal: (id: string, value: string) => void;
-  }
-
-  interface HTMLElementTagNameMap {
-    "cs-dashboard": CSDashboardElement;
-    "cs-input": CSInputElement;
-    "cs-select": CSSelectElement;
-    "cs-radio": CSRadioElement;
-    "cs-upload": CSUploadElement;
-    "cs-rtf": CSRTFElement;
-    "cs-modal": CSModalElement;
-    "cs-data-table": CSDataTableElement;
-    "cs-sortable": CSSortableElement;
-    "cs-toast": CSToastElement;
-    "cs-sidebar": CSSidebarElement;
-    "cs-infocard": CSInfoCardElement;
-    "i-c": CSIconElement;
-    "list-icon": CSListIconElement;
-  }
-
-  namespace svelteHTML {
-    interface IntrinsicElements extends CSIntrinsicElements {}
-  }
-
-  namespace JSX {
-    interface IntrinsicElements extends CSIntrinsicElements {}
-  }
-}
-
-export {};
+type CSIcons =
+  | "add"
+  | "apps"
+  | "calendar"
+  | "cancel"
+  | "check"
+  | "chevron_left"
+  | "chevron_right"
+  | "cloud"
+  | "dashboard"
+  | "delete"
+  | "document"
+  | "dropdown"
+  | "edit"
+  | "error"
+  | "excel"
+  | "home"
+  | "info"
+  | "invoice"
+  | "key"
+  | "list"
+  | "mail"
+  | "maintenance"
+  | "pdf"
+  | "reload"
+  | "send"
+  | "server"
+  | "signin"
+  | "signout"
+  | "signup"
+  | "upload"
+  | "user"
+  | "warning"
+  | "word";
+
+type ToastPosition = "top-right" | "top-left" | "bottom-right" | "bottom-left";
+type ToastType =
+  | "primary"
+  | "secondary"
+  | "success"
+  | "danger"
+  | "info"
+  | "warning";
+type DataTableFieldType =
+  | "text"
+  | "number"
+  | "password"
+  | "date"
+  | "time"
+  | "select"
+  | "radio"
+  | "checkbox"
+  | "upload"
+  | "rtf";
+
+interface DashboardNavChild {
+  title: string;
+  link: string;
+}
+
+interface DashboardNavItem {
+  title: string;
+  link?: string;
+  icon?: string;
+  active?: boolean;
+  childs?: DashboardNavChild[];
+}
+
+interface DashboardTopLink {
+  title: string;
+  icon?: string;
+  link?: string;
+}
+
+interface DataTableColumn {
+  key: string;
+  title: string;
+  type?: DataTableFieldType;
+  data?: string | string[];
+  dataValue?: string | string[];
+  renderer?: (
+    value: unknown,
+    row: Record<string, unknown>,
+    rowIndex: number,
+    column: DataTableColumn,
+  ) => string;
+  readonly?: boolean;
+  placeholder?: string;
+  note?: string;
+}
+
+interface CSDashboardElement extends HTMLElement {
+  logo: string;
+  title: string;
+  subtitle: string;
+  sidebar: Record<string, DashboardNavItem[]>;
+  breadcrumb: string[];
+  links: DashboardTopLink[];
+  activePath: string;
+}
+
+interface CSInputElement extends HTMLElement {
+  value: string;
+  label?: string;
+  icon?: CSIcons;
+  type?: "text" | "number" | "password" | "date" | "time";
+  note?: string;
+  mode?: string;
+  readonly?: string | boolean;
+  placeholder?: string;
+  theme?: "mui" | "tailwind" | string;
+  onchange?: (event: Event) => void;
+}
+
+interface CSSelectElement extends HTMLElement {
+  value?: string;
+  data?: string;
+  dataValue?: string;
+  label?: string;
+  placeholder?: string;
+  onchange?: (event: CustomEvent<{ target: { value: string } }>) => void;
+}
+
+interface CSRadioElement extends HTMLElement {
+  type: "radio" | "checkbox";
+  value?: string;
+  label?: string;
+  data?: string;
+  dataValue?: string;
+  cols?: number | string;
+  note?: string;
+  style?: string;
+  onchange?: (event: CustomEvent<{ target: HTMLInputElement }>) => void;
+}
+
+interface CSUploadElement extends HTMLElement {
+  value?: string;
+  label?: string;
+  note?: string;
+  mode?: string;
+  limit?: number | string;
+  server?: string;
+  onchange?: (event: Event | CustomEvent<{ target: HTMLInputElement }>) => void;
+  uploadBlob(blob: Blob, filename: string, server: string): Promise<string>;
+  fetchFileSize(url: string): Promise<void>;
+  formatFileSize(bytes: number): string;
+}
+
+interface CSRTFElement extends HTMLElement {
+  value?: string;
+  rows?: number | string;
+  label?: string;
+  placeholder?: string;
+  note?: string;
+  toolbar?: string;
+  server?: string;
+  mode?: string;
+  editorReady: boolean;
+  onchange?: (event: CustomEvent<{ target: unknown }>) => void;
+  uploadBlob(blob: Blob, filename: string, server: string): Promise<string>;
+  remove(): void;
+}
+
+interface CSModalElement extends HTMLElement {
+  open?: boolean;
+  title?: string;
+  width?: string;
+  confirmText?: string;
+  confirm?: () => void;
+  close?: () => void;
+  show(): void;
+  hide(): void;
+}
+
+interface CSDataTableElement extends HTMLElement {
+  columns: DataTableColumn[];
+  data: Array<Record<string, unknown>>;
+  onAdd?: (payload: Record<string, unknown>) => unknown;
+  onEdit?: (
+    payload: Record<string, unknown>,
+    row: Record<string, unknown>,
+    rowIndex: number,
+  ) => unknown;
+  onDelete?: (row: Record<string, unknown>, rowIndex: number) => unknown;
+}
+
+interface CSSortableElement extends HTMLElement {
+  deleteable?: "" | "true" | "false";
+  insertable?: "" | "true" | "false";
+  readonly items: Element[];
+}
+
+interface CSToastElement extends HTMLElement {
+  showToast(
+    message: string,
+    type?: ToastType,
+    position?: ToastPosition,
+    durationMs?: number,
+  ): void;
+  showLoadingToast(
+    message?: string,
+    position?: ToastPosition,
+  ): HTMLElement | null;
+  removeToast(toastEl?: HTMLElement | null): void;
+  getToastContainer(position: ToastPosition): HTMLElement | null;
+}
+
+interface CSSidebarElement extends HTMLElement {
+  title?: string;
+  description?: string;
+  links?: string;
+  urls?: string;
+  logo?: string;
+  show?: string;
+}
+
+interface CSInfoCardElement extends HTMLElement {
+  title?: string;
+  value?: string;
+  unit?: string;
+  link?: string;
+  background?: string;
+}
+
+interface CSIconElement extends HTMLElement {
+  c?: CSIcons;
+  icon?: CSIcons;
+  color?: string;
+  invert?: "" | "true" | "false";
+}
+
+interface CSListIconElement extends HTMLElement {}
+
+type CSIntrinsicElements = {
+  "cs-dashboard": Partial<CSDashboardElement> & {
+    id: string;
+    logo?: string;
+    title?: string;
+    subtitle?: string;
+    breadcrumb?: string;
+    sidebar?: Record<string, DashboardNavItem[]>;
+    links?: DashboardTopLink[];
+    activePath?: string;
+    onbreadcrumbclick?: (
+      event: CustomEvent<{ index: number; item: string }>,
+    ) => void;
+  };
+  "cs-input": Partial<CSInputElement> & {
+    id: string;
+    value?: string;
+    label?: string;
+    icon?: CSIcons;
+    type?: "text" | "number" | "password" | "date" | "time";
+    note?: string;
+    mode?: "dark" | string;
+    readonly?: "readonly" | "true" | "false" | boolean;
+    placeholder?: string;
+    theme?: "mui" | "tailwind" | string;
+    onchange?: (event: Event) => void;
+  };
+  "cs-select": Partial<CSSelectElement> & {
+    id: string;
+    value?: string;
+    label?: string;
+    data?: string | string[];
+    dataValue?: string | string[];
+    "data-value"?: string;
+    datavalue?: string;
+    placeholder?: string;
+    onchange?: (event: CustomEvent<{ target: { value: string } }>) => void;
+  };
+  "cs-radio": Partial<CSRadioElement> & {
+    id: string;
+    type: "radio" | "checkbox";
+    value?: string;
+    label?: string;
+    data?: string | string[];
+    dataValue?: string | string[];
+    "data-value"?: string;
+    datavalue?: string;
+    cols?: number | string;
+    note?: string;
+    style?: string;
+    onchange?: (event: CustomEvent<{ target: HTMLInputElement }>) => void;
+  };
+  "cs-upload": Partial<CSUploadElement> & {
+    id: string;
+    value?: string;
+    label?: string;
+    note?: string;
+    mode?: "dark" | string;
+    limit?: number | string;
+    server?: string;
+    onchange?: (
+      event: Event | CustomEvent<{ target: HTMLInputElement }>,
+    ) => void;
+  };
+  "cs-rtf": Partial<CSRTFElement> & {
+    id?: string;
+    value?: string;
+    rows?: number | string;
+    label?: string;
+    placeholder?: string;
+    note?: string;
+    toolbar?: string;
+    server?: string;
+    mode?: "dark" | string;
+    onchange?: (event: CustomEvent<{ target: unknown }>) => void;
+    onready?: (event: CustomEvent<{ editor: unknown; id: string }>) => void;
+  };
+  "cs-modal": Partial<CSModalElement> & {
+    id?: string;
+    open?: boolean | "" | "true" | "false";
+    title?: string;
+    width?: string;
+    "confirm-text"?: string;
+    onconfirm?: (event: CustomEvent<{ target: CSModalElement }>) => void;
+    onclose?: (event: CustomEvent) => void;
+    children?: unknown;
+  };
+  "cs-data-table": Partial<CSDataTableElement> & {
+    id?: string;
+    title?: string;
+    columns?: DataTableColumn[] | string;
+    data?: Array<Record<string, unknown>> | string;
+    "page-size"?: number | string;
+    "page-size-options"?: string;
+    download?: boolean | "" | "true" | "false";
+    import?: boolean | "" | "true" | "false";
+    onadd?: (event: CustomEvent<{ payload: Record<string, unknown> }>) => void;
+    onedit?: (
+      event: CustomEvent<{
+        payload: Record<string, unknown>;
+        row: Record<string, unknown>;
+        rowIndex: number;
+      }>,
+    ) => void;
+    ondelete?: (
+      event: CustomEvent<{ row: Record<string, unknown>; rowIndex: number }>,
+    ) => void;
+    onimport?: (
+      event: CustomEvent<{ successCount: number; skippedCount: number }>,
+    ) => void;
+    "ondelete-checked"?: (
+      event: CustomEvent<{
+        deleted: Array<{ row: Record<string, unknown>; rowIndex: number }>;
+      }>,
+    ) => void;
+  };
+  "cs-sortable": Partial<CSSortableElement> & {
+    id?: string;
+    deleteable?: boolean | "" | "true" | "false";
+    insertable?: boolean | "" | "true" | "false";
+    "oncs-insert"?: (event: CustomEvent<{}>) => void;
+    "oncs-delete"?: (
+      event: CustomEvent<{ index: number; item: Element | null }>,
+    ) => void;
+    "oncs-reorder"?: (
+      event: CustomEvent<{ from: number; to: number; items: Element[] }>,
+    ) => void;
+  };
+  "cs-toast": Partial<CSToastElement> & {
+    id?: string;
+  };
+  "cs-sidebar": Partial<CSSidebarElement> & {
+    id: string;
+    title?: string;
+    description?: string;
+    links?: string | string[];
+    urls?: string | string[];
+    logo?: string;
+    show?: string;
+  };
+  "cs-infocard": Partial<CSInfoCardElement> & {
+    id?: string;
+    title?: string;
+    "btn-title"?: string;
+    value?: string;
+    unit?: string;
+    link?: string;
+    background?: string;
+  };
+  "i-c": Partial<CSIconElement> & {
+    id?: string;
+    c?: CSIcons;
+    icon?: CSIcons;
+    color?: string;
+    invert?: boolean | "" | "true" | "false";
+  };
+  "list-icon": Partial<CSListIconElement>;
+};
+
+declare module "solid-js" {
+  namespace JSX {
+    interface IntrinsicElements extends CSIntrinsicElements {}
+  }
+}
+
+declare module "react" {
+  namespace JSX {
+    interface IntrinsicElements extends CSIntrinsicElements {}
+  }
+}
+
+declare global {
+  const toast: {
+    push: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    error: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    info: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    success: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    warn: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    warning: (
+      message: string,
+      duration?: number,
+      position?: ToastPosition,
+    ) => void;
+    loading: (message: string, position?: ToastPosition) => HTMLElement | null;
+    hide: (toastEl?: HTMLElement | null) => void;
+    dismiss: (toastEl?: HTMLElement | null) => void;
+  };
+
+  const setVal: (id: string, value: string) => void;
+  const getVal: (id: string) => string;
+
+  interface Window {
+    showToast: (
+      message: string,
+      type?: ToastType,
+      position?: ToastPosition,
+      durationMs?: number,
+    ) => void;
+    showLoadingToast: (
+      message?: string,
+      position?: ToastPosition,
+    ) => HTMLElement | null;
+    removeToast: (toastEl?: HTMLElement | null) => void;
+    toast: typeof toast;
+    getVal: (id: string) => string;
+    setVal: (id: string, value: string) => void;
+  }
+
+  interface HTMLElementTagNameMap {
+    "cs-dashboard": CSDashboardElement;
+    "cs-input": CSInputElement;
+    "cs-select": CSSelectElement;
+    "cs-radio": CSRadioElement;
+    "cs-upload": CSUploadElement;
+    "cs-rtf": CSRTFElement;
+    "cs-modal": CSModalElement;
+    "cs-data-table": CSDataTableElement;
+    "cs-sortable": CSSortableElement;
+    "cs-toast": CSToastElement;
+    "cs-sidebar": CSSidebarElement;
+    "cs-infocard": CSInfoCardElement;
+    "i-c": CSIconElement;
+    "list-icon": CSListIconElement;
+  }
+
+  namespace svelteHTML {
+    interface IntrinsicElements extends CSIntrinsicElements {}
+  }
+
+  namespace JSX {
+    interface IntrinsicElements extends CSIntrinsicElements {}
+  }
+}
+
+export {};

package/package.json

@@ -1,24 +1,24 @@
-{
-  "name": "@yokowasis/types-webcomponents",
-  "version": "1.0.1",
-  "description": "Type definitions for yokowasis webcomponents custom elements",
-  "types": "index.d.ts",
-  "files": [
-    "index.d.ts",
-    "README.md"
-  ],
-  "keywords": [
-    "types",
-    "typescript",
-    "webcomponents",
-    "custom-elements",
-    "svelte",
-    "react",
-    "solid-js"
-  ],
-  "license": "MIT",
-  "author": "yokowasis",
-  "publishConfig": {
-    "access": "public"
-  }
-}
+{
+  "name": "@yokowasis/types-webcomponents",
+  "version": "1.0.2",
+  "description": "Type definitions for yokowasis webcomponents custom elements",
+  "types": "index.d.ts",
+  "files": [
+    "index.d.ts",
+    "README.md"
+  ],
+  "keywords": [
+    "types",
+    "typescript",
+    "webcomponents",
+    "custom-elements",
+    "svelte",
+    "react",
+    "solid-js"
+  ],
+  "license": "MIT",
+  "author": "yokowasis",
+  "publishConfig": {
+    "access": "public"
+  }
+}