@nuralyui/table 0.0.1

package/components/table-content.style.js

@@ -0,0 +1,77 @@
+import { css } from 'lit';
+import { styleVariables } from './table-content.variables.js';
+const tableContentStyle = css `
+  :host {
+    display: block;
+    overflow: auto;
+  }
+
+  input[type='checkbox'][data-indeterminate='true']::after {
+    width: 13px;
+    height: 13px;
+    background-color: var(--hybrid-table-input-color);
+    color: var(--hybrid-table-checkbox-some-checked-sign-color);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    content: '-';
+  }
+  table {
+    width: 100%;
+    border-spacing: 0px;
+    color: var(--hybrid-table-text-color);
+  }
+  td {
+    text-align: center;
+    border-bottom: var(--hybrid-table-column-border);
+  }
+  th {
+    cursor: pointer;
+  }
+  th span {
+    display: flex;
+    justify-content: center;
+    gap: 10px;
+  }
+  hy-icon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    --hybrid-icon-color: var(--hybrid-table-text-color);
+  }
+  tr {
+    background-color: var(--hybrid-table-row-background-color);
+  }
+  tr:hover {
+    background-color: var(--hybrid-table-row-hover-background-color);
+  }
+  tr:first-child {
+    background-color: var(--hybrid-table-header-background-color);
+  }
+
+  tr:has(:not(th) > input:checked) {
+    background-color: var(--hybrid-table-row-checked-background-color);
+  }
+
+  td,
+  th {
+    padding: 10px;
+  }
+  input,
+  .expand-icon {
+    cursor: pointer;
+    accent-color: var(--hybrid-table-input-color);
+  }
+
+  :host([size='small']) td,
+  :host([size='small']) th {
+    padding: 5px;
+  }
+
+  :host([size='large']) td,
+  :host([size='large']) th {
+    padding: 15px;
+  }
+`;
+export const styles = [tableContentStyle, styleVariables];
+//# sourceMappingURL=table-content.style.js.map

package/components/table-content.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-content.style.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-content.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,OAAO,EAAC,cAAc,EAAC,MAAM,8BAA8B,CAAC;AAE5D,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwE5B,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import {css} from 'lit';\nimport {styleVariables} from './table-content.variables.js';\n\nconst tableContentStyle = css`\n  :host {\n    display: block;\n    overflow: auto;\n  }\n\n  input[type='checkbox'][data-indeterminate='true']::after {\n    width: 13px;\n    height: 13px;\n    background-color: var(--hybrid-table-input-color);\n    color: var(--hybrid-table-checkbox-some-checked-sign-color);\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    content: '-';\n  }\n  table {\n    width: 100%;\n    border-spacing: 0px;\n    color: var(--hybrid-table-text-color);\n  }\n  td {\n    text-align: center;\n    border-bottom: var(--hybrid-table-column-border);\n  }\n  th {\n    cursor: pointer;\n  }\n  th span {\n    display: flex;\n    justify-content: center;\n    gap: 10px;\n  }\n  hy-icon {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    --hybrid-icon-color: var(--hybrid-table-text-color);\n  }\n  tr {\n    background-color: var(--hybrid-table-row-background-color);\n  }\n  tr:hover {\n    background-color: var(--hybrid-table-row-hover-background-color);\n  }\n  tr:first-child {\n    background-color: var(--hybrid-table-header-background-color);\n  }\n\n  tr:has(:not(th) > input:checked) {\n    background-color: var(--hybrid-table-row-checked-background-color);\n  }\n\n  td,\n  th {\n    padding: 10px;\n  }\n  input,\n  .expand-icon {\n    cursor: pointer;\n    accent-color: var(--hybrid-table-input-color);\n  }\n\n  :host([size='small']) td,\n  :host([size='small']) th {\n    padding: 5px;\n  }\n\n  :host([size='large']) td,\n  :host([size='large']) th {\n    padding: 15px;\n  }\n`;\n\nexport const styles = [tableContentStyle, styleVariables];\n"]}

package/components/table-content.variables.d.ts

@@ -0,0 +1,2 @@
+export declare const styleVariables: import("lit").CSSResult;
+//# sourceMappingURL=table-content.variables.d.ts.map

package/components/table-content.variables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-content.variables.d.ts","sourceRoot":"","sources":["../../../../src/components/table/components/table-content.variables.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBA0B1B,CAAC"}

