@illinois-toolkit/ilw-quote 1.1.0 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,7 +6,7 @@
6
6
  "element-name": "ilw-quote",
7
7
  "description": "Displays a quote or testimonial, with optional attribution of author and source.",
8
8
  "purpose": "Highlight a quote or testimonial.",
9
- "toolkit-version": "1.1",
10
- "production-version": "1.1",
11
- "development-version": "1.0-beta"
9
+ "toolkit-version": "1.2",
10
+ "production-version": "1.2",
11
+ "development-version": "latest"
12
12
  }
@@ -8,8 +8,8 @@
8
8
  "builder-version": "1.0",
9
9
  "version": "1.0.0",
10
10
  "date": "10/22/2024",
11
- "css": "https://cdn.toolkit.illinois.edu/ilw-quote/1.0.0/ilw-quote.css",
12
- "js": "https://cdn.toolkit.illinois.edu/ilw-quote/1.0.0/ilw-quote.js",
11
+ "css": "https://cdn.toolkit.illinois.edu/ilw-quote/1.0/ilw-quote.css",
12
+ "js": "https://cdn.toolkit.illinois.edu/ilw-quote/1.0/ilw-quote.js",
13
13
  "production": true,
14
14
  "notes": "",
15
15
  "parent-style": "",
@@ -8,8 +8,8 @@
8
8
  "builder-version": "1.1",
9
9
  "version": "1.1.0",
10
10
  "date": "2/18/2025",
11
- "css": "https://cdn.toolkit.illinois.edu/ilw-quote/1.1.0/ilw-quote.css",
12
- "js": "https://cdn.toolkit.illinois.edu/ilw-quote/1.1.0/ilw-quote.js",
11
+ "css": "https://cdn.toolkit.illinois.edu/ilw-quote/1.1/ilw-quote.css",
12
+ "js": "https://cdn.toolkit.illinois.edu/ilw-quote/1.1/ilw-quote.js",
13
13
  "production": true,
14
14
  "notes": "",
15
15
  "parent-style": "",
@@ -0,0 +1,81 @@
1
+ {
2
+ "title": "Quote",
3
+ "tag": "ilw-quote",
4
+ "github": "https://github.com/web-illinois/ilw-quote/",
5
+ "type": "web component",
6
+ "element-name": "ilw-quote",
7
+ "description": "This component represents a quote or testimonial, with optional attribution of author and source. The quote or testimonial is intended to be intermixed with copy and the quote is highlighted and called out.",
8
+ "builder-version": "1.2",
9
+ "version": "1.2.0",
10
+ "date": "11/17/2025",
11
+ "css": "https://cdn.toolkit.illinois.edu/ilw-quote/1.2/ilw-quote.css",
12
+ "js": "https://cdn.toolkit.illinois.edu/ilw-quote/1.2/ilw-quote.js",
13
+ "production": false,
14
+ "notes": "",
15
+ "parent-style": "",
16
+ "samples": [
17
+ {
18
+ "name": "default",
19
+ "description": "Default information",
20
+ "text": "<p slot=\"content\">Either university presses will embrace new technology and offer scholarly content in new forms\n to researchers and under new business models, or they will follow the music industry and spend\n all of their resources on trying to protect their territory &mdash; unsuccessfully.</p>\n <p slot=\"author\">Laura Cerruti</p>\n <cite slot=\"source\">Director of Digital Content Development, University of California Press, profiled in Against the Grain</cite>"
21
+ },
22
+ {
23
+ "name": "no author or source",
24
+ "description": "No author or source",
25
+ "text": "<p slot=\"content\">Lastly, she pictured to herself how this same little sister of hers would, in the after-time, be herself a grown woman; and how she would keep, through all her riper years, the simple and loving heart of her childhood: and how she would gather about her other little children, and make their eyes bright and eager with many a strange tale, perhaps even with the dream of Wonderland of long ago: and how she would feel with all their simple sorrows, and find a pleasure in all their simple joys, remembering her own child-life, and the happy summer days.</p>"
26
+ },
27
+ {
28
+ "name": "no source",
29
+ "description": "No source",
30
+ "text": "<p slot=\"content\">There never is a happy ending because nothing ever ends.</p>\n <p slot=\"author\">Peter S. Beagle, The Last Unicorn</p>"
31
+ }
32
+ ],
33
+ "attributes-fixed": [],
34
+ "attributes-text": [
35
+ {
36
+ "name": "padding",
37
+ "description": "Padding of the text inside the component",
38
+ "depreciated": false,
39
+ "value": ""
40
+ }
41
+ ],
42
+ "attributes": [
43
+ {
44
+ "name": "theme",
45
+ "description": "Color theme used",
46
+ "depreciated": false,
47
+ "values": [
48
+ "",
49
+ "blue",
50
+ "orange",
51
+ "blue-gradient",
52
+ "orange-gradient",
53
+ "gray"
54
+ ]
55
+ },
56
+ {
57
+ "name": "size",
58
+ "description": "Size of quote",
59
+ "depreciated": false,
60
+ "values": [
61
+ "",
62
+ "small",
63
+ "medium",
64
+ "large"
65
+ ]
66
+ }, {
67
+ "name": "font",
68
+ "description": "Font used",
69
+ "depreciated": false,
70
+ "values": [
71
+ "",
72
+ "sans",
73
+ "serif"
74
+ ]
75
+ }
76
+ ],
77
+ "classes-fixed": [],
78
+ "classes": [],
79
+ "css-variables": [
80
+ ]
81
+ }
@@ -5,11 +5,11 @@
5
5
  "type": "web component",
6
6
  "element-name": "ilw-quote",
7
7
  "description": "This component represents a quote or testimonial, with optional attribution of author and source. The quote or testimonial is intended to be intermixed with copy and the quote is highlighted and called out.",
8
- "builder-version": "1.0-beta",
8
+ "builder-version": "latest",
9
9
  "version": "1.0.0-beta",
10
10
  "date": "09/13/2024",
11
- "css": "https://dev.toolkit.illinois.edu/ilw-quote/1.0.0-beta/ilw-quote.css",
12
- "js": "https://dev.toolkit.illinois.edu/ilw-quote/1.0.0-beta/ilw-quote.js",
11
+ "css": "https://dev.toolkit.illinois.edu/ilw-quote/latest/ilw-quote.css",
12
+ "js": "https://dev.toolkit.illinois.edu/ilw-quote/latest/ilw-quote.js",
13
13
  "production": false,
14
14
  "notes": "",
15
15
  "parent-style": "",
