@illinois-toolkit/ilw-quote 1.2.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",
9
+ "toolkit-version": "1.2",
10
10
  "production-version": "1.2",
11
- "development-version": "1.0-beta"
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": "",
@@ -31,7 +31,14 @@
31
31
  }
32
32
  ],
33
33
  "attributes-fixed": [],
34
- "attributes-text": [],
34
+ "attributes-text": [
35
+ {
36
+ "name": "padding",
37
+ "description": "Padding of the text inside the component",
38
+ "depreciated": false,
39
+ "value": ""
40
+ }
41
+ ],
35
42
  "attributes": [
36
43
  {
37
44
  "name": "theme",
@@ -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--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(--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);padding:var(--ilw-quote--padding)}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
+ @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,4 +1,4 @@
1
- const T = globalThis, z = T.ShadowRoot && (T.ShadyCSS === void 0 || T.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, X = Symbol(), B = /* @__PURE__ */ new WeakMap();
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
2
  let ot = class {
3
3
  constructor(t, e, s) {
4
4
  if (this._$cssResult$ = !0, s !== X) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
@@ -20,7 +20,7 @@ let ot = class {
20
20
  const tt = (r) => new ot(typeof r == "string" ? r : r + "", void 0, X), nt = (r, t) => {
21
21
  if (z) r.adoptedStyleSheets = t.map(((e) => e instanceof CSSStyleSheet ? e : e.styleSheet));
22
22
  else for (const e of t) {
23
- const s = document.createElement("style"), i = T.litNonce;
23
+ const s = document.createElement("style"), i = H.litNonce;
24
24
  i !== void 0 && s.setAttribute("nonce", i), s.textContent = e.cssText, r.appendChild(s);
25
25
  }
26
26
  }, W = z ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((t) => {
@@ -28,7 +28,7 @@ const tt = (r) => new ot(typeof r == "string" ? r : r + "", void 0, X), nt = (r,
28
28
  for (const s of t.cssRules) e += s.cssText;
29
29
  return tt(e);
30
30
  })(r) : r;
31
- const { is: ht, defineProperty: at, getOwnPropertyDescriptor: lt, getOwnPropertyNames: ct, getOwnPropertySymbols: dt, getPrototypeOf: pt } = Object, R = globalThis, V = R.trustedTypes, ut = V ? V.emptyScript : "", $t = R.reactiveElementPolyfillSupport, S = (r, t) => r, H = { toAttribute(r, t) {
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) {
32
32
  switch (t) {
33
33
  case Boolean:
34
34
  r = r ? ut : null;
@@ -56,9 +56,9 @@ const { is: ht, defineProperty: at, getOwnPropertyDescriptor: lt, getOwnProperty
56
56
  }
57
57
  }
58
58
  return e;
59
- } }, D = (r, t) => !ht(r, t), K = { attribute: !0, type: String, converter: H, reflect: !1, useDefault: !1, hasChanged: D };
60
- Symbol.metadata ??= Symbol("metadata"), R.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
61
- class g extends HTMLElement {
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();
61
+ class y extends HTMLElement {
62
62
  static addInitializer(t) {
63
63
  this._$Ei(), (this.l ??= []).push(t);
64
64
  }
@@ -86,13 +86,13 @@ class g extends HTMLElement {
86
86
  return this.elementProperties.get(t) ?? K;
87
87
  }
88
88
  static _$Ei() {
89
- if (this.hasOwnProperty(S("elementProperties"))) return;
89
+ if (this.hasOwnProperty(w("elementProperties"))) return;
90
90
  const t = pt(this);
91
91
  t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
92
92
  }
93
93
  static finalize() {
94
- if (this.hasOwnProperty(S("finalized"))) return;
95
- if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(S("properties"))) {
94
+ if (this.hasOwnProperty(w("finalized"))) return;
95
+ if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(w("properties"))) {
96
96
  const e = this.properties, s = [...ct(e), ...dt(e)];
97
97
  for (const i of s) this.createProperty(i, e[i]);
98
98
  }
@@ -155,14 +155,14 @@ class g extends HTMLElement {
155
155
  _$ET(t, e) {
156
156
  const s = this.constructor.elementProperties.get(t), i = this.constructor._$Eu(t, s);
157
157
  if (i !== void 0 && s.reflect === !0) {
158
- const o = (s.converter?.toAttribute !== void 0 ? s.converter : H).toAttribute(e, s.type);
158
+ const o = (s.converter?.toAttribute !== void 0 ? s.converter : N).toAttribute(e, s.type);
159
159
  this._$Em = t, o == null ? this.removeAttribute(i) : this.setAttribute(i, o), this._$Em = null;
160
160
  }
161
161
  }
162
162
  _$AK(t, e) {
163
163
  const s = this.constructor, i = s._$Eh.get(t);
164
164
  if (i !== void 0 && this._$Em !== i) {
165
- const o = s.getPropertyOptions(i), n = typeof o.converter == "function" ? { fromAttribute: o.converter } : o.converter?.fromAttribute !== void 0 ? o.converter : H;
165
+ const o = s.getPropertyOptions(i), n = typeof o.converter == "function" ? { fromAttribute: o.converter } : o.converter?.fromAttribute !== void 0 ? o.converter : N;
166
166
  this._$Em = i;
167
167
  const a = n.fromAttribute(e, o.type);
168
168
  this[i] = a ?? this._$Ej?.get(i) ?? a, this._$Em = null;
@@ -239,48 +239,48 @@ class g extends HTMLElement {
239
239
  firstUpdated(t) {
240
240
  }
241
241
  }
242
- g.elementStyles = [], g.shadowRootOptions = { mode: "open" }, g[S("elementProperties")] = /* @__PURE__ */ new Map(), g[S("finalized")] = /* @__PURE__ */ new Map(), $t?.({ ReactiveElement: g }), (R.reactiveElementVersions ??= []).push("2.1.1");
243
- const L = globalThis, N = L.trustedTypes, Z = N ? N.createPolicy("lit-html", { createHTML: (r) => r }) : void 0, et = "$lit$", f = `lit$${Math.random().toFixed(9).slice(2)}$`, st = "?" + f, ft = `<${st}>`, A = document, P = () => A.createComment(""), C = (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]`, b = /<(?:(!--|\/[^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, mt = (r) => (t, ...e) => ({ _$litType$: r, strings: t, values: e }), At = mt(1), y = Symbol.for("lit-noChange"), d = Symbol.for("lit-nothing"), Y = /* @__PURE__ */ new WeakMap(), m = A.createTreeWalker(A, 129);
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
246
  function rt(r, t) {
247
247
  if (!I(r) || !r.hasOwnProperty("raw")) throw Error("invalid template strings array");
248
248
  return Z !== void 0 ? Z.createHTML(t) : t;
249
249
  }
250
- const gt = (r, t) => {
250
+ const At = (r, t) => {
251
251
  const e = r.length - 1, s = [];
252
- let i, o = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", n = b;
252
+ let i, o = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", n = S;
253
253
  for (let a = 0; a < e; a++) {
254
254
  const h = r[a];
255
255
  let c, p, l = -1, u = 0;
256
- for (; u < h.length && (n.lastIndex = u, p = n.exec(h), p !== null); ) u = n.lastIndex, n === b ? 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 ?? b, 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 = b : (n = _, i = void 0);
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
257
  const $ = n === _ && r[a + 1].startsWith("/>") ? " " : "";
258
- o += n === b ? h + ft : l >= 0 ? (s.push(c), h.slice(0, l) + et + h.slice(l) + f + $) : h + f + (l === -2 ? a : $);
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 : $);
259
259
  }
260
260
  return [rt(r, o + (r[e] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
261
261
  };
262
- class O {
262
+ class x {
263
263
  constructor({ strings: t, _$litType$: e }, s) {
264
264
  let i;
265
265
  this.parts = [];
266
266
  let o = 0, n = 0;
267
- const a = t.length - 1, h = this.parts, [c, p] = gt(t, e);
268
- if (this.el = O.createElement(c, s), m.currentNode = this.el.content, e === 2 || e === 3) {
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) {
269
269
  const l = this.el.content.firstChild;
270
270
  l.replaceWith(...l.childNodes);
271
271
  }
272
- for (; (i = m.nextNode()) !== null && h.length < a; ) {
272
+ for (; (i = g.nextNode()) !== null && h.length < a; ) {
273
273
  if (i.nodeType === 1) {
274
274
  if (i.hasAttributes()) for (const l of i.getAttributeNames()) if (l.endsWith(et)) {
275
- const u = p[n++], $ = i.getAttribute(l).split(f), M = /([.?@])?(.*)/.exec(u);
276
- h.push({ type: 1, index: o, name: M[2], strings: $, ctor: M[1] === "." ? vt : M[1] === "?" ? Et : M[1] === "@" ? bt : k }), i.removeAttribute(l);
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
277
  } else l.startsWith(f) && (h.push({ type: 6, index: o }), i.removeAttribute(l));
278
278
  if (it.test(i.tagName)) {
279
279
  const l = i.textContent.split(f), u = l.length - 1;
280
280
  if (u > 0) {
281
- i.textContent = N ? N.emptyScript : "";
282
- for (let $ = 0; $ < u; $++) i.append(l[$], P()), m.nextNode(), h.push({ type: 2, index: ++o });
283
- i.append(l[u], P());
281
+ i.textContent = R ? R.emptyScript : "";
282
+ for (let $ = 0; $ < u; $++) i.append(l[$], C()), g.nextNode(), h.push({ type: 2, index: ++o });
283
+ i.append(l[u], C());
284
284
  }
285
285
  }
286
286
  } else if (i.nodeType === 8) if (i.data === st) h.push({ type: 2, index: o });
@@ -292,15 +292,15 @@ class O {
292
292
  }
293
293
  }
294
294
  static createElement(t, e) {
295
- const s = A.createElement("template");
295
+ const s = m.createElement("template");
296
296
  return s.innerHTML = t, s;
297
297
  }
298
298
  }
299
- function v(r, t, e = r, s) {
300
- if (t === y) return t;
299
+ function E(r, t, e = r, s) {
300
+ if (t === v) return t;
301
301
  let i = s !== void 0 ? e.o?.[s] : e.l;
302
- const o = C(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 = v(r, i._$AS(r, t.values), i, s)), t;
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;
304
304
  }
305
305
  class yt {
306
306
  constructor(t, e) {
@@ -313,24 +313,24 @@ class yt {
313
313
  return this._$AM._$AU;
314
314
  }
315
315
  u(t) {
316
- const { el: { content: e }, parts: s } = this._$AD, i = (t?.creationScope ?? A).importNode(e, !0);
317
- m.currentNode = i;
318
- let o = m.nextNode(), n = 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];
319
319
  for (; h !== void 0; ) {
320
320
  if (n === h.index) {
321
321
  let c;
322
- h.type === 2 ? c = new x(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];
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];
323
323
  }
324
- n !== h?.index && (o = m.nextNode(), n++);
324
+ n !== h?.index && (o = g.nextNode(), n++);
325
325
  }
326
- return m.currentNode = A, i;
326
+ return g.currentNode = m, i;
327
327
  }
328
328
  p(t) {
329
329
  let e = 0;
330
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++;
331
331
  }
332
332
  }
333
- class x {
333
+ class U {
334
334
  get _$AU() {
335
335
  return this._$AM?._$AU ?? this.v;
336
336
  }
@@ -349,7 +349,7 @@ class x {
349
349
  return this._$AB;
350
350
  }
351
351
  _$AI(t, e = this) {
352
- t = v(this, t, e), C(t) ? t === d || t == null || t === "" ? (this._$AH !== d && this._$AR(), this._$AH = d) : t !== this._$AH && t !== y && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : _t(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);
353
353
  }
354
354
  O(t) {
355
355
  return this._$AA.parentNode.insertBefore(t, this._$AB);
@@ -358,10 +358,10 @@ class x {
358
358
  this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
359
359
  }
360
360
  _(t) {
361
- this._$AH !== d && C(this._$AH) ? this._$AA.nextSibling.data = t : this.T(A.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;
362
362
  }
363
363
  $(t) {
364
- const { values: e, _$litType$: s } = t, i = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = O.createElement(rt(s.h, s.h[0]), this.options)), s);
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
365
  if (this._$AH?._$AD === i) this._$AH.p(e);
366
366
  else {
367
367
  const o = new yt(i, this), n = o.u(this.options);
@@ -370,13 +370,13 @@ class x {
370
370
  }
371
371
  _$AC(t) {
372
372
  let e = Y.get(t.strings);
373
- return e === void 0 && Y.set(t.strings, e = new O(t)), e;
373
+ return e === void 0 && Y.set(t.strings, e = new x(t)), e;
374
374
  }
375
375
  k(t) {
376
376
  I(this._$AH) || (this._$AH = [], this._$AR());
377
377
  const e = this._$AH;
378
378
  let s, i = 0;
379
- for (const o of t) i === e.length ? e.push(s = new x(this.O(P()), this.O(P()), this, this.options)) : s = e[i], s._$AI(o), 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++;
380
380
  i < e.length && (this._$AR(s && s._$AB.nextSibling, i), e.length = i);
381
381
  }
382
382
  _$AR(t = this._$AA.nextSibling, e) {
@@ -389,7 +389,7 @@ class x {
389
389
  this._$AM === void 0 && (this.v = t, this._$AP?.(t));
390
390
  }
391
391
  }
392
- class k {
392
+ class j {
393
393
  get tagName() {
394
394
  return this.element.tagName;
395
395
  }
@@ -402,11 +402,11 @@ class k {
402
402
  _$AI(t, e = this, s, i) {
403
403
  const o = this.strings;
404
404
  let n = !1;
405
- if (o === void 0) t = v(this, t, e, 0), n = !C(t) || t !== this._$AH && t !== y, n && (this._$AH = t);
405
+ if (o === void 0) t = E(this, t, e, 0), n = !O(t) || t !== this._$AH && t !== v, n && (this._$AH = t);
406
406
  else {
407
407
  const a = t;
408
408
  let h, c;
409
- for (t = o[0], h = 0; h < o.length - 1; h++) c = v(this, a[s + h], e, h), c === y && (c = this._$AH[h]), n ||= !C(c) || c !== this._$AH[h], c === d ? t = d : t !== d && (t += (c ?? "") + o[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;
410
410
  }
411
411
  n && !i && this.j(t);
412
412
  }
@@ -414,7 +414,7 @@ class k {
414
414
  t === d ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
415
415
  }
416
416
  }
417
- class vt extends k {
417
+ class vt extends j {
418
418
  constructor() {
419
419
  super(...arguments), this.type = 3;
420
420
  }
@@ -422,7 +422,7 @@ class vt extends k {
422
422
  this.element[this.name] = t === d ? void 0 : t;
423
423
  }
424
424
  }
425
- class Et extends k {
425
+ class Et extends j {
426
426
  constructor() {
427
427
  super(...arguments), this.type = 4;
428
428
  }
@@ -430,12 +430,12 @@ class Et extends k {
430
430
  this.element.toggleAttribute(this.name, !!t && t !== d);
431
431
  }
432
432
  }
433
- class bt extends k {
433
+ class bt extends j {
434
434
  constructor(t, e, s, i, o) {
435
435
  super(t, e, s, i, o), this.type = 5;
436
436
  }
437
437
  _$AI(t, e = this) {
438
- if ((t = v(this, t, e, 0) ?? d) === y) return;
438
+ if ((t = E(this, t, e, 0) ?? d) === v) return;
439
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
440
  i && this.element.removeEventListener(this.name, this, s), o && this.element.addEventListener(this.name, this, t), this._$AH = t;
441
441
  }
@@ -451,21 +451,21 @@ class St {
451
451
  return this._$AM._$AU;
452
452
  }
453
453
  _$AI(t) {
454
- v(this, t);
454
+ E(this, t);
455
455
  }
456
456
  }
457
457
  const wt = L.litHtmlPolyfillSupport;
458
- wt?.(O, x), (L.litHtmlVersions ??= []).push("3.2.0");
458
+ wt?.(x, U), (L.litHtmlVersions ??= []).push("3.2.0");
459
459
  const Pt = (r, t, e) => {
460
460
  const s = e?.renderBefore ?? t;
461
461
  let i = s._$litPart$;
462
462
  if (i === void 0) {
463
463
  const o = e?.renderBefore ?? null;
464
- s._$litPart$ = i = new x(t.insertBefore(P(), o), o, void 0, e ?? {});
464
+ s._$litPart$ = i = new U(t.insertBefore(C(), o), o, void 0, e ?? {});
465
465
  }
466
466
  return i._$AI(r), i;
467
467
  };
468
- class w extends g {
468
+ class P extends y {
469
469
  constructor() {
470
470
  super(...arguments), this.renderOptions = { host: this }, this.o = void 0;
471
471
  }
@@ -484,19 +484,19 @@ class w extends g {
484
484
  super.disconnectedCallback(), this.o?.setConnected(!1);
485
485
  }
486
486
  render() {
487
- return y;
487
+ return v;
488
488
  }
489
489
  }
490
- w._$litElement$ = !0, w.finalized = !0, globalThis.litElementHydrateSupport?.({ LitElement: w });
490
+ P._$litElement$ = !0, P.finalized = !0, globalThis.litElementHydrateSupport?.({ LitElement: P });
491
491
  const Ct = globalThis.litElementPolyfillSupport;
492
- Ct?.({ LitElement: w });
492
+ Ct?.({ LitElement: P });
493
493
  (globalThis.litElementVersions ??= []).push("4.1.0");
494
494
  const Ot = (r) => (t, e) => {
495
495
  e !== void 0 ? e.addInitializer((() => {
496
496
  customElements.define(r, t);
497
497
  })) : customElements.define(r, t);
498
498
  };
499
- const xt = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged: D }, Ut = (r = xt, t, e) => {
499
+ const xt = { attribute: !0, type: String, converter: N, reflect: !1, hasChanged: D }, Ut = (r = xt, t, e) => {
500
500
  const { kind: s, metadata: i } = e;
501
501
  let o = globalThis.litPropertyMetadata.get(i);
502
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") {
@@ -517,49 +517,55 @@ const xt = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged:
517
517
  }
518
518
  throw Error("Unsupported decorator location: " + s);
519
519
  };
520
- function j(r) {
520
+ function M(r) {
521
521
  return (t, e) => typeof e == "object" ? Ut(r, t, e) : ((s, i, o) => {
522
522
  const n = i.hasOwnProperty(o);
523
523
  return i.constructor.createProperty(o, s), n ? Object.getOwnPropertyDescriptor(i, o) : void 0;
524
524
  })(r, t, e);
525
525
  }
526
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, U = (r, t, e, s) => {
527
+ var Tt = Object.defineProperty, Ht = Object.getOwnPropertyDescriptor, b = (r, t, e, s) => {
528
528
  for (var i = s > 1 ? void 0 : s ? Ht(t, e) : t, o = r.length - 1, n; o >= 0; o--)
529
529
  (n = r[o]) && (i = (s ? n(t, e, i) : n(i)) || i);
530
530
  return s && i && Tt(t, e, i), i;
531
531
  };
532
- let E = class extends w {
532
+ let A = class extends P {
533
533
  constructor() {
534
- 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 = "";
535
535
  }
536
536
  static get styles() {
537
537
  return tt(Mt);
538
538
  }
539
+ get paddingStyle() {
540
+ return this.padding == "" ? "padding: 1rem 0;" : "padding: " + this.padding + ";";
541
+ }
539
542
  render() {
540
- return At`
541
- <blockquote id="quote">
543
+ return mt`
544
+ <blockquote id="quote" style="${this.paddingStyle}">
542
545
  <div id="content"><slot name="content"></slot></div>
543
546
  <div id="source"><slot name="author"></slot><slot name="source"></slot></div>
544
547
  </blockquote>
545
548
  `;
546
549
  }
547
550
  };
548
- U([
549
- j()
550
- ], E.prototype, "theme", 2);
551
- U([
552
- j()
553
- ], E.prototype, "align", 2);
554
- U([
555
- j()
556
- ], E.prototype, "size", 2);
557
- U([
558
- j()
559
- ], E.prototype, "font", 2);
560
- E = U([
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([
561
567
  Ot("ilw-quote")
562
- ], E);
568
+ ], A);
563
569
  export {
564
- E as default
570
+ A as default
565
571
  };
@@ -1 +1 @@
1
- @layer base{:root{--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(--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);padding:var(--ilw-quote--padding)}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
+ @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 u, 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-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 f = Object.defineProperty, d = Object.getOwnPropertyDescriptor, e = (c, r, n, l) => {
5
- for (var t = l > 1 ? void 0 : l ? d(r, n) : r, s = c.length - 1, a; s >= 0; s--)
6
- (a = c[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 u {
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.2.0",
7
+ "version": "1.2.1",
8
8
  "type": "module",
9
9
  "files": [
10
10
  "src/**",
package/src/ilw-quote.css CHANGED
@@ -2,7 +2,6 @@
2
2
  @layer base {
3
3
  :root {
4
4
  --ilw-quote--margin: 1rem 0;
5
- --ilw-quote--padding: 0 0 1em 0;
6
5
  --ilw-quote--base-font-size: 0.875rem;
7
6
  --ilw-quote--font: var(--il-font-sans);
8
7
  --ilw-quote--font-serif: var(--il-font-serif);
@@ -29,7 +28,6 @@
29
28
  font-size: var(--ilw-quote--base-font-size);
30
29
  text-align: center;
31
30
  margin: var(--ilw-quote--margin);
32
- padding: var(--ilw-quote--padding);
33
31
 
34
32
  &[align=left] {
35
33
  text-align: left;
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>