package/components/table-content.variables.js

@@ -0,0 +1,29 @@
+import { css } from 'lit';
+export const styleVariables = css `
+  :host {
+    --hybrid-table-text-color: #161616;
+    --hybrid-table-input-color: #161616;
+    --hybrid-table-column-border: 1px solid #e0e0e0;
+    --hybrid-table-row-background-color: #f4f4f4;
+    --hybrid-table-row-checked-background-color: #e5e5e5;
+    --hybrid-table-row-hover-background-color: #d3d3d3;
+    --hybrid-table-header-background-color: #e0e0e0;
+    --hybrid-table-checkbox-some-checked-background-color: #161616;
+    --hybrid-table-checkbox-some-checked-sign-color: #ffffff;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    :host {
+      --hybrid-table-text-color: #f4f4f4;
+      --hybrid-table-input-color: #ffffff;
+      --hybrid-table-column-border: 1px solid #8d8d8d;
+      --hybrid-table-row-background-color: #393939;
+      --hybrid-table-header-background-color: #525252;
+      --hybrid-table-row-hover-background-color: #525252;
+      --hybrid-table-row-checked-background-color: #6f6f6f;
+      --hybrid-table-checkbox-some-checked-background-color: #ffffff;
+      --hybrid-table-checkbox-some-checked-sign-color: #161616;
+    }
+  }
+`;
+//# sourceMappingURL=table-content.variables.js.map

package/components/table-content.variables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-content.variables.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-content.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BhC,CAAC","sourcesContent":["import {css} from 'lit';\n\nexport const styleVariables = css`\n  :host {\n    --hybrid-table-text-color: #161616;\n    --hybrid-table-input-color: #161616;\n    --hybrid-table-column-border: 1px solid #e0e0e0;\n    --hybrid-table-row-background-color: #f4f4f4;\n    --hybrid-table-row-checked-background-color: #e5e5e5;\n    --hybrid-table-row-hover-background-color: #d3d3d3;\n    --hybrid-table-header-background-color: #e0e0e0;\n    --hybrid-table-checkbox-some-checked-background-color: #161616;\n    --hybrid-table-checkbox-some-checked-sign-color: #ffffff;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :host {\n      --hybrid-table-text-color: #f4f4f4;\n      --hybrid-table-input-color: #ffffff;\n      --hybrid-table-column-border: 1px solid #8d8d8d;\n      --hybrid-table-row-background-color: #393939;\n      --hybrid-table-header-background-color: #525252;\n      --hybrid-table-row-hover-background-color: #525252;\n      --hybrid-table-row-checked-background-color: #6f6f6f;\n      --hybrid-table-checkbox-some-checked-background-color: #ffffff;\n      --hybrid-table-checkbox-some-checked-sign-color: #161616;\n    }\n  }\n`;\n"]}

package/components/table-filter.style.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult[];
+//# sourceMappingURL=table-filter.style.d.ts.map

package/components/table-filter.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-filter.style.d.ts","sourceRoot":"","sources":["../../../../src/components/table/components/table-filter.style.ts"],"names":[],"mappings":"AAsCA,eAAO,MAAM,MAAM,2BAAsC,CAAC"}

package/components/table-filter.style.js

@@ -0,0 +1,39 @@
+import { css } from 'lit';
+import { styleVariables } from './table-filter.variables.js';
+const tableActionsStyle = css `
+  :host([showInput]) {
+    width: 100%;
+  }
+
+  .filter-container {
+    position: relative;
+    margin-bottom: 5px;
+  }
+  .filter-container input {
+    padding: 5px;
+    padding-left: 30px;
+    width: 100%;
+    box-sizing: border-box;
+    background-color: var(--hybrid-filter-input-background-color);
+    color: var(--hybrid-filter-input-text-color);
+  }
+  input:focus {
+    outline-style: none;
+    border: var(--hybrid-filter-focused-input-border);
+  }
+  .icon-container {
+    height: 25px;
+    width: 35px;
+    cursor: pointer;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .search-icon {
+    position: absolute;
+    left: 10px;
+    top: 25%;
+  }
+`;
+export const styles = [tableActionsStyle, styleVariables];
+//# sourceMappingURL=table-filter.style.js.map

