@parksw/sw-ui-components 0.0.2 → 0.0.5

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -1,22 +1,45 @@
 {
   "name": "@parksw/sw-ui-components",
   "private": false,
-  "version": "0.0.2",
+  "version": "0.0.5",
   "type": "module",
-  "main": "dist/index.js",
-  "module": "dist/index.js",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
   "files": [
     "dist"
   ],
   "exports": {
-    ".": "./dist/index.js",
-    "./my-button.js": "./dist/my-button.js",
-    "./my-calendar.js": "./dist/my-calendar.js",
-    "./my-element.js": "./dist/my-element.js"
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./my-button": {
+      "types": "./dist/my-button.d.ts",
+      "import": "./dist/my-button.js",
+      "default": "./dist/my-button.js"
+    },
+    "./my-calendar": {
+      "types": "./dist/my-calendar.d.ts",
+      "import": "./dist/my-calendar.js",
+      "default": "./dist/my-calendar.js"
+    },
+    "./my-element": {
+      "types": "./dist/my-element.d.ts",
+      "import": "./dist/my-element.js",
+      "default": "./dist/my-element.js"
+    },
+    "./my-grid": {
+      "types": "./dist/my-grid.d.ts",
+      "import": "./dist/my-grid.js",
+      "default": "./dist/my-grid.js"
+    },
+    "./style.css": "./dist/style.css"
   },
   "scripts": {
     "dev": "vite",
-    "build": "tsc",
+    "build": "tsc && vite build",
     "preview": "vite preview"
   },
   "dependencies": {

package/dist/index.d.ts

@@ -1,4 +0,0 @@
-export * from './my-element.js';
-export * from './my-button.js';
-export * from './my-calendar.js';
-export * from './my-grid.js';

package/dist/my-button.d.ts

@@ -1,8 +0,0 @@
-import { LitElement } from 'lit';
-export declare class MyButton extends LitElement {
-    label: string;
-    disabled: boolean;
-    variant: 'primary' | 'secondary';
-    render(): import("lit-html").TemplateResult<1>;
-    static styles: import("lit").CSSResult;
-}

package/dist/my-button.js

@@ -1,75 +0,0 @@
-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 { customElement, property } from 'lit/decorators.js';
-let MyButton = class MyButton extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.label = 'Button';
-        this.disabled = false;
-        this.variant = 'primary';
-    }
-    render() {
-        return html `
-      <button
-        class="button ${this.variant}"
-        ?disabled=${this.disabled}
-      >
-        ${this.label}
-      </button>
-    `;
-    }
-    static { this.styles = css `
-    .button {
-      border: none;
-      color: white;
-      padding: 12px 24px;
-      text-align: center;
-      text-decoration: none;
-      display: inline-block;
-      font-size: 16px;
-      margin: 4px 2px;
-      cursor: pointer;
-      border-radius: 8px;
-      transition: background-color 0.3s ease;
-    }
-
-    .button:disabled {
-      cursor: not-allowed;
-      opacity: 0.6;
-    }
-
-    .primary {
-      background-color: #4CAF50; /* Green */
-    }
-
-    .primary:hover:not(:disabled) {
-      background-color: #45a049;
-    }
-
-    .secondary {
-      background-color: #008CBA; /* Blue */
-    }
-
-    .secondary:hover:not(:disabled) {
-      background-color: #007bb5;
-    }
-  `; }
-};
-__decorate([
-    property({ type: String })
-], MyButton.prototype, "label", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], MyButton.prototype, "disabled", void 0);
-__decorate([
-    property({ type: String })
-], MyButton.prototype, "variant", void 0);
-MyButton = __decorate([
-    customElement('my-button')
-], MyButton);
-export { MyButton };

package/dist/my-calendar.d.ts

@@ -1,12 +0,0 @@
-import { LitElement } from 'lit';
-export declare class MyCalendar extends LitElement {
-    private date;
-    private get year();
-    private get month();
-    private _changeMonth;
-    private _renderHeader;
-    private _renderDaysOfWeek;
-    private _renderDates;
-    render(): import("lit-html").TemplateResult<1>;
-    static styles: import("lit").CSSResult;
-}

package/dist/my-calendar.js

