@parksw/sw-ui-components 0.0.2 → 0.0.3

package/dist/decorate-BnP3GfGh.js

@@ -0,0 +1,7 @@
+function __decorate(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}
+export { __decorate as t };

package/dist/index.js

@@ -1,4 +1,6 @@
-export * from './my-element.js';
-export * from './my-button.js';
-export * from './my-calendar.js';
-export * from './my-grid.js';
+import "./decorate-BnP3GfGh.js";
+import { t as MyElement } from "./my-element-BWehTtOJ.js";
+import { t as MyButton } from "./my-button-BXW2ABd3.js";
+import { t as MyCalendar } from "./my-calendar-ylD4tbTZ.js";
+import { t as MyGrid } from "./my-grid-DduCSbuo.js";
+export { MyButton, MyCalendar, MyElement, MyGrid };

package/dist/my-button-BXW2ABd3.js

@@ -0,0 +1,59 @@
+import { t as __decorate } from "./decorate-BnP3GfGh.js";
+import { LitElement, css, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+var MyButton = class extends LitElement {
+	constructor(...e) {
+		super(...e), this.label = "Button", this.disabled = !1, this.variant = "primary";
+	}
+	render() {
+		return html`
+      <button
+        class="button ${this.variant}"
+        ?disabled=${this.disabled}
+      >
+        ${this.label}
+      </button>
+    `;
+	}
+	static #e = 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: !0
+})], MyButton.prototype, "disabled", void 0), __decorate([property({ type: String })], MyButton.prototype, "variant", void 0), MyButton = __decorate([customElement("my-button")], MyButton);
+export { MyButton as t };

package/dist/my-button.js

@@ -1,75 +1,3 @@
-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);
+import "./decorate-BnP3GfGh.js";
+import { t as MyButton } from "./my-button-BXW2ABd3.js";
 export { MyButton };

package/dist/my-calendar-ylD4tbTZ.js

@@ -0,0 +1,135 @@
+import { t as __decorate } from "./decorate-BnP3GfGh.js";
+import { LitElement, css, html } from "lit";
+import { customElement, state } from "lit/decorators.js";
+var MyCalendar = class extends LitElement {
+	constructor(...e) {
+		super(...e), this.date = /* @__PURE__ */ new Date();
+	}
+	get year() {
+		return this.date.getFullYear();
+	}
+	get month() {
+		return this.date.getMonth();
+	}
+	_changeMonth(e) {
+		this.date = new Date(this.year, this.month + e, 1);
+	}
+	_renderHeader() {
+		return html`
+      <div class="header">
+        <button @click=${() => this._changeMonth(-1)}>‹</button>
+        <div class="month-year">${this.date.toLocaleString("default", { month: "long" })} ${this.year}</div>
+        <button @click=${() => this._changeMonth(1)}>›</button>
+      </div>
+    `;
+	}
+	_renderDaysOfWeek() {
+		return html`
+      <div class="days-of-week">
+        ${[
+			"Sun",
+			"Mon",
+			"Tue",
+			"Wed",
+			"Thu",
+			"Fri",
+			"Sat"
+		].map((e) => html`<div>${e}</div>`)}
+      </div>
+    `;
+	}
+	_renderDates() {
+		let e = /* @__PURE__ */ new Date(), i = new Date(this.year, this.month, 1).getDay(), a = new Date(this.year, this.month + 1, 0).getDate(), o = [];
+		for (let e = 0; e < i; e++) o.push(html`<div class="date-cell empty"></div>`);
+		for (let i = 1; i <= a; i++) {
+			let a = this.year === e.getFullYear() && this.month === e.getMonth() && i === e.getDate();
+			o.push(html`<div class="date-cell ${a ? "today" : ""}">${i}</div>`);
+		}
+		return html`<div class="date-grid">${o}</div>`;
+	}
+	render() {
+		return html`
+      <div class="calendar-container">
+        ${this._renderHeader()}
+        ${this._renderDaysOfWeek()}
+        ${this._renderDates()}
+      </div>
+    `;
+	}
+	static #e = 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 as t };

package/dist/my-calendar.js

@@ -1,147 +1,3 @@
-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);
+import "./decorate-BnP3GfGh.js";
+import { t as MyCalendar } from "./my-calendar-ylD4tbTZ.js";
 export { MyCalendar };

package/dist/my-element-BWehTtOJ.js

@@ -0,0 +1,23 @@
+import { t as __decorate } from "./decorate-BnP3GfGh.js";
+import { LitElement, css, html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+var MyElement = class extends LitElement {
+	constructor(...e) {
+		super(...e), this.name = "World";
+	}
+	render() {
+		return html`
+      <h1>Hello, ${this.name}!</h1>
+    `;
+	}
+	static #e = 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 as t };

package/dist/my-element.js

@@ -1,34 +1,3 @@
-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);
+import "./decorate-BnP3GfGh.js";
+import { t as MyElement } from "./my-element-BWehTtOJ.js";
 export { MyElement };