package/components/table-filter.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-filter.style.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-filter.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,MAAM,iBAAiB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkC5B,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import {css} from 'lit';\nimport {styleVariables} from './table-filter.variables.js';\nconst tableActionsStyle = css`\n  :host([showInput]) {\n    width: 100%;\n  }\n\n  .filter-container {\n    position: relative;\n    margin-bottom: 5px;\n  }\n  .filter-container input {\n    padding: 5px;\n    padding-left: 30px;\n    width: 100%;\n    box-sizing: border-box;\n    background-color: var(--hybrid-filter-input-background-color);\n    color: var(--hybrid-filter-input-text-color);\n  }\n  input:focus {\n    outline-style: none;\n    border: var(--hybrid-filter-focused-input-border);\n  }\n  .icon-container {\n    height: 25px;\n    width: 35px;\n    cursor: pointer;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n  }\n  .search-icon {\n    position: absolute;\n    left: 10px;\n    top: 25%;\n  }\n`;\n\nexport const styles = [tableActionsStyle, styleVariables];\n"]}

package/components/table-filter.variables.d.ts

@@ -0,0 +1,2 @@
+export declare const styleVariables: import("lit").CSSResult;
+//# sourceMappingURL=table-filter.variables.d.ts.map

package/components/table-filter.variables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-filter.variables.d.ts","sourceRoot":"","sources":["../../../../src/components/table/components/table-filter.variables.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAc1B,CAAC"}

package/components/table-filter.variables.js

@@ -0,0 +1,17 @@
+import { css } from 'lit';
+export const styleVariables = css `
+  :host {
+    --hybrid-filter-input-background-color: #ffffff;
+    --hybrid-filter-input-text-color: #000000;
+    --hybrid-filter-focused-input-border: 1px solid #e0e0e0;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    :host {
+      --hybrid-filter-input-background-color: #393939;
+      --hybrid-filter-focused-input-border: 1px solid #393939;
+      --hybrid-filter-input-text-color: #c6c6c6;
+    }
+  }
+`;
+//# sourceMappingURL=table-filter.variables.js.map

package/components/table-filter.variables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-filter.variables.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-filter.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;CAchC,CAAC","sourcesContent":["import {css} from 'lit';\n\nexport const styleVariables = css`\n  :host {\n    --hybrid-filter-input-background-color: #ffffff;\n    --hybrid-filter-input-text-color: #000000;\n    --hybrid-filter-focused-input-border: 1px solid #e0e0e0;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :host {\n      --hybrid-filter-input-background-color: #393939;\n      --hybrid-filter-focused-input-border: 1px solid #393939;\n      --hybrid-filter-input-text-color: #c6c6c6;\n    }\n  }\n`;\n"]}

package/components/table-pagination.style.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult[];
+//# sourceMappingURL=table-pagination.style.d.ts.map

package/components/table-pagination.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-pagination.style.d.ts","sourceRoot":"","sources":["../../../../src/components/table/components/table-pagination.style.ts"],"names":[],"mappings":"AAsGA,eAAO,MAAM,MAAM,2BAAyC,CAAC"}

package/components/table-pagination.style.js