@@ -1 +1 @@
1
- @layer base{:root{--ilw-quote--background: white;--ilw-quote--color: var(--il-blue);--ilw-quote--author-color: var(--il-orange);--ilw-quote--source-color: var(--il-blue);--ilw-quote--mark-color: var(--il-orange);--ilw-quote--margin: 1rem 0;--ilw-quote--padding: 0 0 1em 0;--ilw-quote--base-font-size: .875rem;--ilw-quote--font: var(--il-font-sans);--ilw-quote--font-serif: var(--il-font-serif);--ilw-quote--font-weight: 600;--ilw-quote--font-size: 1.625em;--ilw-quote--line-height: 1.35;--ilw-quote--author-font-weight: 700;--ilw-quote--author-font-size: 1.625em;--ilw-quote--author-line-height: 1.1;--ilw-quote--source-font-weight: 400;--ilw-quote--source-font-size: 1.428em;--ilw-quote--source-line-height: 1.35;--ilw-quote--mark-font: 9.5em/0 var(--il-font-serif);--ilw-quote--mark-height: .4em;--ilw-quote--mark-top: -10px;--ilw-quote--mark-content-before: "“";--ilw-quote--mark-content-after: "”";--ilw-quote--max-width: 620px;--ilw-quote--border: 6px solid var(--il-orange)}ilw-quote{font-family:var(--ilw-quote--font);font-size:var(--ilw-quote--base-font-size);text-align:center;margin:var(--ilw-quote--margin);padding:var(--ilw-quote--padding)}ilw-quote[theme=blue]{--ilw-quote--background: var(--il-blue);--ilw-quote--color: white;--ilw-quote--author-color: var(--il-orange);--ilw-quote--source-color: white;--ilw-quote--mark-color: var(--il-orange)}ilw-quote[theme=gray]{--ilw-quote--background: var(--il-storm-lighter-4);--ilw-quote--author-color: var(--il-altgeld);--ilw-quote--mark-color: var(--il-altgeld)}ilw-quote[align=left]{text-align:left;border-left:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-left:3.125em}ilw-quote[align=right]{text-align:right;border-right:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-right:3.125em}ilw-quote[size=medium]{--ilw-quote--base-font-size: 1rem}ilw-quote[size=large]{--ilw-quote--base-font-size: 1.154rem}}.ilw-quote--exclude-marks{--ilw-quote--mark-content-before: none;--ilw-quote--mark-content-after: none}ilw-quote *[slot=content]{font-weight:var(--ilw-quote--font-weight);font-size:var(--ilw-quote--font-size);line-height:var(--ilw-quote--line-height)}ilw-quote[font=serif] *[slot=content]{font-family:var(--ilw-quote--font-serif);--ilw-quote--font-weight: 400}ilw-quote *[slot=author]{margin-top:1.8em;margin-bottom:.5em;color:var(--ilw-quote--author-color);font-weight:var(--ilw-quote--author-font-weight);font-size:var(--ilw-quote--author-font-size);line-height:var(--ilw-quote--author-line-height)}ilw-quote *[slot=source]{margin:0;color:var(--ilw-quote--source-color);font-style:inherit;font-weight:var(--ilw-quote--source-font-weight);font-size:var(--ilw-quote--source-font-size);line-height:var(--ilw-quote--source-line-height);display:block}
1
+ @layer base{:root{--ilw-quote--margin: 1rem 0;--ilw-quote--base-font-size: .875rem;--ilw-quote--font: var(--il-font-sans);--ilw-quote--font-serif: var(--il-font-serif);--ilw-quote--font-weight: 600;--ilw-quote--font-size: 1.625em;--ilw-quote--line-height: 1.35;--ilw-quote--author-font-weight: 700;--ilw-quote--author-font-size: 1.625em;--ilw-quote--author-line-height: 1.1;--ilw-quote--source-font-weight: 400;--ilw-quote--source-font-size: 1.428em;--ilw-quote--source-line-height: 1.35;--ilw-quote--mark-font: 9.5em/0 var(--il-font-serif);--ilw-quote--mark-height: .4em;--ilw-quote--mark-top: -10px;--ilw-quote--mark-content-before: "“";--ilw-quote--mark-content-after: "”";--ilw-quote--max-width: 620px;--ilw-quote--border: 6px solid var(--ilw-color--control-accent)}ilw-quote{font-family:var(--ilw-quote--font);font-size:var(--ilw-quote--base-font-size);text-align:center;margin:var(--ilw-quote--margin)}ilw-quote[align=left]{text-align:left;border-left:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-left:3.125em}ilw-quote[align=right]{text-align:right;border-right:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-right:3.125em}ilw-quote[size=medium]{--ilw-quote--base-font-size: 1rem}ilw-quote[size=large]{--ilw-quote--base-font-size: 1.154rem}}.ilw-quote--exclude-marks{--ilw-quote--mark-content-before: none;--ilw-quote--mark-content-after: none}ilw-quote *[slot=content]{font-weight:var(--ilw-quote--font-weight);font-size:var(--ilw-quote--font-size);line-height:var(--ilw-quote--line-height)}ilw-quote[font=serif] *[slot=content]{font-family:var(--ilw-quote--font-serif);--ilw-quote--font-weight: 400}ilw-quote *[slot=author]{margin-top:1.8em;margin-bottom:.5em;color:var(--ilw-color--control-accent);font-weight:var(--ilw-quote--author-font-weight);font-size:var(--ilw-quote--author-font-size);line-height:var(--ilw-quote--author-line-height)}ilw-quote *[slot=source]{margin:0;color:var(--ilw-color--heading);font-style:inherit;font-weight:var(--ilw-quote--source-font-weight);font-size:var(--ilw-quote--source-font-size);line-height:var(--ilw-quote--source-line-height);display:block}
@@ -1,20 +1,15 @@
1
- /**
2
- * @license
3
- * Copyright 2019 Google LLC
4
- * SPDX-License-Identifier: BSD-3-Clause
5
- */
6
- const M = globalThis, B = M.ShadowRoot && (M.ShadyCSS === void 0 || M.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, it = Symbol(), K = /* @__PURE__ */ new WeakMap();
7
- let lt = class {
1
+ const H = globalThis, z = H.ShadowRoot && (H.ShadyCSS === void 0 || H.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, X = Symbol(), B = /* @__PURE__ */ new WeakMap();
2
+ let ot = class {
8
3
  constructor(t, e, s) {
9
- if (this._$cssResult$ = !0, s !== it) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
4
+ if (this._$cssResult$ = !0, s !== X) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
10
5
  this.cssText = t, this.t = e;
11
6
  }
12
7
  get styleSheet() {
13
8
  let t = this.o;
14
9
  const e = this.t;
15
- if (B && t === void 0) {
10
+ if (z && t === void 0) {
16
11
  const s = e !== void 0 && e.length === 1;
17
- s && (t = K.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && K.set(e, t));
12
+ s && (t = B.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && B.set(e, t));
18
13
  }
19
14
  return t;
20
15
  }
@@ -22,90 +17,83 @@ let lt = class {
22
17
  return this.cssText;
23
18
  }
24
19
  };
25
- const ot = (o) => new lt(typeof o == "string" ? o : o + "", void 0, it), ct = (o, t) => {
26
- if (B) o.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
20
+ const tt = (r) => new ot(typeof r == "string" ? r : r + "", void 0, X), nt = (r, t) => {
21
+ if (z) r.adoptedStyleSheets = t.map(((e) => e instanceof CSSStyleSheet ? e : e.styleSheet));
27
22
  else for (const e of t) {
28
- const s = document.createElement("style"), i = M.litNonce;
29
- i !== void 0 && s.setAttribute("nonce", i), s.textContent = e.cssText, o.appendChild(s);
23
+ const s = document.createElement("style"), i = H.litNonce;
24
+ i !== void 0 && s.setAttribute("nonce", i), s.textContent = e.cssText, r.appendChild(s);
30
25
  }
31
- }, Z = B ? (o) => o : (o) => o instanceof CSSStyleSheet ? ((t) => {
26
+ }, W = z ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((t) => {
32
27
  let e = "";
33
28
  for (const s of t.cssRules) e += s.cssText;
34
- return ot(e);
35
- })(o) : o;
36
- /**
37
- * @license
38
- * Copyright 2017 Google LLC
39
- * SPDX-License-Identifier: BSD-3-Clause
40
- */
41
- const { is: dt, defineProperty: pt, getOwnPropertyDescriptor: ut, getOwnPropertyNames: $t, getOwnPropertySymbols: _t, getPrototypeOf: ft } = Object, f = globalThis, F = f.trustedTypes, mt = F ? F.emptyScript : "", j = f.reactiveElementPolyfillSupport, w = (o, t) => o, R = { toAttribute(o, t) {
29
+ return tt(e);
30
+ })(r) : r;
31
+ const { is: ht, defineProperty: at, getOwnPropertyDescriptor: lt, getOwnPropertyNames: ct, getOwnPropertySymbols: dt, getPrototypeOf: pt } = Object, k = globalThis, V = k.trustedTypes, ut = V ? V.emptyScript : "", $t = k.reactiveElementPolyfillSupport, w = (r, t) => r, N = { toAttribute(r, t) {
42
32
  switch (t) {
43
33
  case Boolean:
44
- o = o ? mt : null;
34
+ r = r ? ut : null;
45
35
  break;
46
36
  case Object:
47
37
  case Array:
48
- o = o == null ? o : JSON.stringify(o);
38
+ r = r == null ? r : JSON.stringify(r);
49
39
  }
50
- return o;
51
- }, fromAttribute(o, t) {
52
- let e = o;
40
+ return r;
41
+ }, fromAttribute(r, t) {
42
+ let e = r;
53
43
  switch (t) {
54
44
  case Boolean:
55
- e = o !== null;
45
+ e = r !== null;
56
46
  break;
57
47
  case Number:
58
- e = o === null ? null : Number(o);
48
+ e = r === null ? null : Number(r);
59
49
  break;
60
50
  case Object:
61
51
  case Array:
62
52
  try {
63
- e = JSON.parse(o);
53
+ e = JSON.parse(r);
64
54
  } catch {
65
55
  e = null;
66
56
  }
67
57
  }
68
58
  return e;
69
- } }, W = (o, t) => !dt(o, t), J = { attribute: !0, type: String, converter: R, reflect: !1, hasChanged: W };
70
- Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), f.litPropertyMetadata ?? (f.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
59
+ } }, D = (r, t) => !ht(r, t), K = { attribute: !0, type: String, converter: N, reflect: !1, useDefault: !1, hasChanged: D };
60
+ Symbol.metadata ??= Symbol("metadata"), k.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
71
61
  class y extends HTMLElement {
72
62
  static addInitializer(t) {
73
- this._$Ei(), (this.l ?? (this.l = [])).push(t);
63
+ this._$Ei(), (this.l ??= []).push(t);
74
64
  }
75
65
  static get observedAttributes() {
76
66
  return this.finalize(), this._$Eh && [...this._$Eh.keys()];
77
67
  }
78
- static createProperty(t, e = J) {
79
- if (e.state && (e.attribute = !1), this._$Ei(), this.elementProperties.set(t, e), !e.noAccessor) {
68
+ static createProperty(t, e = K) {
69
+ if (e.state && (e.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((e = Object.create(e)).wrapped = !0), this.elementProperties.set(t, e), !e.noAccessor) {
80
70
  const s = Symbol(), i = this.getPropertyDescriptor(t, s, e);
81
- i !== void 0 && pt(this.prototype, t, i);
71
+ i !== void 0 && at(this.prototype, t, i);
82
72
  }
83
73
  }
84
74
  static getPropertyDescriptor(t, e, s) {
85
- const { get: i, set: n } = ut(this.prototype, t) ?? { get() {
75
+ const { get: i, set: o } = lt(this.prototype, t) ?? { get() {
86
76
  return this[e];
87
- }, set(r) {
88
- this[e] = r;
77
+ }, set(n) {
78
+ this[e] = n;
89
79
  } };
90
- return { get() {
91
- return i == null ? void 0 : i.call(this);
92
- }, set(r) {
93
- const a = i == null ? void 0 : i.call(this);
94
- n.call(this, r), this.requestUpdate(t, a, s);
80
+ return { get: i, set(n) {
81
+ const a = i?.call(this);
82
+ o?.call(this, n), this.requestUpdate(t, a, s);
95
83
  }, configurable: !0, enumerable: !0 };
96
84
  }
97
85
  static getPropertyOptions(t) {
98
- return this.elementProperties.get(t) ?? J;
86
+ return this.elementProperties.get(t) ?? K;
99
87
  }
100
88
  static _$Ei() {
101
89
  if (this.hasOwnProperty(w("elementProperties"))) return;
102
- const t = ft(this);
90
+ const t = pt(this);
103
91
  t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
104
92
  }
105
93
  static finalize() {
106
94
  if (this.hasOwnProperty(w("finalized"))) return;
107
95
  if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(w("properties"))) {
108
- const e = this.properties, s = [...$t(e), ..._t(e)];
96
+ const e = this.properties, s = [...ct(e), ...dt(e)];
109
97
  for (const i of s) this.createProperty(i, e[i]);
110
98
  }
111
99
  const t = this[Symbol.metadata];
@@ -124,8 +112,8 @@ class y extends HTMLElement {
124
112
  const e = [];
125
113
  if (Array.isArray(t)) {
126
114
  const s = new Set(t.flat(1 / 0).reverse());
127
- for (const i of s) e.unshift(Z(i));
128
- } else t !== void 0 && e.push(Z(t));
115
+ for (const i of s) e.unshift(W(i));
116
+ } else t !== void 0 && e.push(W(t));
129
117
  return e;
130
118
  }
131
119
  static _$Eu(t, e) {
@@ -136,16 +124,13 @@ class y extends HTMLElement {
136
124
  super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
137
125
  }
138
126
  _$Ev() {
139
- var t;
140
- this._$ES = new Promise((e) => this.enableUpdating = e), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), (t = this.constructor.l) == null || t.forEach((e) => e(this));
127
+ this._$ES = new Promise(((t) => this.enableUpdating = t)), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach(((t) => t(this)));
141
128
  }
142
129
  addController(t) {
143
- var e;
144
- (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(t), this.renderRoot !== void 0 && this.isConnected && ((e = t.hostConnected) == null || e.call(t));
130
+ (this._$EO ??= /* @__PURE__ */ new Set()).add(t), this.renderRoot !== void 0 && this.isConnected && t.hostConnected?.();
145
131
  }
146
132
  removeController(t) {
147
- var e;
148
- (e = this._$EO) == null || e.delete(t);
133
+ this._$EO?.delete(t);
149
134
  }
150
135
  _$E_() {
151
136
  const t = /* @__PURE__ */ new Map(), e = this.constructor.elementProperties;
@@ -154,54 +139,47 @@ class y extends HTMLElement {
154
139
  }
155
140
  createRenderRoot() {
156
141
  const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
157
- return ct(t, this.constructor.elementStyles), t;
142
+ return nt(t, this.constructor.elementStyles), t;
158
143
  }
159
144
  connectedCallback() {
160
- var t;
161
- this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (t = this._$EO) == null || t.forEach((e) => {
162
- var s;
163
- return (s = e.hostConnected) == null ? void 0 : s.call(e);
164
- });
145
+ this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach(((t) => t.hostConnected?.()));
165
146
  }
166
147
  enableUpdating(t) {
167
148
  }
168
149
  disconnectedCallback() {
169
- var t;
170
- (t = this._$EO) == null || t.forEach((e) => {
171
- var s;
172
- return (s = e.hostDisconnected) == null ? void 0 : s.call(e);
173
- });
150
+ this._$EO?.forEach(((t) => t.hostDisconnected?.()));
174
151
  }
175
152
  attributeChangedCallback(t, e, s) {
176
153
  this._$AK(t, s);
177
154
  }
178
- _$EC(t, e) {
179
- var n;
155
+ _$ET(t, e) {
180
156
  const s = this.constructor.elementProperties.get(t), i = this.constructor._$Eu(t, s);
181
157
  if (i !== void 0 && s.reflect === !0) {
182
- const r = (((n = s.converter) == null ? void 0 : n.toAttribute) !== void 0 ? s.converter : R).toAttribute(e, s.type);
183
- this._$Em = t, r == null ? this.removeAttribute(i) : this.setAttribute(i, r), this._$Em = null;
158
+ const o = (s.converter?.toAttribute !== void 0 ? s.converter : N).toAttribute(e, s.type);
159
+ this._$Em = t, o == null ? this.removeAttribute(i) : this.setAttribute(i, o), this._$Em = null;
184
160
  }
185
161
  }
186
162
  _$AK(t, e) {
187
- var n;
188
163
  const s = this.constructor, i = s._$Eh.get(t);
189
164
  if (i !== void 0 && this._$Em !== i) {
190
- const r = s.getPropertyOptions(i), a = typeof r.converter == "function" ? { fromAttribute: r.converter } : ((n = r.converter) == null ? void 0 : n.fromAttribute) !== void 0 ? r.converter : R;
191
- this._$Em = i, this[i] = a.fromAttribute(e, r.type), this._$Em = null;
165
+ const o = s.getPropertyOptions(i), n = typeof o.converter == "function" ? { fromAttribute: o.converter } : o.converter?.fromAttribute !== void 0 ? o.converter : N;
166
+ this._$Em = i;
167
+ const a = n.fromAttribute(e, o.type);
168
+ this[i] = a ?? this._$Ej?.get(i) ?? a, this._$Em = null;
192
169
  }
193
170
  }
194
171
  requestUpdate(t, e, s) {
195
172
  if (t !== void 0) {
196
- if (s ?? (s = this.constructor.getPropertyOptions(t)), !(s.hasChanged ?? W)(this[t], e)) return;
197
- this.P(t, e, s);
173
+ const i = this.constructor, o = this[t];
174
+ if (s ??= i.getPropertyOptions(t), !((s.hasChanged ?? D)(o, e) || s.useDefault && s.reflect && o === this._$Ej?.get(t) && !this.hasAttribute(i._$Eu(t, s)))) return;
175
+ this.C(t, e, s);
198
176
  }
199
- this.isUpdatePending === !1 && (this._$ES = this._$ET());
177
+ this.isUpdatePending === !1 && (this._$ES = this._$EP());
200
178
  }
201
- P(t, e, s) {
202
- this._$AL.has(t) || this._$AL.set(t, e), s.reflect === !0 && this._$Em !== t && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(t);
179
+ C(t, e, { useDefault: s, reflect: i, wrapped: o }, n) {
180
+ s && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(t) && (this._$Ej.set(t, n ?? e ?? this[t]), o !== !0 || n !== void 0) || (this._$AL.has(t) || (this.hasUpdated || s || (e = void 0), this._$AL.set(t, e)), i === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
203
181
  }
204
- async _$ET() {
182
+ async _$EP() {
205
183
  this.isUpdatePending = !0;
206
184
  try {
207
185
  await this._$ES;
@@ -215,38 +193,33 @@ class y extends HTMLElement {
215
193
  return this.performUpdate();
216
194
  }
217
195
  performUpdate() {
218
- var s;
219
196
  if (!this.isUpdatePending) return;
220
197
  if (!this.hasUpdated) {
221
- if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
222
- for (const [n, r] of this._$Ep) this[n] = r;
198
+ if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
199
+ for (const [i, o] of this._$Ep) this[i] = o;
223
200
  this._$Ep = void 0;
224
201
  }
225
- const i = this.constructor.elementProperties;
226
- if (i.size > 0) for (const [n, r] of i) r.wrapped !== !0 || this._$AL.has(n) || this[n] === void 0 || this.P(n, this[n], r);
202
+ const s = this.constructor.elementProperties;
203
+ if (s.size > 0) for (const [i, o] of s) {
204
+ const { wrapped: n } = o, a = this[i];
205
+ n !== !0 || this._$AL.has(i) || a === void 0 || this.C(i, void 0, o, a);
206
+ }
227
207
  }
228
208
  let t = !1;
229
209
  const e = this._$AL;
230
210
  try {
231
- t = this.shouldUpdate(e), t ? (this.willUpdate(e), (s = this._$EO) == null || s.forEach((i) => {
232
- var n;
233
- return (n = i.hostUpdate) == null ? void 0 : n.call(i);
234
- }), this.update(e)) : this._$EU();
235
- } catch (i) {
236
- throw t = !1, this._$EU(), i;
211
+ t = this.shouldUpdate(e), t ? (this.willUpdate(e), this._$EO?.forEach(((s) => s.hostUpdate?.())), this.update(e)) : this._$EM();
212
+ } catch (s) {
213
+ throw t = !1, this._$EM(), s;
237
214
  }
238
215
  t && this._$AE(e);
239
216
  }
240
217
  willUpdate(t) {
241
218
  }
242
219
  _$AE(t) {
243
- var e;
244
- (e = this._$EO) == null || e.forEach((s) => {
245
- var i;
246
- return (i = s.hostUpdated) == null ? void 0 : i.call(s);
247
- }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
220
+ this._$EO?.forEach(((e) => e.hostUpdated?.())), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
248
221
  }
249
- _$EU() {
222
+ _$EM() {
250
223
  this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
251
224
  }
252
225
  get updateComplete() {
@@ -259,83 +232,77 @@ class y extends HTMLElement {
259
232
  return !0;
260
233
  }
261
234
  update(t) {
262
- this._$Ej && (this._$Ej = this._$Ej.forEach((e) => this._$EC(e, this[e]))), this._$EU();
235
+ this._$Eq &&= this._$Eq.forEach(((e) => this._$ET(e, this[e]))), this._$EM();
263
236
  }
264
237
  updated(t) {
265
238
  }
266
239
  firstUpdated(t) {
267
240
  }
268
241
  }
269
- y.elementStyles = [], y.shadowRootOptions = { mode: "open" }, y[w("elementProperties")] = /* @__PURE__ */ new Map(), y[w("finalized")] = /* @__PURE__ */ new Map(), j == null || j({ ReactiveElement: y }), (f.reactiveElementVersions ?? (f.reactiveElementVersions = [])).push("2.0.4");
270
- /**
271
- * @license
272
- * Copyright 2017 Google LLC
273
- * SPDX-License-Identifier: BSD-3-Clause
274
- */
275
- const P = globalThis, k = P.trustedTypes, Q = k ? k.createPolicy("lit-html", { createHTML: (o) => o }) : void 0, rt = "$lit$", _ = `lit$${Math.random().toFixed(9).slice(2)}$`, nt = "?" + _, At = `<${nt}>`, g = document, C = () => g.createComment(""), x = (o) => o === null || typeof o != "object" && typeof o != "function", V = Array.isArray, gt = (o) => V(o) || typeof (o == null ? void 0 : o[Symbol.iterator]) == "function", L = `[
276
- \f\r]`, S = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, G = /-->/g, Y = />/g, m = RegExp(`>|${L}(?:([^\\s"'>=/]+)(${L}*=${L}*(?:[^
277
- \f\r"'\`<>=]|("|')|))|$)`, "g"), X = /'/g, tt = /"/g, ht = /^(?:script|style|textarea|title)$/i, yt = (o) => (t, ...e) => ({ _$litType$: o, strings: t, values: e }), vt = yt(1), v = Symbol.for("lit-noChange"), d = Symbol.for("lit-nothing"), et = /* @__PURE__ */ new WeakMap(), A = g.createTreeWalker(g, 129);
278
- function at(o, t) {
279
- if (!V(o) || !o.hasOwnProperty("raw")) throw Error("invalid template strings array");
280
- return Q !== void 0 ? Q.createHTML(t) : t;
242
+ y.elementStyles = [], y.shadowRootOptions = { mode: "open" }, y[w("elementProperties")] = /* @__PURE__ */ new Map(), y[w("finalized")] = /* @__PURE__ */ new Map(), $t?.({ ReactiveElement: y }), (k.reactiveElementVersions ??= []).push("2.1.1");
243
+ const L = globalThis, R = L.trustedTypes, Z = R ? R.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, et = "$lit$", f = `lit$${Math.random().toFixed(9).slice(2)}$`, st = "?" + f, ft = `<${st}>`, m = document, C = () => m.createComment(""), O = (r) => r === null || typeof r != "object" && typeof r != "function", I = Array.isArray, _t = (r) => I(r) || typeof r?.[Symbol.iterator] == "function", q = `[
244
+ \f\r]`, S = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, F = /-->/g, J = />/g, _ = RegExp(`>|${q}(?:([^\\s"'>=/]+)(${q}*=${q}*(?:[^
245
+ \f\r"'\`<>=]|("|')|))|$)`, "g"), Q = /'/g, G = /"/g, it = /^(?:script|style|textarea|title)$/i, gt = (r) => (t, ...e) => ({ _$litType$: r, strings: t, values: e }), mt = gt(1), v = Symbol.for("lit-noChange"), d = Symbol.for("lit-nothing"), Y = /* @__PURE__ */ new WeakMap(), g = m.createTreeWalker(m, 129);
246
+ function rt(r, t) {
247
+ if (!I(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
248
+ return Z !== void 0 ? Z.createHTML(t) : t;
281
249
  }
282
- const Et = (o, t) => {
283
- const e = o.length - 1, s = [];
284
- let i, n = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", r = S;
250
+ const At = (r, t) => {
251
+ const e = r.length - 1, s = [];
252
+ let i, o = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", n = S;
285
253
  for (let a = 0; a < e; a++) {
286
- const h = o[a];
254
+ const h = r[a];
287
255
  let c, p, l = -1, u = 0;
288
- for (; u < h.length && (r.lastIndex = u, p = r.exec(h), p !== null); ) u = r.lastIndex, r === S ? p[1] === "!--" ? r = G : p[1] !== void 0 ? r = Y : p[2] !== void 0 ? (ht.test(p[2]) && (i = RegExp("</" + p[2], "g")), r = m) : p[3] !== void 0 && (r = m) : r === m ? p[0] === ">" ? (r = i ?? S, l = -1) : p[1] === void 0 ? l = -2 : (l = r.lastIndex - p[2].length, c = p[1], r = p[3] === void 0 ? m : p[3] === '"' ? tt : X) : r === tt || r === X ? r = m : r === G || r === Y ? r = S : (r = m, i = void 0);
289
- const $ = r === m && o[a + 1].startsWith("/>") ? " " : "";
290
- n += r === S ? h + At : l >= 0 ? (s.push(c), h.slice(0, l) + rt + h.slice(l) + _ + $) : h + _ + (l === -2 ? a : $);
256
+ for (; u < h.length && (n.lastIndex = u, p = n.exec(h), p !== null); ) u = n.lastIndex, n === S ? p[1] === "!--" ? n = F : p[1] !== void 0 ? n = J : p[2] !== void 0 ? (it.test(p[2]) && (i = RegExp("</" + p[2], "g")), n = _) : p[3] !== void 0 && (n = _) : n === _ ? p[0] === ">" ? (n = i ?? S, l = -1) : p[1] === void 0 ? l = -2 : (l = n.lastIndex - p[2].length, c = p[1], n = p[3] === void 0 ? _ : p[3] === '"' ? G : Q) : n === G || n === Q ? n = _ : n === F || n === J ? n = S : (n = _, i = void 0);
257
+ const $ = n === _ && r[a + 1].startsWith("/>") ? " " : "";
258
+ o += n === S ? h + ft : l >= 0 ? (s.push(c), h.slice(0, l) + et + h.slice(l) + f + $) : h + f + (l === -2 ? a : $);
291
259
  }
292
- return [at(o, n + (o[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
260
+ return [rt(r, o + (r[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
293
261
  };
294
- class O {
262
+ class x {
295
263
  constructor({ strings: t, _$litType$: e }, s) {
296
264
  let i;
297
265
  this.parts = [];
298
- let n = 0, r = 0;
299
- const a = t.length - 1, h = this.parts, [c, p] = Et(t, e);
300
- if (this.el = O.createElement(c, s), A.currentNode = this.el.content, e === 2 || e === 3) {
266
+ let o = 0, n = 0;
267
+ const a = t.length - 1, h = this.parts, [c, p] = At(t, e);
268
+ if (this.el = x.createElement(c, s), g.currentNode = this.el.content, e === 2 || e === 3) {
301
269
  const l = this.el.content.firstChild;
302
270
  l.replaceWith(...l.childNodes);
303
271
  }
304
- for (; (i = A.nextNode()) !== null && h.length < a; ) {
272
+ for (; (i = g.nextNode()) !== null && h.length < a; ) {
305
273
  if (i.nodeType === 1) {
306
- if (i.hasAttributes()) for (const l of i.getAttributeNames()) if (l.endsWith(rt)) {
307
- const u = p[r++], $ = i.getAttribute(l).split(_), N = /([.?@])?(.*)/.exec(u);
308
- h.push({ type: 1, index: n, name: N[2], strings: $, ctor: N[1] === "." ? St : N[1] === "?" ? wt : N[1] === "@" ? Pt : q }), i.removeAttribute(l);
309
- } else l.startsWith(_) && (h.push({ type: 6, index: n }), i.removeAttribute(l));
310
- if (ht.test(i.tagName)) {
311
- const l = i.textContent.split(_), u = l.length - 1;
274
+ if (i.hasAttributes()) for (const l of i.getAttributeNames()) if (l.endsWith(et)) {
275
+ const u = p[n++], $ = i.getAttribute(l).split(f), T = /([.?@])?(.*)/.exec(u);
276
+ h.push({ type: 1, index: o, name: T[2], strings: $, ctor: T[1] === "." ? vt : T[1] === "?" ? Et : T[1] === "@" ? bt : j }), i.removeAttribute(l);
277
+ } else l.startsWith(f) && (h.push({ type: 6, index: o }), i.removeAttribute(l));
278
+ if (it.test(i.tagName)) {
279
+ const l = i.textContent.split(f), u = l.length - 1;
312
280
  if (u > 0) {
313
- i.textContent = k ? k.emptyScript : "";
314
- for (let $ = 0; $ < u; $++) i.append(l[$], C()), A.nextNode(), h.push({ type: 2, index: ++n });
281
+ i.textContent = R ? R.emptyScript : "";
282
+ for (let $ = 0; $ < u; $++) i.append(l[$], C()), g.nextNode(), h.push({ type: 2, index: ++o });
315
283
  i.append(l[u], C());
316
284
  }
317
285
  }
318
- } else if (i.nodeType === 8) if (i.data === nt) h.push({ type: 2, index: n });
286
+ } else if (i.nodeType === 8) if (i.data === st) h.push({ type: 2, index: o });
319
287
  else {
320
288
  let l = -1;
321
- for (; (l = i.data.indexOf(_, l + 1)) !== -1; ) h.push({ type: 7, index: n }), l += _.length - 1;
289
+ for (; (l = i.data.indexOf(f, l + 1)) !== -1; ) h.push({ type: 7, index: o }), l += f.length - 1;
322
290
  }
323
- n++;
291
+ o++;
324
292
  }
325
293
  }
326
294
  static createElement(t, e) {
327
- const s = g.createElement("template");
295
+ const s = m.createElement("template");
328
296
  return s.innerHTML = t, s;
329
297
  }
330
298
  }
331
- function E(o, t, e = o, s) {
332
- var r, a;
299
+ function E(r, t, e = r, s) {
333
300
  if (t === v) return t;
334
- let i = s !== void 0 ? (r = e.o) == null ? void 0 : r[s] : e.l;
335
- const n = x(t) ? void 0 : t._$litDirective$;
336
- return (i == null ? void 0 : i.constructor) !== n && ((a = i == null ? void 0 : i._$AO) == null || a.call(i, !1), n === void 0 ? i = void 0 : (i = new n(o), i._$AT(o, e, s)), s !== void 0 ? (e.o ?? (e.o = []))[s] = i : e.l = i), i !== void 0 && (t = E(o, i._$AS(o, t.values), i, s)), t;
301
+ let i = s !== void 0 ? e.o?.[s] : e.l;
302
+ const o = O(t) ? void 0 : t._$litDirective$;
303
+ return i?.constructor !== o && (i?._$AO?.(!1), o === void 0 ? i = void 0 : (i = new o(r), i._$AT(r, e, s)), s !== void 0 ? (e.o ??= [])[s] = i : e.l = i), i !== void 0 && (t = E(r, i._$AS(r, t.values), i, s)), t;
337
304
  }
338
- class bt {
305
+ class yt {
339
306
  constructor(t, e) {
340
307
  this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
341
308
  }
@@ -346,35 +313,34 @@ class bt {
346
313
  return this._$AM._$AU;
347
314
  }
348
315
  u(t) {
349
- const { el: { content: e }, parts: s } = this._$AD, i = ((t == null ? void 0 : t.creationScope) ?? g).importNode(e, !0);
350
- A.currentNode = i;
351
- let n = A.nextNode(), r = 0, a = 0, h = s[0];
316
+ const { el: { content: e }, parts: s } = this._$AD, i = (t?.creationScope ?? m).importNode(e, !0);
317
+ g.currentNode = i;
318
+ let o = g.nextNode(), n = 0, a = 0, h = s[0];
352
319
  for (; h !== void 0; ) {
353
- if (r === h.index) {
320
+ if (n === h.index) {
354
321
  let c;
355
- h.type === 2 ? c = new T(n, n.nextSibling, this, t) : h.type === 1 ? c = new h.ctor(n, h.name, h.strings, this, t) : h.type === 6 && (c = new Ut(n, this, t)), this._$AV.push(c), h = s[++a];
322
+ h.type === 2 ? c = new U(o, o.nextSibling, this, t) : h.type === 1 ? c = new h.ctor(o, h.name, h.strings, this, t) : h.type === 6 && (c = new St(o, this, t)), this._$AV.push(c), h = s[++a];
356
323
  }
357
- r !== (h == null ? void 0 : h.index) && (n = A.nextNode(), r++);
324
+ n !== h?.index && (o = g.nextNode(), n++);
358
325
  }
359
- return A.currentNode = g, i;
326
+ return g.currentNode = m, i;
360
327
  }
361
328
  p(t) {
362
329
  let e = 0;
363
330
  for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(t, s, e), e += s.strings.length - 2) : s._$AI(t[e])), e++;
364
331
  }
365
332
  }
366
- class T {
333
+ class U {
367
334
  get _$AU() {
368
- var t;
369
- return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this.v;
335
+ return this._$AM?._$AU ?? this.v;
370
336
  }
371
337
  constructor(t, e, s, i) {
372
- this.type = 2, this._$AH = d, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = i, this.v = (i == null ? void 0 : i.isConnected) ?? !0;
338
+ this.type = 2, this._$AH = d, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = i, this.v = i?.isConnected ?? !0;
373
339
  }
374
340
  get parentNode() {
375
341
  let t = this._$AA.parentNode;
376
342
  const e = this._$AM;
377
- return e !== void 0 && (t == null ? void 0 : t.nodeType) === 11 && (t = e.parentNode), t;
343
+ return e !== void 0 && t?.nodeType === 11 && (t = e.parentNode), t;
378
344
  }
379
345
  get startNode() {
380
346
  return this._$AA;
@@ -383,7 +349,7 @@ class T {
383
349
  return this._$AB;
384
350
  }
385
351
  _$AI(t, e = this) {
386
- t = E(this, t, e), x(t) ? t === d || t == null || t === "" ? (this._$AH !== d && this._$AR(), this._$AH = d) : t !== this._$AH && t !== v && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : gt(t) ? this.k(t) : this._(t);
352
+ t = E(this, t, e), O(t) ? t === d || t == null || t === "" ? (this._$AH !== d && this._$AR(), this._$AH = d) : t !== this._$AH && t !== v && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : _t(t) ? this.k(t) : this._(t);
387
353
  }
388
354
  O(t) {
389
355
  return this._$AA.parentNode.insertBefore(t, this._$AB);
@@ -392,66 +358,63 @@ class T {
392
358
  this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
393
359
  }
394
360
  _(t) {
395
- this._$AH !== d && x(this._$AH) ? this._$AA.nextSibling.data = t : this.T(g.createTextNode(t)), this._$AH = t;
361
+ this._$AH !== d && O(this._$AH) ? this._$AA.nextSibling.data = t : this.T(m.createTextNode(t)), this._$AH = t;
396
362
  }
397
363
  $(t) {
398
- var n;
399
- const { values: e, _$litType$: s } = t, i = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = O.createElement(at(s.h, s.h[0]), this.options)), s);
400
- if (((n = this._$AH) == null ? void 0 : n._$AD) === i) this._$AH.p(e);
364
+ const { values: e, _$litType$: s } = t, i = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = x.createElement(rt(s.h, s.h[0]), this.options)), s);
365
+ if (this._$AH?._$AD === i) this._$AH.p(e);
401
366
  else {
402
- const r = new bt(i, this), a = r.u(this.options);
403
- r.p(e), this.T(a), this._$AH = r;
367
+ const o = new yt(i, this), n = o.u(this.options);
368
+ o.p(e), this.T(n), this._$AH = o;
404
369
  }
405
370
  }
406
371
  _$AC(t) {
407
- let e = et.get(t.strings);
408
- return e === void 0 && et.set(t.strings, e = new O(t)), e;
372
+ let e = Y.get(t.strings);
373
+ return e === void 0 && Y.set(t.strings, e = new x(t)), e;
409
374
  }
410
375
  k(t) {
411
- V(this._$AH) || (this._$AH = [], this._$AR());
376
+ I(this._$AH) || (this._$AH = [], this._$AR());
412
377
  const e = this._$AH;
413
378
  let s, i = 0;
414
- for (const n of t) i === e.length ? e.push(s = new T(this.O(C()), this.O(C()), this, this.options)) : s = e[i], s._$AI(n), i++;
379
+ for (const o of t) i === e.length ? e.push(s = new U(this.O(C()), this.O(C()), this, this.options)) : s = e[i], s._$AI(o), i++;
415
380
  i < e.length && (this._$AR(s && s._$AB.nextSibling, i), e.length = i);
416
381
  }
417
382
  _$AR(t = this._$AA.nextSibling, e) {
418
- var s;
419
- for ((s = this._$AP) == null ? void 0 : s.call(this, !1, !0, e); t && t !== this._$AB; ) {
420
- const i = t.nextSibling;
421
- t.remove(), t = i;
383
+ for (this._$AP?.(!1, !0, e); t && t !== this._$AB; ) {
384
+ const s = t.nextSibling;
385
+ t.remove(), t = s;
422
386
  }
423
387
  }
424
388
  setConnected(t) {
425
- var e;
426
- this._$AM === void 0 && (this.v = t, (e = this._$AP) == null || e.call(this, t));
389
+ this._$AM === void 0 && (this.v = t, this._$AP?.(t));
427
390
  }
428
391
  }
429
- class q {
392
+ class j {
430
393
  get tagName() {
431
394
  return this.element.tagName;
432
395
  }
433
396
  get _$AU() {
434
397
  return this._$AM._$AU;
435
398
  }
436
- constructor(t, e, s, i, n) {
437
- this.type = 1, this._$AH = d, this._$AN = void 0, this.element = t, this.name = e, this._$AM = i, this.options = n, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = d;
399
+ constructor(t, e, s, i, o) {
400
+ this.type = 1, this._$AH = d, this._$AN = void 0, this.element = t, this.name = e, this._$AM = i, this.options = o, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = d;
438
401
  }
439
402
  _$AI(t, e = this, s, i) {
440
- const n = this.strings;
441
- let r = !1;
442
- if (n === void 0) t = E(this, t, e, 0), r = !x(t) || t !== this._$AH && t !== v, r && (this._$AH = t);
403
+ const o = this.strings;
404
+ let n = !1;
405
+ if (o === void 0) t = E(this, t, e, 0), n = !O(t) || t !== this._$AH && t !== v, n && (this._$AH = t);
443
406
  else {
444
407
  const a = t;
445
408
  let h, c;
446
- for (t = n[0], h = 0; h < n.length - 1; h++) c = E(this, a[s + h], e, h), c === v && (c = this._$AH[h]), r || (r = !x(c) || c !== this._$AH[h]), c === d ? t = d : t !== d && (t += (c ?? "") + n[h + 1]), this._$AH[h] = c;
409
+ for (t = o[0], h = 0; h < o.length - 1; h++) c = E(this, a[s + h], e, h), c === v && (c = this._$AH[h]), n ||= !O(c) || c !== this._$AH[h], c === d ? t = d : t !== d && (t += (c ?? "") + o[h + 1]), this._$AH[h] = c;
447
410
  }
448
- r && !i && this.j(t);
411
+ n && !i && this.j(t);
449
412
  }
450
413
  j(t) {
451
414
  t === d ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
452
415
  }
453
416
  }
454
- class St extends q {
417
+ class vt extends j {
455
418
  constructor() {
456
419
  super(...arguments), this.type = 3;
457
420
  }
@@ -459,7 +422,7 @@ class St extends q {
459
422
  this.element[this.name] = t === d ? void 0 : t;
460
423
  }
461
424
  }
462
- class wt extends q {
425
+ class Et extends j {
463
426
  constructor() {
464
427
  super(...arguments), this.type = 4;
465
428
  }
@@ -467,21 +430,20 @@ class wt extends q {
467
430
  this.element.toggleAttribute(this.name, !!t && t !== d);
468
431
  }
469
432
  }
470
- class Pt extends q {
471
- constructor(t, e, s, i, n) {
472
- super(t, e, s, i, n), this.type = 5;
433
+ class bt extends j {
434
+ constructor(t, e, s, i, o) {
435
+ super(t, e, s, i, o), this.type = 5;
473
436
  }
474
437
  _$AI(t, e = this) {
475
438
  if ((t = E(this, t, e, 0) ?? d) === v) return;
476
- const s = this._$AH, i = t === d && s !== d || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, n = t !== d && (s === d || i);
477
- i && this.element.removeEventListener(this.name, this, s), n && this.element.addEventListener(this.name, this, t), this._$AH = t;
439
+ const s = this._$AH, i = t === d && s !== d || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, o = t !== d && (s === d || i);
440
+ i && this.element.removeEventListener(this.name, this, s), o && this.element.addEventListener(this.name, this, t), this._$AH = t;
478
441
  }
479
442
  handleEvent(t) {
480
- var e;
481
- typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
443
+ typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, t) : this._$AH.handleEvent(t);
482
444
  }
483
445
  }
484
- class Ut {
446
+ class St {
485
447
  constructor(t, e, s) {
486
448
  this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = s;
487
449
  }
@@ -492,131 +454,118 @@ class Ut {
492
454
  E(this, t);
493
455
  }
494
456
  }
495
- const I = P.litHtmlPolyfillSupport;
496
- I == null || I(O, T), (P.litHtmlVersions ?? (P.litHtmlVersions = [])).push("3.2.0");
497
- const Ct = (o, t, e) => {
498
- const s = (e == null ? void 0 : e.renderBefore) ?? t;
457
+ const wt = L.litHtmlPolyfillSupport;
458
+ wt?.(x, U), (L.litHtmlVersions ??= []).push("3.2.0");
459
+ const Pt = (r, t, e) => {
460
+ const s = e?.renderBefore ?? t;
499
461
  let i = s._$litPart$;
500
462
  if (i === void 0) {
501
- const n = (e == null ? void 0 : e.renderBefore) ?? null;
502
- s._$litPart$ = i = new T(t.insertBefore(C(), n), n, void 0, e ?? {});
463
+ const o = e?.renderBefore ?? null;
464
+ s._$litPart$ = i = new U(t.insertBefore(C(), o), o, void 0, e ?? {});
503
465
  }
504
- return i._$AI(o), i;
466
+ return i._$AI(r), i;
505
467
  };
506
- /**
507
- * @license
508
- * Copyright 2017 Google LLC
509
- * SPDX-License-Identifier: BSD-3-Clause
510
- */
511
- class U extends y {
468
+ class P extends y {
512
469
  constructor() {
513
470
  super(...arguments), this.renderOptions = { host: this }, this.o = void 0;
514
471
  }
515
472
  createRenderRoot() {
516
- var e;
517
473
  const t = super.createRenderRoot();
518
- return (e = this.renderOptions).renderBefore ?? (e.renderBefore = t.firstChild), t;
474
+ return this.renderOptions.renderBefore ??= t.firstChild, t;
519
475
  }
520
476
  update(t) {
521
477
  const e = this.render();
522
- this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this.o = Ct(e, this.renderRoot, this.renderOptions);
478
+ this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this.o = Pt(e, this.renderRoot, this.renderOptions);
523
479
  }
524
480
  connectedCallback() {
525
- var t;
526
- super.connectedCallback(), (t = this.o) == null || t.setConnected(!0);
481
+ super.connectedCallback(), this.o?.setConnected(!0);
527
482
  }
528
483
  disconnectedCallback() {
529
- var t;
530
- super.disconnectedCallback(), (t = this.o) == null || t.setConnected(!1);
484
+ super.disconnectedCallback(), this.o?.setConnected(!1);
531
485
  }
532
486
  render() {
533
487
  return v;
534
488
  }
535
489
  }
536
- var st;
537
- U._$litElement$ = !0, U.finalized = !0, (st = globalThis.litElementHydrateSupport) == null || st.call(globalThis, { LitElement: U });
538
- const D = globalThis.litElementPolyfillSupport;
539
- D == null || D({ LitElement: U });
540
- (globalThis.litElementVersions ?? (globalThis.litElementVersions = [])).push("4.1.0");
541
- /**
542
- * @license
543
- * Copyright 2017 Google LLC
544
- * SPDX-License-Identifier: BSD-3-Clause
545
- */
546
- const xt = (o) => (t, e) => {
547
- e !== void 0 ? e.addInitializer(() => {
548
- customElements.define(o, t);
549
- }) : customElements.define(o, t);
490
+ P._$litElement$ = !0, P.finalized = !0, globalThis.litElementHydrateSupport?.({ LitElement: P });
491
+ const Ct = globalThis.litElementPolyfillSupport;
492
+ Ct?.({ LitElement: P });
493
+ (globalThis.litElementVersions ??= []).push("4.1.0");
494
+ const Ot = (r) => (t, e) => {
495
+ e !== void 0 ? e.addInitializer((() => {
496
+ customElements.define(r, t);
497
+ })) : customElements.define(r, t);
550
498
  };
551
- /**
552
- * @license
553
- * Copyright 2017 Google LLC
554
- * SPDX-License-Identifier: BSD-3-Clause
555
- */
556
- const Ot = { attribute: !0, type: String, converter: R, reflect: !1, hasChanged: W }, Tt = (o = Ot, t, e) => {
499
+ const xt = { attribute: !0, type: String, converter: N, reflect: !1, hasChanged: D }, Ut = (r = xt, t, e) => {
557
500
  const { kind: s, metadata: i } = e;
558
- let n = globalThis.litPropertyMetadata.get(i);
559
- if (n === void 0 && globalThis.litPropertyMetadata.set(i, n = /* @__PURE__ */ new Map()), n.set(e.name, o), s === "accessor") {
560
- const { name: r } = e;
501
+ let o = globalThis.litPropertyMetadata.get(i);
502
+ if (o === void 0 && globalThis.litPropertyMetadata.set(i, o = /* @__PURE__ */ new Map()), s === "setter" && ((r = Object.create(r)).wrapped = !0), o.set(e.name, r), s === "accessor") {
503
+ const { name: n } = e;
561
504
  return { set(a) {
562
505
  const h = t.get.call(this);
563
- t.set.call(this, a), this.requestUpdate(r, h, o);
506
+ t.set.call(this, a), this.requestUpdate(n, h, r);
564
507
  }, init(a) {
565
- return a !== void 0 && this.P(r, void 0, o), a;
508
+ return a !== void 0 && this.C(n, void 0, r, a), a;
566
509
  } };
567
510
  }
568
511
  if (s === "setter") {
569
- const { name: r } = e;
512
+ const { name: n } = e;
570
513
  return function(a) {
571
- const h = this[r];
572
- t.call(this, a), this.requestUpdate(r, h, o);
514
+ const h = this[n];
515
+ t.call(this, a), this.requestUpdate(n, h, r);
573
516
  };
574
517
  }
575
518
  throw Error("Unsupported decorator location: " + s);
576
519
  };
577
- function z(o) {
578
- return (t, e) => typeof e == "object" ? Tt(o, t, e) : ((s, i, n) => {
579
- const r = i.hasOwnProperty(n);
580
- return i.constructor.createProperty(n, r ? { ...s, wrapped: !0 } : s), r ? Object.getOwnPropertyDescriptor(i, n) : void 0;
581
- })(o, t, e);
520
+ function M(r) {
521
+ return (t, e) => typeof e == "object" ? Ut(r, t, e) : ((s, i, o) => {
522
+ const n = i.hasOwnProperty(o);
523
+ return i.constructor.createProperty(o, s), n ? Object.getOwnPropertyDescriptor(i, o) : void 0;
524
+ })(r, t, e);
582
525
  }
583
- const Ht = ":host{display:block;background:var(--ilw-quote--background)}#quote{margin:0 auto;max-width:var(--ilw-quote--max-width)}#content{color:var(--ilw-quote--color);position:relative}#content:before{content:var(--ilw-quote--mark-content-before);position:relative;font-style:normal;color:var(--ilw-quote--mark-color);font:var(--ilw-quote--mark-font);line-height:1;height:var(--ilw-quote--mark-height);top:var(--ilw-quote--mark-top);display:block}";
584
- var Nt = Object.defineProperty, Mt = Object.getOwnPropertyDescriptor, H = (o, t, e, s) => {
585
- for (var i = s > 1 ? void 0 : s ? Mt(t, e) : t, n = o.length - 1, r; n >= 0; n--)
586
- (r = o[n]) && (i = (s ? r(t, e, i) : r(i)) || i);
587
- return s && i && Nt(t, e, i), i;
526
+ const Mt = ":host{display:block;background:var(--ilw-color--background)}#quote{margin:0 auto;max-width:var(--ilw-quote--max-width)}#content{color:var(--ilw-color--heading);position:relative}#content:before{content:var(--ilw-quote--mark-content-before);position:relative;font-style:normal;color:var(--ilw-color--control-accent);font:var(--ilw-quote--mark-font);line-height:1;height:var(--ilw-quote--mark-height);top:var(--ilw-quote--mark-top);display:block}";
527
+ var Tt = Object.defineProperty, Ht = Object.getOwnPropertyDescriptor, b = (r, t, e, s) => {
528
+ for (var i = s > 1 ? void 0 : s ? Ht(t, e) : t, o = r.length - 1, n; o >= 0; o--)
529
+ (n = r[o]) && (i = (s ? n(t, e, i) : n(i)) || i);
530
+ return s && i && Tt(t, e, i), i;
588
531
  };
589
- let b = class extends U {
532
+ let A = class extends P {
590
533
  constructor() {
591
- super(), this.theme = "", this.align = "center", this.size = "small", this.font = "serif";
534
+ super(), this.theme = "", this.align = "center", this.size = "small", this.font = "serif", this.padding = "";
592
535
  }
593
536
  static get styles() {
594
- return ot(Ht);
537
+ return tt(Mt);
538
+ }
539
+ get paddingStyle() {
540
+ return this.padding == "" ? "padding: 1rem 0;" : "padding: " + this.padding + ";";
595
541
  }
596
542
  render() {
597
- return vt`
598
- <blockquote id="quote">
543
+ return mt`
544
+ <blockquote id="quote" style="${this.paddingStyle}">
599
545
  <div id="content"><slot name="content"></slot></div>
600
546
  <div id="source"><slot name="author"></slot><slot name="source"></slot></div>
601
547
  </blockquote>
602
548
  `;
603
549
  }
604
550
  };
605
- H([
606
- z()
607
- ], b.prototype, "theme", 2);
608
- H([
609
- z()
610
- ], b.prototype, "align", 2);
611
- H([
612
- z()
613
- ], b.prototype, "size", 2);
614
- H([
615
- z()
616
- ], b.prototype, "font", 2);
617
- b = H([
618
- xt("ilw-quote")
619
- ], b);
551
+ b([
552
+ M()
553
+ ], A.prototype, "theme", 2);
554
+ b([
555
+ M()
556
+ ], A.prototype, "align", 2);
557
+ b([
558
+ M()
559
+ ], A.prototype, "size", 2);
560
+ b([
561
+ M()
562
+ ], A.prototype, "font", 2);
563
+ b([
564
+ M()
565
+ ], A.prototype, "padding", 2);
566
+ A = b([
567
+ Ot("ilw-quote")
568
+ ], A);
620
569
  export {
621
- b as default
570
+ A as default
622
571
  };
@@ -1 +1 @@
1
- @layer base{:root{--ilw-quote--background: white;--ilw-quote--color: var(--il-blue);--ilw-quote--author-color: var(--il-orange);--ilw-quote--source-color: var(--il-blue);--ilw-quote--mark-color: var(--il-orange);--ilw-quote--margin: 1rem 0;--ilw-quote--padding: 0 0 1em 0;--ilw-quote--base-font-size: .875rem;--ilw-quote--font: var(--il-font-sans);--ilw-quote--font-serif: var(--il-font-serif);--ilw-quote--font-weight: 600;--ilw-quote--font-size: 1.625em;--ilw-quote--line-height: 1.35;--ilw-quote--author-font-weight: 700;--ilw-quote--author-font-size: 1.625em;--ilw-quote--author-line-height: 1.1;--ilw-quote--source-font-weight: 400;--ilw-quote--source-font-size: 1.428em;--ilw-quote--source-line-height: 1.35;--ilw-quote--mark-font: 9.5em/0 var(--il-font-serif);--ilw-quote--mark-height: .4em;--ilw-quote--mark-top: -10px;--ilw-quote--mark-content-before: "“";--ilw-quote--mark-content-after: "”";--ilw-quote--max-width: 620px;--ilw-quote--border: 6px solid var(--il-orange)}ilw-quote{font-family:var(--ilw-quote--font);font-size:var(--ilw-quote--base-font-size);text-align:center;margin:var(--ilw-quote--margin);padding:var(--ilw-quote--padding)}ilw-quote[theme=blue]{--ilw-quote--background: var(--il-blue);--ilw-quote--color: white;--ilw-quote--author-color: var(--il-orange);--ilw-quote--source-color: white;--ilw-quote--mark-color: var(--il-orange)}ilw-quote[theme=gray]{--ilw-quote--background: var(--il-storm-lighter-4);--ilw-quote--author-color: var(--il-altgeld);--ilw-quote--mark-color: var(--il-altgeld)}ilw-quote[align=left]{text-align:left;border-left:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-left:3.125em}ilw-quote[align=right]{text-align:right;border-right:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-right:3.125em}ilw-quote[size=medium]{--ilw-quote--base-font-size: 1rem}ilw-quote[size=large]{--ilw-quote--base-font-size: 1.154rem}}.ilw-quote--exclude-marks{--ilw-quote--mark-content-before: none;--ilw-quote--mark-content-after: none}ilw-quote *[slot=content]{font-weight:var(--ilw-quote--font-weight);font-size:var(--ilw-quote--font-size);line-height:var(--ilw-quote--line-height)}ilw-quote[font=serif] *[slot=content]{font-family:var(--ilw-quote--font-serif);--ilw-quote--font-weight: 400}ilw-quote *[slot=author]{margin-top:1.8em;margin-bottom:.5em;color:var(--ilw-quote--author-color);font-weight:var(--ilw-quote--author-font-weight);font-size:var(--ilw-quote--author-font-size);line-height:var(--ilw-quote--author-line-height)}ilw-quote *[slot=source]{margin:0;color:var(--ilw-quote--source-color);font-style:inherit;font-weight:var(--ilw-quote--source-font-weight);font-size:var(--ilw-quote--source-font-size);line-height:var(--ilw-quote--source-line-height);display:block}
1
+ @layer base{:root{--ilw-quote--margin: 1rem 0;--ilw-quote--base-font-size: .875rem;--ilw-quote--font: var(--il-font-sans);--ilw-quote--font-serif: var(--il-font-serif);--ilw-quote--font-weight: 600;--ilw-quote--font-size: 1.625em;--ilw-quote--line-height: 1.35;--ilw-quote--author-font-weight: 700;--ilw-quote--author-font-size: 1.625em;--ilw-quote--author-line-height: 1.1;--ilw-quote--source-font-weight: 400;--ilw-quote--source-font-size: 1.428em;--ilw-quote--source-line-height: 1.35;--ilw-quote--mark-font: 9.5em/0 var(--il-font-serif);--ilw-quote--mark-height: .4em;--ilw-quote--mark-top: -10px;--ilw-quote--mark-content-before: "“";--ilw-quote--mark-content-after: "”";--ilw-quote--max-width: 620px;--ilw-quote--border: 6px solid var(--ilw-color--control-accent)}ilw-quote{font-family:var(--ilw-quote--font);font-size:var(--ilw-quote--base-font-size);text-align:center;margin:var(--ilw-quote--margin)}ilw-quote[align=left]{text-align:left;border-left:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-left:3.125em}ilw-quote[align=right]{text-align:right;border-right:var(--ilw-quote--border);--ilw-quote--max-width: none;padding-right:3.125em}ilw-quote[size=medium]{--ilw-quote--base-font-size: 1rem}ilw-quote[size=large]{--ilw-quote--base-font-size: 1.154rem}}.ilw-quote--exclude-marks{--ilw-quote--mark-content-before: none;--ilw-quote--mark-content-after: none}ilw-quote *[slot=content]{font-weight:var(--ilw-quote--font-weight);font-size:var(--ilw-quote--font-size);line-height:var(--ilw-quote--line-height)}ilw-quote[font=serif] *[slot=content]{font-family:var(--ilw-quote--font-serif);--ilw-quote--font-weight: 400}ilw-quote *[slot=author]{margin-top:1.8em;margin-bottom:.5em;color:var(--ilw-color--control-accent);font-weight:var(--ilw-quote--author-font-weight);font-size:var(--ilw-quote--author-font-size);line-height:var(--ilw-quote--author-line-height)}ilw-quote *[slot=source]{margin:0;color:var(--ilw-color--heading);font-style:inherit;font-weight:var(--ilw-quote--source-font-weight);font-size:var(--ilw-quote--source-font-size);line-height:var(--ilw-quote--source-line-height);display:block}
@@ -4,8 +4,10 @@ export default class Quote extends LitElement {
4
4
  align: "left" | "right" | "center";
5
5
  size: "small" | "medium" | "large";
6
6
  font: "sans" | "serif";
7
+ padding: string;
7
8
  static get styles(): import('lit').CSSResult;
8
9
  constructor();
10
+ get paddingStyle(): string;
9
11
  render(): import('lit-html').TemplateResult<1>;
10
12
  }
11
13
  declare global {
@@ -1 +1 @@
1
- {"version":3,"file":"ilw-quote.d.ts","sourceRoot":"","sources":["../src/ilw-quote.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,iBAAiB,CAAC;AAGzB,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,UAAU;IAEzC,KAAK,EAAE,MAAM,CAAM;IAGnB,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAY;IAG9C,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAG7C,IAAI,EAAE,MAAM,GAAG,OAAO,CAAW;IAEjC,MAAM,KAAK,MAAM,4BAEhB;;IAMD,MAAM;CAQT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,WAAW,EAAE,KAAK,CAAC;KACtB;CACJ"}
1
+ {"version":3,"file":"ilw-quote.d.ts","sourceRoot":"","sources":["../src/ilw-quote.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,iBAAiB,CAAC;AAGzB,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,UAAU;IAEzC,KAAK,EAAE,MAAM,CAAM;IAGnB,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAY;IAG9C,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAW;IAG7C,IAAI,EAAE,MAAM,GAAG,OAAO,CAAW;IAGjC,OAAO,EAAE,MAAM,CAAM;IAErB,MAAM,KAAK,MAAM,4BAEhB;;IAMD,IAAI,YAAY,WAEf;IAED,MAAM;CAQT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,WAAW,EAAE,KAAK,CAAC;KACtB;CACJ"}
package/dist/ilw-quote.js CHANGED
@@ -1,42 +1,48 @@
1
- import { LitElement as c, unsafeCSS as p, html as m } from "lit";
2
- import { property as i, customElement as v } from "lit/decorators.js";
3
- const h = ":host{display:block;background:var(--ilw-quote--background)}#quote{margin:0 auto;max-width:var(--ilw-quote--max-width)}#content{color:var(--ilw-quote--color);position:relative}#content:before{content:var(--ilw-quote--mark-content-before);position:relative;font-style:normal;color:var(--ilw-quote--mark-color);font:var(--ilw-quote--mark-font);line-height:1;height:var(--ilw-quote--mark-height);top:var(--ilw-quote--mark-top);display:block}";
4
- var f = Object.defineProperty, d = Object.getOwnPropertyDescriptor, e = (u, r, n, l) => {
5
- for (var t = l > 1 ? void 0 : l ? d(r, n) : r, s = u.length - 1, a; s >= 0; s--)
6
- (a = u[s]) && (t = (l ? a(r, n, t) : a(t)) || t);
7
- return l && t && f(r, n, t), t;
1
+ import { LitElement as c, unsafeCSS as d, html as u } from "lit";
2
+ import { property as r, customElement as h } from "lit/decorators.js";
3
+ const m = ":host{display:block;background:var(--ilw-color--background)}#quote{margin:0 auto;max-width:var(--ilw-quote--max-width)}#content{color:var(--ilw-color--heading);position:relative}#content:before{content:var(--ilw-quote--mark-content-before);position:relative;font-style:normal;color:var(--ilw-color--control-accent);font:var(--ilw-quote--mark-font);line-height:1;height:var(--ilw-quote--mark-height);top:var(--ilw-quote--mark-top);display:block}";
4
+ var v = Object.defineProperty, g = Object.getOwnPropertyDescriptor, o = (p, i, l, n) => {
5
+ for (var t = n > 1 ? void 0 : n ? g(i, l) : i, a = p.length - 1, s; a >= 0; a--)
6
+ (s = p[a]) && (t = (n ? s(i, l, t) : s(t)) || t);
7
+ return n && t && v(i, l, t), t;
8
8
  };
9
- let o = class extends c {
9
+ let e = class extends c {
10
10
  constructor() {
11
- super(), this.theme = "", this.align = "center", this.size = "small", this.font = "serif";
11
+ super(), this.theme = "", this.align = "center", this.size = "small", this.font = "serif", this.padding = "";
12
12
  }
13
13
  static get styles() {
14
- return p(h);
14
+ return d(m);
15
+ }
16
+ get paddingStyle() {
17
+ return this.padding == "" ? "padding: 1rem 0;" : "padding: " + this.padding + ";";
15
18
  }
16
19
  render() {
17
- return m`
18
- <blockquote id="quote">
20
+ return u`
21
+ <blockquote id="quote" style="${this.paddingStyle}">
19
22
  <div id="content"><slot name="content"></slot></div>
20
23
  <div id="source"><slot name="author"></slot><slot name="source"></slot></div>
21
24
  </blockquote>
22
25
  `;
23
26
  }
24
27
  };
25
- e([
26
- i()
27
- ], o.prototype, "theme", 2);
28
- e([
29
- i()
30
- ], o.prototype, "align", 2);
31
- e([
32
- i()
33
- ], o.prototype, "size", 2);
34
- e([
35
- i()
36
- ], o.prototype, "font", 2);
37
- o = e([
38
- v("ilw-quote")
39
- ], o);
28
+ o([
29
+ r()
30
+ ], e.prototype, "theme", 2);
31
+ o([
32
+ r()
33
+ ], e.prototype, "align", 2);
34
+ o([
35
+ r()
36
+ ], e.prototype, "size", 2);
37
+ o([
38
+ r()
39
+ ], e.prototype, "font", 2);
40
+ o([
41
+ r()
42
+ ], e.prototype, "padding", 2);
43
+ e = o([
44
+ h("ilw-quote")
45
+ ], e);
40
46
  export {
41
- o as default
47
+ e as default
42
48
  };
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "repository": "github:web-illinois/ilw-quote",
5
5
  "private": false,
6
6
  "license": "MIT",
7
- "version": "1.1.0",
7
+ "version": "1.2.1",
8
8
  "type": "module",
9
9
  "files": [
10
10
  "src/**",
@@ -25,18 +25,29 @@
25
25
  "module": "./dist/ilw-quote.js",
26
26
  "scripts": {
27
27
  "dev": "vite",
28
- "build": "vite build --config vite.transpile.config.js --emptyOutDir && vite build --config vite.build.config.js --emptyOutDir",
28
+ "build": "tsc --noEmit && vite build --config vite.transpile.config.ts --emptyOutDir && vite build --config vite.build.config.ts --emptyOutDir",
29
29
  "preview": "vite preview",
30
- "prepack": "npm run build"
30
+ "prepack": "npm run build",
31
+ "test:axe": "playwright test",
32
+ "test:axe:github": "playwright test --config playwright.ci.config.ts",
33
+ "test": "vitest run --browser.headless",
34
+ "test:browser": "vitest browser --browser chromium"
31
35
  },
32
36
  "dependencies": {
37
+ "@lit/context": "1.1.6",
33
38
  "lit": "3.1.3"
34
39
  },
35
40
  "devDependencies": {
36
- "prettier": "^3.5.1",
37
- "typescript": "^5.7.3",
38
- "vite": "^5.4.14",
39
- "vite-plugin-dts": "^4.5.0",
40
- "@types/node": "^22.13.4"
41
+ "@axe-core/playwright": "^4.10.2",
42
+ "@playwright/test": "^1.54.1",
43
+ "@vitest/browser": "^3.2.4",
44
+ "axe-html-reporter": "^2.2.11",
45
+ "@illinois-toolkit/ilw-core": "^1.0.3",
46
+ "playwright": "^1.54.1",
47
+ "prettier": "^3.6.2",
48
+ "typescript": "^5.8.3",
49
+ "vite": "^7.0.5",
50
+ "vite-plugin-dts": "^4.5.4",
51
+ "vitest-browser-lit": "^0.1.0"
41
52
  }
42
- }
53
+ }
package/src/ilw-quote.css CHANGED
@@ -1,13 +1,7 @@
1
1
 
2
2
  @layer base {
3
3
  :root {
4
- --ilw-quote--background: white;
5
- --ilw-quote--color: var(--il-blue);
6
- --ilw-quote--author-color: var(--il-orange);
7
- --ilw-quote--source-color: var(--il-blue);
8
- --ilw-quote--mark-color: var(--il-orange);
9
4
  --ilw-quote--margin: 1rem 0;
10
- --ilw-quote--padding: 0 0 1em 0;
11
5
  --ilw-quote--base-font-size: 0.875rem;
12
6
  --ilw-quote--font: var(--il-font-sans);
13
7
  --ilw-quote--font-serif: var(--il-font-serif);
@@ -26,7 +20,7 @@
26
20
  --ilw-quote--mark-content-before: "“";
27
21
  --ilw-quote--mark-content-after: "”";
28
22
  --ilw-quote--max-width: 620px;
29
- --ilw-quote--border: 6px solid var(--il-orange);
23
+ --ilw-quote--border: 6px solid var(--ilw-color--control-accent);
30
24
  }
31
25
 
32
26
  ilw-quote {
@@ -34,21 +28,6 @@
34
28
  font-size: var(--ilw-quote--base-font-size);
35
29
  text-align: center;
36
30
  margin: var(--ilw-quote--margin);
37
- padding: var(--ilw-quote--padding);
38
-
39
- &[theme="blue"] {
40
- --ilw-quote--background: var(--il-blue);
41
- --ilw-quote--color: white;
42
- --ilw-quote--author-color: var(--il-orange);
43
- --ilw-quote--source-color: white;
44
- --ilw-quote--mark-color: var(--il-orange);
45
- }
46
-
47
- &[theme="gray"] {
48
- --ilw-quote--background: var(--il-storm-lighter-4);
49
- --ilw-quote--author-color: var(--il-altgeld);
50
- --ilw-quote--mark-color: var(--il-altgeld);
51
- }
52
31
 
53
32
  &[align=left] {
54
33
  text-align: left;
@@ -93,7 +72,7 @@ ilw-quote[font=serif] *[slot=content] {
93
72
  ilw-quote *[slot=author] {
94
73
  margin-top: 1.8em;
95
74
  margin-bottom: 0.5em;
96
- color: var(--ilw-quote--author-color);
75
+ color: var(--ilw-color--control-accent);
97
76
  font-weight: var(--ilw-quote--author-font-weight);
98
77
  font-size: var(--ilw-quote--author-font-size);
99
78
  line-height: var(--ilw-quote--author-line-height);
@@ -101,7 +80,7 @@ ilw-quote *[slot=author] {
101
80
 
102
81
  ilw-quote *[slot=source] {
103
82
  margin: 0;
104
- color: var(--ilw-quote--source-color);
83
+ color: var(--ilw-color--heading);
105
84
  font-style: inherit;
106
85
  font-weight: var(--ilw-quote--source-font-weight);
107
86
  font-size: var(--ilw-quote--source-font-size);
@@ -1,6 +1,6 @@
1
1
  :host {
2
2
  display: block;
3
- background: var(--ilw-quote--background);
3
+ background: var(--ilw-color--background);
4
4
  }
5
5
 
6
6
  #quote {
@@ -9,7 +9,7 @@
9
9
  }
10
10
 
11
11
  #content {
12
- color: var(--ilw-quote--color);
12
+ color: var(--ilw-color--heading);
13
13
  position: relative;
14
14
  }
15
15
 
@@ -17,7 +17,7 @@
17
17
  content: var(--ilw-quote--mark-content-before);
18
18
  position: relative;
19
19
  font-style: normal;
20
- color: var(--ilw-quote--mark-color);
20
+ color: var(--ilw-color--control-accent);
21
21
  font: var(--ilw-quote--mark-font);
22
22
  line-height: 1;
23
23
  height: var(--ilw-quote--mark-height);
package/src/ilw-quote.ts CHANGED
@@ -18,6 +18,9 @@ export default class Quote extends LitElement {
18
18
  @property()
19
19
  font: "sans" | "serif" = "serif";
20
20
 
21
+ @property()
22
+ padding: string = '';
23
+
21
24
  static get styles() {
22
25
  return unsafeCSS(styles);
23
26
  }
@@ -26,9 +29,13 @@ export default class Quote extends LitElement {
26
29
  super();
27
30
  }
28
31
 
32
+ get paddingStyle() {
33
+ return this.padding == '' ? 'padding: 1rem 0;' : 'padding: ' + this.padding + ';';
34
+ }
35
+
29
36
  render() {
30
37
  return html`
31
- <blockquote id="quote">
38
+ <blockquote id="quote" style="${this.paddingStyle}">
32
39
  <div id="content"><slot name="content"></slot></div>
33
40
  <div id="source"><slot name="author"></slot><slot name="source"></slot></div>
34
41
  </blockquote>