@@ -1,147 +0,0 @@
-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 { customElement, state } from 'lit/decorators.js';
-let MyCalendar = class MyCalendar extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.date = new Date();
-    }
-    get year() {
-        return this.date.getFullYear();
-    }
-    get month() {
-        return this.date.getMonth();
-    }
-    _changeMonth(offset) {
-        this.date = new Date(this.year, this.month + offset, 1);
-    }
-    _renderHeader() {
-        const monthName = this.date.toLocaleString('default', { month: 'long' });
-        return html `
-      <div class="header">
-        <button @click=${() => this._changeMonth(-1)}>‹</button>
-        <div class="month-year">${monthName} ${this.year}</div>
-        <button @click=${() => this._changeMonth(1)}>›</button>
-      </div>
-    `;
-    }
-    _renderDaysOfWeek() {
-        const days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
-        return html `
-      <div class="days-of-week">
-        ${days.map(day => html `<div>${day}</div>`)}
-      </div>
-    `;
-    }
-    _renderDates() {
-        const today = new Date();
-        const firstDayOfMonth = new Date(this.year, this.month, 1).getDay();
-        const daysInMonth = new Date(this.year, this.month + 1, 0).getDate();
-        const dates = [];
-        for (let i = 0; i < firstDayOfMonth; i++) {
-            dates.push(html `<div class="date-cell empty"></div>`);
-        }
-        for (let i = 1; i <= daysInMonth; i++) {
-            const isToday = this.year === today.getFullYear() &&
-                this.month === today.getMonth() &&
-                i === today.getDate();
-            dates.push(html `<div class="date-cell ${isToday ? 'today' : ''}">${i}</div>`);
-        }
-        return html `<div class="date-grid">${dates}</div>`;
-    }
-    render() {
-        return html `
-      <div class="calendar-container">
-        ${this._renderHeader()}
-        ${this._renderDaysOfWeek()}
-        ${this._renderDates()}
-      </div>
-    `;
-    }
-    static { this.styles = css `
-    :host {
-      display: block;
-      max-width: 350px;
-      border: 1px solid #ccc;
-      border-radius: 8px;
-      padding: 16px;
-      font-family: sans-serif;
-      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
-    }
-
-    .header {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      margin-bottom: 16px;
-    }
-
-    .header button {
-      background: none;
-      border: 1px solid #ccc;
-      border-radius: 50%;
-      width: 32px;
-      height: 32px;
-      cursor: pointer;
-      font-size: 18px;
-      transition: background-color 0.2s;
-    }
-
-    .header button:hover {
-      background-color: #eee;
-    }
-
-    .month-year {
-      font-size: 1.2em;
-      font-weight: bold;
-    }
-
-    .days-of-week, .date-grid {
-      display: grid;
-      grid-template-columns: repeat(7, 1fr);
-      text-align: center;
-    }
-
-    .days-of-week > div {
-      font-weight: bold;
-      padding-bottom: 8px;
-      font-size: 0.9em;
-      color: #666;
-    }
-
-    .date-cell {
-      padding: 4px 0;
-      cursor: pointer;
-      border-radius: 50%;
-      width: 32px;
-      height: 32px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      margin: 2px auto;
-      transition: background-color 0.2s;
-    }
-
-    .date-cell:not(.empty):hover {
-      background-color: #eee;
-    }
-
-    .date-cell.today {
-      background-color: #4CAF50;
-      color: white;
-      font-weight: bold;
-    }
-  `; }
-};
-__decorate([
-    state()
-], MyCalendar.prototype, "date", void 0);
-MyCalendar = __decorate([
-    customElement('my-calendar')
-], MyCalendar);
-export { MyCalendar };

package/dist/my-element.d.ts

@@ -1,6 +0,0 @@
-import { LitElement } from 'lit';
-export declare class MyElement extends LitElement {
-    name: string;
-    render(): import("lit-html").TemplateResult<1>;
-    static styles: import("lit").CSSResult;
-}

package/dist/my-element.js

@@ -1,34 +0,0 @@
-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 { customElement, property } from 'lit/decorators.js';
-let MyElement = class MyElement extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.name = 'World';
-    }
-    render() {
-        return html `
-      <h1>Hello, ${this.name}!</h1>
-    `;
-    }
-    static { this.styles = css `
-    :host {
-      display: block;
-      border: solid 1px gray;
-      padding: 16px;
-      max-width: 800px;
-    }
-  `; }
-};
-__decorate([
-    property()
-], MyElement.prototype, "name", void 0);
-MyElement = __decorate([
-    customElement('my-element')
-], MyElement);
-export { MyElement };

package/dist/my-grid.d.ts

@@ -1,75 +0,0 @@
-import { LitElement, PropertyValues } from 'lit';
-interface Column {
-    key: string;
-    header: string;
-    linkTemplate?: string;
-    width?: string;
-    align?: 'left' | 'center' | 'right';
-}
-export declare class MyGrid extends LitElement {
-    columns: Column[];
-    data: Record<string, unknown>[];
-    itemsPerPage: number;
-    columnReordering: boolean;
-    height: string;
-    enableColumnVisibility: boolean;
-    enableFilter: boolean;
-    rowClass?: (row: Record<string, unknown>) => string;
-    private _sortKey;
-    private _sortDirection;
-    private _draggedColumnIndex;
-    private _dragOverColumnIndex;
-    private _selectedRowId;
-    private _selectedColumnKey;
-    private _filterValues;
-    private _activeFilterColumn;
-    private _filterSearchTerm;
-    private _currentPage;
-    private _hiddenColumns;
-    private _showColumnMenu;
-    private _filterMenuSortDirection;
-    private _resizingColumnIndex;
-    private _startX;
-    private _startWidth;
-    constructor();
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    protected updated(changedProperties: PropertyValues): void;
-    private _handleDocumentClick;
-    private get _visibleColumns();
-    private get _gridColumnTemplate();
-    private _resetPage;
-    private _toggleColumnMenu;
-    private _toggleColumnVisibility;
-    private _handleItemsPerPageChange;
-    private _handleHeaderClick;
-    private _toggleFilterMenu;
-    private _toggleFilterMenuSort;
-    private _getUniqueValues;
-    private _isFilterActive;
-    private _handleFilterValueChange;
-    private _handleSelectAll;
-    private _handleFilterSearch;
-    private _handleResizeStart;
-    private _handleResizeMove;
-    private _handleResizeEnd;
-    private get _filteredData();
-    private get _sortedData();
-    private get _paginatedData();
-    private _handleCellClick;
-    private _handleDragStart;
-    private _handleDragOver;
-    private _handleDragLeave;
-    private _handleDrop;
-    private _handleDragEnd;
-    private _formatLink;
-    private _renderCell;
-    private _renderColumnMenu;
-    private _renderFilterMenu;
-    private _renderHeader;
-    private _renderBody;
-    private _renderPaginationControls;
-    render(): import("lit-html").TemplateResult<1>;
-    static styles: import("lit").CSSResult;
-}
-export {};