@@ -0,0 +1,102 @@
+import { css } from 'lit';
+import { styleVariables } from './table-pagination.variables.js';
+const tablePaginationStyle = css `
+  .pagination-container {
+    display: flex;
+    justify-content: space-between;
+    background-color: var(--hybrid-pagination-background-color);
+    color: var(--hybrid-pagination-text-color);
+  }
+
+  .left-content {
+    display: flex;
+    justify-content: space-between;
+  }
+  .left-content .items-details {
+    border-left: var(--hybrid-pagination-borders);
+    padding: 10px;
+  }
+  .right-arrow,
+  .left-arrow {
+    --hybrid-icon-color: var(--hybrid-pagination-text-color);
+  }
+
+  :host([size='small']) .left-content .items-details {
+    padding: 5px;
+  }
+
+  :host([size='large']) .left-content .items-details {
+    padding: 15px;
+  }
+
+  .left-content .select-details {
+    padding: 10px;
+  }
+
+  :host([size='small']) .left-content .select-details {
+    padding: 5px;
+  }
+
+  :host([size='large']) .left-content .select-details {
+    padding: 15px;
+  }
+
+  .right-content {
+    display: flex;
+    justify-content: space-between;
+    border-left: var(--hybrid-pagination-borders);
+  }
+  .right-content .icon-container {
+    display: flex;
+    justify-content: space-between;
+    border-left: var(--hybrid-pagination-borders);
+  }
+
+  .right-content .page-details {
+    padding: 10px;
+  }
+
+  :host([size='small']) .right-content .page-details {
+    padding: 5px;
+  }
+
+  :host([size='large']) .right-content .page-details {
+    padding: 15px;
+  }
+
+  .icon-container .left-arrow,
+  .icon-container .right-arrow {
+    padding: 10px;
+  }
+
+  :host([size='small']) .icon-container .left-arrow,
+  :host([size='small']) .icon-container .right-arrow {
+    padding: 5px;
+  }
+
+  :host([size='large']) .icon-container .left-arrow,
+  :host([size='large']) .icon-container .right-arrow {
+    padding: 15px;
+  }
+
+  .icon-container .left-arrow {
+    border-right: var(--hybrid-pagination-borders);
+  }
+
+  select {
+    border: none;
+    background-color: var(--hybrid-pagination-background-color);
+    cursor: pointer;
+    color: var(--hybrid-pagination-text-color);
+  }
+
+  hy-icon[data-enabled='false'] {
+    cursor: not-allowed;
+  }
+
+  hy-icon[data-enabled='true'] {
+    cursor: pointer;
+  }
+`;
+export const styles = [tablePaginationStyle, styleVariables];
+//# sourceMappingURL=table-pagination.style.js.map

package/components/table-pagination.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-pagination.style.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-pagination.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,OAAO,EAAC,cAAc,EAAC,MAAM,iCAAiC,CAAC;AAE/D,MAAM,oBAAoB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiG/B,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,oBAAoB,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import {css} from 'lit';\nimport {styleVariables} from './table-pagination.variables.js';\n\nconst tablePaginationStyle = css`\n  .pagination-container {\n    display: flex;\n    justify-content: space-between;\n    background-color: var(--hybrid-pagination-background-color);\n    color: var(--hybrid-pagination-text-color);\n  }\n\n  .left-content {\n    display: flex;\n    justify-content: space-between;\n  }\n  .left-content .items-details {\n    border-left: var(--hybrid-pagination-borders);\n    padding: 10px;\n  }\n  .right-arrow,\n  .left-arrow {\n    --hybrid-icon-color: var(--hybrid-pagination-text-color);\n  }\n\n  :host([size='small']) .left-content .items-details {\n    padding: 5px;\n  }\n\n  :host([size='large']) .left-content .items-details {\n    padding: 15px;\n  }\n\n  .left-content .select-details {\n    padding: 10px;\n  }\n\n  :host([size='small']) .left-content .select-details {\n    padding: 5px;\n  }\n\n  :host([size='large']) .left-content .select-details {\n    padding: 15px;\n  }\n\n  .right-content {\n    display: flex;\n    justify-content: space-between;\n    border-left: var(--hybrid-pagination-borders);\n  }\n  .right-content .icon-container {\n    display: flex;\n    justify-content: space-between;\n    border-left: var(--hybrid-pagination-borders);\n  }\n\n  .right-content .page-details {\n    padding: 10px;\n  }\n\n  :host([size='small']) .right-content .page-details {\n    padding: 5px;\n  }\n\n  :host([size='large']) .right-content .page-details {\n    padding: 15px;\n  }\n\n  .icon-container .left-arrow,\n  .icon-container .right-arrow {\n    padding: 10px;\n  }\n\n  :host([size='small']) .icon-container .left-arrow,\n  :host([size='small']) .icon-container .right-arrow {\n    padding: 5px;\n  }\n\n  :host([size='large']) .icon-container .left-arrow,\n  :host([size='large']) .icon-container .right-arrow {\n    padding: 15px;\n  }\n\n  .icon-container .left-arrow {\n    border-right: var(--hybrid-pagination-borders);\n  }\n\n  select {\n    border: none;\n    background-color: var(--hybrid-pagination-background-color);\n    cursor: pointer;\n    color: var(--hybrid-pagination-text-color);\n  }\n\n  hy-icon[data-enabled='false'] {\n    cursor: not-allowed;\n  }\n\n  hy-icon[data-enabled='true'] {\n    cursor: pointer;\n  }\n`;\n\nexport const styles = [tablePaginationStyle, styleVariables];\n"]}

package/components/table-pagination.variables.d.ts

@@ -0,0 +1,2 @@
+export declare const styleVariables: import("lit").CSSResult;
+//# sourceMappingURL=table-pagination.variables.d.ts.map

package/components/table-pagination.variables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-pagination.variables.d.ts","sourceRoot":"","sources":["../../../../src/components/table/components/table-pagination.variables.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,yBAc1B,CAAC"}

package/components/table-pagination.variables.js

@@ -0,0 +1,17 @@
+import { css } from 'lit';
+export const styleVariables = css `
+  :host {
+    --hybrid-pagination-background-color: #f4f4f4;
+    --hybrid-pagination-text-color: #161616;
+    --hybrid-pagination-borders: 1px solid #e0e0e0;
+  }
+
+  @media (prefers-color-scheme: dark) {
+    :host {
+      --hybrid-pagination-background-color: #393939;
+      --hybrid-pagination-text-color: #f4f4f4;
+      --hybrid-pagination-borders: 1px solid #8d8d8d;
+    }
+  }
+`;
+//# sourceMappingURL=table-pagination.variables.js.map

package/components/table-pagination.variables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-pagination.variables.js","sourceRoot":"","sources":["../../../../src/components/table/components/table-pagination.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;CAchC,CAAC","sourcesContent":["import {css} from 'lit';\n\nexport const styleVariables = css`\n  :host {\n    --hybrid-pagination-background-color: #f4f4f4;\n    --hybrid-pagination-text-color: #161616;\n    --hybrid-pagination-borders: 1px solid #e0e0e0;\n  }\n\n  @media (prefers-color-scheme: dark) {\n    :host {\n      --hybrid-pagination-background-color: #393939;\n      --hybrid-pagination-text-color: #f4f4f4;\n      --hybrid-pagination-borders: 1px solid #8d8d8d;\n    }\n  }\n`;\n"]}

package/demo/table-demo.d.ts

@@ -0,0 +1,17 @@
+import { LitElement } from 'lit';
+export declare class TableDemo extends LitElement {
+    headers: {
+        name: string;
+        key: string;
+    }[];
+    rows: {
+        id: number;
+        status: string;
+        priority: string;
+        title: string;
+        assignee: string;
+    }[];
+    static styles: import("lit").CSSResult[];
+    render(): import("lit").TemplateResult<1>;
+}
+//# sourceMappingURL=table-demo.d.ts.map

package/demo/table-demo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-demo.d.ts","sourceRoot":"","sources":["../../../../src/components/table/demo/table-demo.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAY,MAAM,KAAK,CAAC;AAG1C,qBAAa,SAAU,SAAQ,UAAU;IAEvC,OAAO;;;QAqBL;IAGF,IAAI;;;;;;QAyDF;IACF,OAAgB,MAAM,4BAOpB;IACO,MAAM;CAyDhB"}

package/demo/table-demo.js

@@ -0,0 +1,166 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { LitElement, css, html } from 'lit';
+import { state } from 'lit/decorators.js';
+export class TableDemo extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.headers = [
+            {
+                name: 'Id',
+                key: 'id',
+            },
+            {
+                name: 'Status',
+                key: 'status',
+            },
+            {
+                name: 'Priority',
+                key: 'priority',
+            },
+            {
+                name: 'Title',
+                key: 'title',
+            },
+            {
+                name: 'Assignee',
+                key: 'assignee',
+            },
+        ];
+        this.rows = [
+            {
+                id: 1,
+                status: 'Open',
+                priority: 'Normal',
+                title: 'Product Details Page - Variant Component (1)',
+                assignee: 'William Jones',
+            },
+            {
+                id: 2,
+                status: 'Open',
+                priority: 'High',
+                title: 'Product Details Page - Variant Component (2)',
+                assignee: 'Natalia Hayward',
+            },
+            {
+                id: 3,
+                status: 'Closed',
+                priority: 'Normal',
+                title: 'Product Details Page - Variant Component (3)',
+                assignee: 'Jess Plant',
+            },
+            {
+                id: 4,
+                status: 'Open',
+                priority: 'Normal',
+                title: 'Product Details Page - Variant Component (4)',
+                assignee: 'William Jones',
+            },
+            {
+                id: 5,
+                status: 'Open',
+                priority: 'Normal',
+                title: 'Product Details Page - Variant Component (5)',
+                assignee: 'Kathleen Knowles',
+            },
+            {
+                id: 6,
+                status: 'Open',
+                priority: 'High',
+                title: 'Product Details Page - Variant Component (6)',
+                assignee: 'Mel Young',
+            },
+            {
+                id: 7,
+                status: 'Closed',
+                priority: 'Normal',
+                title: 'Product Details Page - Variant Component (7)',
+                assignee: 'Zahid Allison',
+            },
+            {
+                id: 8,
+                status: 'Closed',
+                priority: 'High',
+                title: 'Product Details Page - Variant Component (8)',
+                assignee: 'William Jones',
+            },
+        ];
+    }
+    render() {
+        return html `
+      <h1>With selection</h1>
+      <h3>Multiple selection</h3>
+      <hy-table  
+      @onSelect=${(e) => {
+            console.log('selected', e.detail.value);
+        }} 
+      @onPaginate=${(e) => {
+            console.log('page ', e.detail.value);
+        }}
+      @onSort=${(e) => {
+            console.log('sorted ', e.detail.value);
+        }}
+      .headers="${this.headers}" .rows="${this.rows}" .selectionMode=${'multiple'}></hy-table>
+      <h3>Single selection</h3>
+      <hy-table .headers="${this.headers}" .rows="${this.rows}" .selectionMode=${'single'}></hy-table>
+      <h1>With Expandable attribute (title)</h1>
+      <hy-table .headers="${this.headers}" .rows="${this.rows}" .expandable=${'title'}></hy-table>
+      <h1>With filter: search</h1>
+      <hy-table .headers="${this.headers}" .rows="${this.rows}" .withFilter=${true}></hy-table>
+      <h3>filter + expandable attribute (priority)</h3>
+      <hy-table
+        .headers="${this.headers}"
+        .rows="${this.rows}"
+        .withFilter=${true}
+        .expandable=${'priority'}
+        @onSelect=${(e) => {
+            console.log('selected', e.detail.value);
+        }}
+        @onSearch=${(e) => {
+            console.log('searched ', e.detail.value);
+        }}
+        @onSort=${(e) => {
+            console.log('sorted ', e.detail.value);
+        }}
+      ></hy-table>
+
+      <h1>Sizes</h1>
+      <h3>Small size with selection</h3>
+      <hy-table
+        .headers="${this.headers}"
+        .rows="${this.rows}"
+        .size=${'small'}
+        .selectionMode=${'multiple'}
+      ></hy-table>
+      <h3>Large size</h3>
+      <hy-table .headers="${this.headers}" .rows="${this.rows}" .size=${'large'}></hy-table>
+      <h3>Large size with multiple selection</h3>
+      <hy-table
+        .headers="${this.headers}"
+        .rows="${this.rows}"
+        .size=${'large'}
+        .selectionMode=${'multiple'}
+      ></hy-table>
+    `;
+    }
+}
+TableDemo.styles = [
+    css `
+      :host {
+        display: block;
+        width: 90%;
+      }
+    `,
+];
+__decorate([
+    state()
+], TableDemo.prototype, "headers", void 0);
+__decorate([
+    state()
+], TableDemo.prototype, "rows", void 0);
+customElements.define('hy-table-demo', TableDemo);
+//# sourceMappingURL=table-demo.js.map

package/demo/table-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-demo.js","sourceRoot":"","sources":["../../../../src/components/table/demo/table-demo.ts"],"names":[],"mappings":"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","sourcesContent":["import {LitElement, css, html} from 'lit';\nimport {state} from 'lit/decorators.js';\n\nexport class TableDemo extends LitElement {\n  @state()\n  headers = [\n    {\n      name: 'Id',\n      key: 'id',\n    },\n    {\n      name: 'Status',\n      key: 'status',\n    },\n    {\n      name: 'Priority',\n      key: 'priority',\n    },\n    {\n      name: 'Title',\n      key: 'title',\n    },\n    {\n      name: 'Assignee',\n      key: 'assignee',\n    },\n  ];\n\n  @state()\n  rows = [\n    {\n      id: 1,\n      status: 'Open',\n      priority: 'Normal',\n      title: 'Product Details Page - Variant Component (1)',\n      assignee: 'William Jones',\n    },\n    {\n      id: 2,\n      status: 'Open',\n      priority: 'High',\n      title: 'Product Details Page - Variant Component (2)',\n      assignee: 'Natalia Hayward',\n    },\n    {\n      id: 3,\n      status: 'Closed',\n      priority: 'Normal',\n      title: 'Product Details Page - Variant Component (3)',\n      assignee: 'Jess Plant',\n    },\n    {\n      id: 4,\n      status: 'Open',\n      priority: 'Normal',\n      title: 'Product Details Page - Variant Component (4)',\n      assignee: 'William Jones',\n    },\n    {\n      id: 5,\n      status: 'Open',\n      priority: 'Normal',\n      title: 'Product Details Page - Variant Component (5)',\n      assignee: 'Kathleen Knowles',\n    },\n    {\n      id: 6,\n      status: 'Open',\n      priority: 'High',\n      title: 'Product Details Page - Variant Component (6)',\n      assignee: 'Mel Young',\n    },\n    {\n      id: 7,\n      status: 'Closed',\n      priority: 'Normal',\n      title: 'Product Details Page - Variant Component (7)',\n      assignee: 'Zahid Allison',\n    },\n    {\n      id: 8,\n      status: 'Closed',\n      priority: 'High',\n      title: 'Product Details Page - Variant Component (8)',\n      assignee: 'William Jones',\n    },\n  ];\n  static override styles = [\n    css`\n      :host {\n        display: block;\n        width: 90%;\n      }\n    `,\n  ];\n  override render() {\n    return html`\n      <h1>With selection</h1>\n      <h3>Multiple selection</h3>\n      <hy-table  \n      @onSelect=${(e:CustomEvent)=>{\n        console.log('selected', e.detail.value)\n      }} \n      @onPaginate=${(e:CustomEvent)=>{\n        console.log('page ',e.detail.value)\n      }}\n      @onSort=${(e:CustomEvent)=>{\n        console.log('sorted ', e.detail.value)\n      }}\n      .headers=\"${this.headers}\" .rows=\"${this.rows}\" .selectionMode=${'multiple'}></hy-table>\n      <h3>Single selection</h3>\n      <hy-table .headers=\"${this.headers}\" .rows=\"${this.rows}\" .selectionMode=${'single'}></hy-table>\n      <h1>With Expandable attribute (title)</h1>\n      <hy-table .headers=\"${this.headers}\" .rows=\"${this.rows}\" .expandable=${'title'}></hy-table>\n      <h1>With filter: search</h1>\n      <hy-table .headers=\"${this.headers}\" .rows=\"${this.rows}\" .withFilter=${true}></hy-table>\n      <h3>filter + expandable attribute (priority)</h3>\n      <hy-table\n        .headers=\"${this.headers}\"\n        .rows=\"${this.rows}\"\n        .withFilter=${true}\n        .expandable=${'priority'}\n        @onSelect=${(e:CustomEvent)=>{\n          console.log('selected', e.detail.value)\n        }}\n        @onSearch=${(e:CustomEvent)=>{\n          console.log('searched ',e.detail.value)\n        }}\n        @onSort=${(e:CustomEvent)=>{\n          console.log('sorted ', e.detail.value)\n        }}\n      ></hy-table>\n\n      <h1>Sizes</h1>\n      <h3>Small size with selection</h3>\n      <hy-table\n        .headers=\"${this.headers}\"\n        .rows=\"${this.rows}\"\n        .size=${'small'}\n        .selectionMode=${'multiple'}\n      ></hy-table>\n      <h3>Large size</h3>\n      <hy-table .headers=\"${this.headers}\" .rows=\"${this.rows}\" .size=${'large'}></hy-table>\n      <h3>Large size with multiple selection</h3>\n      <hy-table\n        .headers=\"${this.headers}\"\n        .rows=\"${this.rows}\"\n        .size=${'large'}\n        .selectionMode=${'multiple'}\n      ></hy-table>\n    `;\n  }\n}\ncustomElements.define('hy-table-demo', TableDemo);\n"]}

package/index.d.ts

@@ -0,0 +1,2 @@
+export * from './table.component.js';
+//# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/table/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/index.js

@@ -0,0 +1,2 @@
+export * from './table.component.js';
+//# sourceMappingURL=index.js.map

package/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/table/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC","sourcesContent":["export * from './table.component.js';"]}

package/package.json

@@ -0,0 +1,15 @@
+{
+    "name": "@nuralyui/table",
+    "version": "0.0.1",
+    "description": "",
+    "main": "index.js",
+    "type": "module",
+    "dependencies": {
+        "dayjs": "^1.11.7"
+    },
+    "scripts": {
+        "test": "echo \"Error: no test specified\" && exit 1"
+    },
+    "author": "Labidi Aymen",
+    "license": "ISC"
+}

package/table.component.d.ts

@@ -0,0 +1,39 @@
+import { LitElement, PropertyValueMap } from 'lit';
+import './components/hy-table-actions.js';
+import './components/hy-table-filter.js';
+import './components/hy-table-pagination.js';
+import './components/hy-table-content.js';
+import { IHeader, SelectionMode, Sizes, SortAttribute } from './table.types.js';
+export declare class HyTable extends LitElement {
+    static styles: import("lit").CSSResult;
+    headers: IHeader[];
+    rows: [];
+    size: Sizes;
+    withFilter: boolean;
+    expandable: string | undefined;
+    selectionMode: SelectionMode | undefined;
+    itemPerPage: number[];
+    selectedItemPerPage: number;
+    displayedRows: never[];
+    selectedItems: boolean[];
+    currentPage: number;
+    rowsCopy: [];
+    activeSearch: boolean;
+    sortAttribute: SortAttribute;
+    connectedCallback(): void;
+    willUpdate(_changedProperties: PropertyValueMap<this>): void;
+    _initSelection(): void;
+    _initPagination(): void;
+    _handleItemPerPage(itemPerPageEvent: CustomEvent): void;
+    _handleUpdatePage(updatePageEvent: CustomEvent): void;
+    _handleCheckAll(checkAllEvent: CustomEvent): void;
+    _handleCheckOne(checkOneEvent: CustomEvent): void;
+    _handleSelectOne(selectOneEvent: CustomEvent): void;
+    _handleCancelSelection(): void;
+    _handleSearch(searchEvent: CustomEvent): void;
+    _handleSortOrder(sortOrderEvent: CustomEvent): void;
+    _sort(): void;
+    _resetSort(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+//# sourceMappingURL=table.component.d.ts.map

package/table.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.component.d.ts","sourceRoot":"","sources":["../../../src/components/table/table.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,UAAU,EAAE,gBAAgB,EAAgB,MAAM,KAAK,CAAC;AAEhE,OAAO,kCAAkC,CAAC;AAC1C,OAAO,iCAAiC,CAAC;AACzC,OAAO,qCAAqC,CAAC;AAC7C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,EAAC,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,aAAa,EAAuB,MAAM,kBAAkB,CAAC;AAEpG,qBACa,OAAQ,SAAQ,UAAU;IACrC,OAAgB,MAAM,0BAAU;IAEP,OAAO,EAAG,OAAO,EAAE,CAAC;IACpB,IAAI,EAAE,EAAE,CAAM;IAC3B,IAAI,QAAgB;IACL,UAAU,UAAS;IACpB,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7C,aAAa,EAAE,aAAa,GAAG,SAAS,CAAC;IAE5C,WAAW,WAAmB;IAC9B,mBAAmB,SAAuB;IAC1C,aAAa,UAAM;IACnB,aAAa,EAAE,OAAO,EAAE,CAAM;IAC9B,WAAW,EAAG,MAAM,CAAC;IACrB,QAAQ,EAAE,EAAE,CAAM;IAClB,YAAY,UAAS;IACrB,aAAa,EAAE,aAAa,CAAyC;IAErE,iBAAiB,IAAI,IAAI;IAKzB,UAAU,CAAC,kBAAkB,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAkB9D,cAAc;IAGd,eAAe;IASf,kBAAkB,CAAC,gBAAgB,EAAE,WAAW;IAKhD,iBAAiB,CAAC,eAAe,EAAE,WAAW;IAU9C,eAAe,CAAC,aAAa,EAAE,WAAW;IAM1C,eAAe,CAAC,aAAa,EAAE,WAAW;IAM1C,gBAAgB,CAAC,cAAc,EAAE,WAAW;IAY5C,sBAAsB;IAKtB,aAAa,CAAC,WAAW,EAAE,WAAW;IAgBtC,gBAAgB,CAAC,cAAc,EAAE,WAAW;IAa5C,KAAK;IAkBL,UAAU;IAeD,MAAM;CAwChB"}