@pod-os/elements 0.25.2 → 0.25.3-rc.3de9abd.0

package/dist/esm/ion-badge_5.entry.js

@@ -0,0 +1,179 @@
+import { r as registerInstance, h, H as Host, i as createEvent } from './index-9725d917.js';
+import { c as createColorClasses } from './theme-d75c68ae.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
+import { l as labelFromUri } from './index-e5d73939.js';
+import { s as subscribePodOs } from './PodOsAware-132573cd.js';
+import { s as subscribeResource } from './ResourceAware-5f237305.js';
+
+const badgeIosCss = ":host{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);--padding-top:3px;--padding-end:8px;--padding-bottom:3px;--padding-start:8px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:inline-block;min-width:10px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:0.8125rem;font-weight:bold;line-height:1;text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(:empty){display:none}:host{border-radius:10px;font-size:max(13px, 0.8125rem)}";
+const IonBadgeIosStyle0 = badgeIosCss;
+
+const badgeMdCss = ":host{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);--padding-top:3px;--padding-end:8px;--padding-bottom:3px;--padding-start:8px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:inline-block;min-width:10px;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);font-size:0.8125rem;font-weight:bold;line-height:1;text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(:empty){display:none}:host{--padding-top:3px;--padding-end:4px;--padding-bottom:4px;--padding-start:4px;border-radius:4px}";
+const IonBadgeMdStyle0 = badgeMdCss;
+
+const Badge = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.color = undefined;
+    }
+    render() {
+        const mode = getIonMode(this);
+        return (h(Host, { key: '22d41ceefb76f40dfbf739fd71483f1272a45858', class: createColorClasses(this.color, {
+                [mode]: true,
+            }) }, h("slot", { key: 'e7e65463bac5903971a8f9f6be55515f42b81a83' })));
+    }
+};
+Badge.style = {
+    ios: IonBadgeIosStyle0,
+    md: IonBadgeMdStyle0
+};
+
+const posAddLiteralValueCss = ":host{display:flex;align-items:center;gap:0.2rem}input{padding:var(--size-2);background-color:transparent;color:var(--pos-normal-text-color);border:none}input:focus{outline:2px solid var(--pos-primary-color);background-color:var(--pos-input-background-color);transition:outline 0.1s,\n    background-color 0.1s}";
+const PosAddLiteralValueStyle0 = posAddLiteralValueCss;
+
+const PosAddLiteralValue = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribePodOs = createEvent(this, "pod-os:init", 7);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.addedLiteralValue = createEvent(this, "pod-os:added-literal-value", 7);
+        this.error = createEvent(this, "pod-os:error", 7);
+        this.receiveResource = (resource) => {
+            this.resource = resource;
+        };
+        this.receivePodOs = async (os) => {
+            this.os = os;
+        };
+    }
+    setName() { }
+    componentWillLoad() {
+        subscribeResource(this);
+        subscribePodOs(this);
+    }
+    async save() {
+        try {
+            await this.os.addPropertyValue(this.resource, this.selectedTermUri, this.currentValue);
+            const literal = {
+                predicate: this.selectedTermUri,
+                label: labelFromUri(this.selectedTermUri),
+                values: [this.currentValue],
+            };
+            this.addedLiteralValue.emit(literal);
+            this.currentValue = '';
+        }
+        catch (err) {
+            this.error.emit(err);
+        }
+    }
+    onTermSelected(event) {
+        this.selectedTermUri = event.detail.uri;
+        this.valueInput.focus();
+    }
+    render() {
+        var _a;
+        if (!((_a = this.resource) === null || _a === void 0 ? void 0 : _a.editable)) {
+            return;
+        }
+        return (h(Host, null, h("ion-icon", { name: "add-circle-outline" }), h("pos-select-term", { placeholder: "Add literal", "onPod-os:term-selected": ev => this.onTermSelected(ev) }), h("input", { ref: el => (this.valueInput = el), value: this.currentValue, placeholder: "", onInput: ev => (this.currentValue = ev.target.value), onChange: () => this.save() })));
+    }
+    static get watchers() { return {
+        "os": ["setName"]
+    }; }
+};
+PosAddLiteralValue.style = PosAddLiteralValueStyle0;
+
+const posLiteralsCss = ":host {\n  --background-base-color: color-mix(in srgb, var(--pos-background-color), var(--color-grey-800) 10%);\n  --background-color-even: hsl(from var(--background-base-color) h s calc(l + 7));\n  --background-color-odd: hsl(from var(--background-base-color) h s calc(l + 10));\n  --border-color: var(--background-base-color);\n}\n\ndd {\n  padding: 0;\n  margin: 0;\n}\n\ndl {\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: var(--size-1);\n}\n\ndt {\n  margin-bottom: var(--size-1);\n}\n\n.predicate-values:nth-child(odd) {\n  background-color: var(--background-color-odd);\n}\n\n.predicate-values:nth-child(even) {\n  background-color: var(--background-color-even);\n}\n\n.predicate-values {\n  display: flex;\n  flex-direction: column;\n  border: var(--size-px) solid var(--border-color);\n  padding: var(--size-2);\n  gap: var(--size-1);\n\n  .values {\n    display: flex;\n    flex-direction: column;\n    gap: var(--size-2);\n  }\n}\n";
+const PosLiteralsStyle0 = posLiteralsCss;
+
+const PosLiterals = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.data = [];
+        this.receiveResource = (resource) => {
+            this.data = resource.literals();
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    literalValueAdded(newLiteral) {
+        const existing = this.data.find(it => it.predicate === newLiteral.predicate);
+        if (!existing) {
+            this.data = [...this.data, newLiteral];
+        }
+        else {
+            this.data = this.data.map(it => {
+                return it.predicate === existing.predicate
+                    ? {
+                        predicate: existing.predicate,
+                        label: existing.label,
+                        values: [...existing.values, ...newLiteral.values],
+                    }
+                    : it;
+            });
+        }
+    }
+    render() {
+        return (h(Host, { key: '26dd446e53e4157e6b635b5d711abf9ddf50b821' }, this.data.length > 0 ? (h("dl", null, this.data.map(it => (h("div", { class: "predicate-values" }, h("dt", null, h("pos-predicate", { uri: it.predicate, label: it.label })), h("div", { class: "values" }, it.values.map(value => (h("dd", null, value))))))))) : null, h("pos-add-literal-value", { key: '756003351bba9399d1a53242c0153b18fc0b4b19', "onPod-os:added-literal-value": event => this.literalValueAdded(event.detail) })));
+    }
+};
+PosLiterals.style = PosLiteralsStyle0;
+
+const posPredicateCss = ":host{--text-color:var(--pos-primary-color);font-family:var(--font-sans)}button{line-height:var(--scale-0);font-family:inherit;margin:0;padding:0;display:flex;background:none;border:none;cursor:pointer}button,a{color:var(--text-color);font-weight:var(--weight-light);line-height:var(--scale-0);font-size:var(--scale-0);font-family:inherit}.container{display:flex;gap:var(--size-1);flex-direction:row;align-items:center;line-height:var(--scale-0)}";
+const PosPredicateStyle0 = posPredicateCss;
+
+const PosPredicate = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.expanded = false;
+    }
+    render() {
+        if (this.expanded) {
+            return (h("div", { class: "container" }, h("a", { href: this.uri }, this.uri), h("button", { "aria-label": `collapse URI to ${this.label}`, onClick: () => (this.expanded = false) }, h("ion-icon", { name: "chevron-back-circle-outline" }))));
+        }
+        else {
+            return (h("button", { onClick: () => (this.expanded = true), title: this.uri }, this.label));
+        }
+    }
+};
+PosPredicate.style = PosPredicateStyle0;
+
+const posTypeBadgesCss = ".types{display:flex;gap:var(--size-1)}.expanded{flex-direction:column;justify-content:flex-start;align-items:flex-start}ion-badge{color:#333;background:#eee}ion-badge.toggle{cursor:pointer}ion-badge.toggle:hover{background:#ddd}";
+const PosTypeBadgesStyle0 = posTypeBadgesCss;
+
+const PosTypeBadges = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.subscribeResource = createEvent(this, "pod-os:resource", 7);
+        this.data = [];
+        this.typeLabels = [];
+        this.isExpanded = false;
+        this.receiveResource = (resource) => {
+            this.data = resource.types();
+            this.typeLabels = [...new Set(resource.types().map(it => it.label))];
+        };
+    }
+    componentWillLoad() {
+        subscribeResource(this);
+    }
+    toggleDetails() {
+        this.isExpanded = !this.isExpanded;
+    }
+    render() {
+        if (this.data.length == 0) {
+            return null;
+        }
+        if (this.isExpanded) {
+            return (h("div", { class: "types expanded" }, h("ion-badge", { class: "toggle", onClick: () => this.toggleDetails() }, h("ion-icon", { name: "contract-outline" })), this.data.map(it => (h("ion-badge", null, it.uri)))));
+        }
+        else {
+            return (h(Host, null, h("div", { class: "types" }, this.typeLabels.map(it => (h("ion-badge", null, it))), h("ion-badge", { class: "toggle", onClick: () => this.toggleDetails() }, h("ion-icon", { name: "expand-outline" })))));
+        }
+    }
+};
+PosTypeBadges.style = PosTypeBadgesStyle0;
+
+export { Badge as ion_badge, PosAddLiteralValue as pos_add_literal_value, PosLiterals as pos_literals, PosPredicate as pos_predicate, PosTypeBadges as pos_type_badges };
+
+//# sourceMappingURL=ion-badge_5.entry.js.map

package/dist/esm/ion-badge_5.entry.js.map

@@ -0,0 +1 @@
+{"file":"ion-badge.pos-add-literal-value.pos-literals.pos-predicate.pos-type-badges.entry.js","mappings":"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","names":[],"sources":["../node_modules/@ionic/core/dist/collection/components/badge/badge.ios.css?tag=ion-badge&mode=ios&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/badge/badge.md.css?tag=ion-badge&mode=md&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/badge/badge.js","src/components/pos-add-literal-value/pos-add-literal-value.css?tag=pos-add-literal-value&encapsulation=shadow","src/components/pos-add-literal-value/pos-add-literal-value.tsx","src/components/pos-literals/pos-literals.css?tag=pos-literals&encapsulation=shadow","src/components/pos-literals/pos-literals.tsx","src/components/pos-predicate/pos-predicate.css?tag=pos-predicate&encapsulation=shadow","src/components/pos-predicate/pos-predicate.tsx","src/components/pos-type-badges/pos-type-badges.css?tag=pos-type-badges&encapsulation=shadow","src/components/pos-type-badges/pos-type-badges.tsx"],"sourcesContent":["/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  /**\n   * @prop --background: Background of the badge\n   * @prop --color: Text color of the badge\n   *\n   * @prop --padding-top: Top padding of the badge\n   * @prop --padding-end: Right padding if direction is left-to-right, and left padding if direction is right-to-left of the badge\n   * @prop --padding-bottom: Bottom padding of the badge\n   * @prop --padding-start: Left padding if direction is left-to-right, and right padding if direction is right-to-left of the badge\n   */\n  --background: var(--ion-color-primary, #3880ff);\n  --color: var(--ion-color-primary-contrast, #fff);\n  --padding-top: 3px;\n  --padding-end: 8px;\n  --padding-bottom: 3px;\n  --padding-start: 8px;\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  -webkit-padding-start: var(--padding-start);\n  padding-inline-start: var(--padding-start);\n  -webkit-padding-end: var(--padding-end);\n  padding-inline-end: var(--padding-end);\n  padding-top: var(--padding-top);\n  padding-bottom: var(--padding-bottom);\n  display: inline-block;\n  min-width: 10px;\n  background: var(--background);\n  color: var(--color);\n  font-family: var(--ion-font-family, inherit);\n  font-size: 0.8125rem;\n  font-weight: bold;\n  line-height: 1;\n  text-align: center;\n  white-space: nowrap;\n  contain: content;\n  vertical-align: baseline;\n}\n\n:host(.ion-color) {\n  background: var(--ion-color-base);\n  color: var(--ion-color-contrast);\n}\n\n:host(:empty) {\n  display: none;\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  border-radius: 10px;\n  /**\n   * \"-apple-system-body\" on iOS never goes smaller than\n   * 14px according to https://developer.apple.com/design/human-interface-guidelines/typography#Specifications.\n   * However, we still keep the max() usage here for consistency\n   * with other components and in case \"-apple-system-body\" does\n   * go smaller than 14px in the future.\n   */\n  font-size: max(13px, 0.8125rem);\n}","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  /**\n   * @prop --background: Background of the badge\n   * @prop --color: Text color of the badge\n   *\n   * @prop --padding-top: Top padding of the badge\n   * @prop --padding-end: Right padding if direction is left-to-right, and left padding if direction is right-to-left of the badge\n   * @prop --padding-bottom: Bottom padding of the badge\n   * @prop --padding-start: Left padding if direction is left-to-right, and right padding if direction is right-to-left of the badge\n   */\n  --background: var(--ion-color-primary, #3880ff);\n  --color: var(--ion-color-primary-contrast, #fff);\n  --padding-top: 3px;\n  --padding-end: 8px;\n  --padding-bottom: 3px;\n  --padding-start: 8px;\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  -webkit-padding-start: var(--padding-start);\n  padding-inline-start: var(--padding-start);\n  -webkit-padding-end: var(--padding-end);\n  padding-inline-end: var(--padding-end);\n  padding-top: var(--padding-top);\n  padding-bottom: var(--padding-bottom);\n  display: inline-block;\n  min-width: 10px;\n  background: var(--background);\n  color: var(--color);\n  font-family: var(--ion-font-family, inherit);\n  font-size: 0.8125rem;\n  font-weight: bold;\n  line-height: 1;\n  text-align: center;\n  white-space: nowrap;\n  contain: content;\n  vertical-align: baseline;\n}\n\n:host(.ion-color) {\n  background: var(--ion-color-base);\n  color: var(--ion-color-contrast);\n}\n\n:host(:empty) {\n  display: none;\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  --padding-top: 3px;\n  --padding-end: 4px;\n  --padding-bottom: 4px;\n  --padding-start: 4px;\n  border-radius: 4px;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { createColorClasses } from \"../../utils/theme\";\nimport { getIonMode } from \"../../global/ionic-global\";\n/**\n * @virtualProp {\"ios\" | \"md\"} mode - The mode determines which platform styles to use.\n */\nexport class Badge {\n    constructor() {\n        this.color = undefined;\n    }\n    render() {\n        const mode = getIonMode(this);\n        return (h(Host, { key: '22d41ceefb76f40dfbf739fd71483f1272a45858', class: createColorClasses(this.color, {\n                [mode]: true,\n            }) }, h(\"slot\", { key: 'e7e65463bac5903971a8f9f6be55515f42b81a83' })));\n    }\n    static get is() { return \"ion-badge\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"ios\": [\"badge.ios.scss\"],\n            \"md\": [\"badge.md.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"ios\": [\"badge.ios.css\"],\n            \"md\": [\"badge.md.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"color\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"Color\",\n                    \"resolved\": \"\\\"danger\\\" | \\\"dark\\\" | \\\"light\\\" | \\\"medium\\\" | \\\"primary\\\" | \\\"secondary\\\" | \\\"success\\\" | \\\"tertiary\\\" | \\\"warning\\\" | string & Record<never, never> | undefined\",\n                    \"references\": {\n                        \"Color\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../interface\",\n                            \"id\": \"src/interface.d.ts::Color\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The color to use from your application's color palette.\\nDefault options are: `\\\"primary\\\"`, `\\\"secondary\\\"`, `\\\"tertiary\\\"`, `\\\"success\\\"`, `\\\"warning\\\"`, `\\\"danger\\\"`, `\\\"light\\\"`, `\\\"medium\\\"`, and `\\\"dark\\\"`.\\nFor more information on colors, see [theming](/docs/theming/basics).\"\n                },\n                \"attribute\": \"color\",\n                \"reflect\": true\n            }\n        };\n    }\n}\n",":host {\n  display: flex;\n  align-items: center;\n  gap: 0.2rem;\n}\n\ninput {\n  padding: var(--size-2);\n  background-color: transparent;\n  color: var(--pos-normal-text-color);\n  border: none;\n}\n\ninput:focus {\n  outline: 2px solid var(--pos-primary-color);\n  background-color: var(--pos-input-background-color);\n  transition:\n    outline 0.1s,\n    background-color 0.1s;\n}\n","import { Literal, PodOS, Thing, labelFromUri } from '@pod-os/core';\nimport { Component, Host, h, State, Event, Watch, EventEmitter } from '@stencil/core';\nimport { PodOsAware, PodOsEventEmitter, subscribePodOs } from '../events/PodOsAware';\nimport { ResourceAware, ResourceEventEmitter, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n  tag: 'pos-add-literal-value',\n  styleUrl: 'pos-add-literal-value.css',\n  shadow: true,\n})\nexport class PosAddLiteralValue implements ResourceAware, PodOsAware {\n  @State() os: PodOS;\n  @State() resource: Thing;\n\n  @State() currentValue: string;\n  @State() selectedTermUri: string;\n\n  @Event({ eventName: 'pod-os:init' }) subscribePodOs: PodOsEventEmitter;\n\n  @Event({ eventName: 'pod-os:resource' }) subscribeResource: ResourceEventEmitter;\n\n  /**\n   * The entered literal value has been added to the resource and successfully stored to the Pod.\n   */\n  @Event({ eventName: 'pod-os:added-literal-value' }) addedLiteralValue: EventEmitter;\n\n  /**\n   * Something went wrong while adding the literal value.\n   */\n  @Event({ eventName: 'pod-os:error' }) error: EventEmitter;\n\n  @Watch('os')\n  setName() {}\n\n  private valueInput: HTMLInputElement;\n\n  componentWillLoad() {\n    subscribeResource(this);\n    subscribePodOs(this);\n  }\n\n  receiveResource = (resource: Thing) => {\n    this.resource = resource;\n  };\n\n  receivePodOs = async (os: PodOS) => {\n    this.os = os;\n  };\n\n  async save() {\n    try {\n      await this.os.addPropertyValue(this.resource, this.selectedTermUri, this.currentValue);\n      const literal: Literal = {\n        predicate: this.selectedTermUri,\n        label: labelFromUri(this.selectedTermUri),\n        values: [this.currentValue],\n      };\n      this.addedLiteralValue.emit(literal);\n      this.currentValue = '';\n    } catch (err) {\n      this.error.emit(err);\n    }\n  }\n\n  onTermSelected(event) {\n    this.selectedTermUri = event.detail.uri;\n    this.valueInput.focus();\n  }\n\n  render() {\n    if (!this.resource?.editable) {\n      return;\n    }\n    return (\n      <Host>\n        <ion-icon name=\"add-circle-outline\"></ion-icon>\n        <pos-select-term placeholder=\"Add literal\" onPod-os:term-selected={ev => this.onTermSelected(ev)} />\n        <input\n          ref={el => (this.valueInput = el)}\n          value={this.currentValue}\n          placeholder=\"\"\n          onInput={ev => (this.currentValue = (ev.target as HTMLInputElement).value)}\n          onChange={() => this.save()}\n        ></input>\n      </Host>\n    );\n  }\n}\n",":host {\n  --background-base-color: color-mix(in srgb, var(--pos-background-color), var(--color-grey-800) 10%);\n  --background-color-even: hsl(from var(--background-base-color) h s calc(l + 7));\n  --background-color-odd: hsl(from var(--background-base-color) h s calc(l + 10));\n  --border-color: var(--background-base-color);\n}\n\ndd {\n  padding: 0;\n  margin: 0;\n}\n\ndl {\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: var(--size-1);\n}\n\ndt {\n  margin-bottom: var(--size-1);\n}\n\n.predicate-values:nth-child(odd) {\n  background-color: var(--background-color-odd);\n}\n\n.predicate-values:nth-child(even) {\n  background-color: var(--background-color-even);\n}\n\n.predicate-values {\n  display: flex;\n  flex-direction: column;\n  border: var(--size-px) solid var(--border-color);\n  padding: var(--size-2);\n  gap: var(--size-1);\n\n  .values {\n    display: flex;\n    flex-direction: column;\n    gap: var(--size-2);\n  }\n}\n","import { Literal, Thing } from '@pod-os/core';\nimport { Component, Event, EventEmitter, h, Host, State } from '@stencil/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n  tag: 'pos-literals',\n  styleUrl: './pos-literals.css',\n  shadow: true,\n})\nexport class PosLiterals implements ResourceAware {\n  @State() data: Literal[] = [];\n\n  @Event({ eventName: 'pod-os:resource' })\n  subscribeResource: EventEmitter;\n\n  componentWillLoad() {\n    subscribeResource(this);\n  }\n\n  receiveResource = (resource: Thing) => {\n    this.data = resource.literals();\n  };\n\n  literalValueAdded(newLiteral: Literal) {\n    const existing = this.data.find(it => it.predicate === newLiteral.predicate);\n\n    if (!existing) {\n      this.data = [...this.data, newLiteral];\n    } else {\n      this.data = this.data.map(it => {\n        return it.predicate === existing.predicate\n          ? {\n              predicate: existing.predicate,\n              label: existing.label,\n              values: [...existing.values, ...newLiteral.values],\n            }\n          : it;\n      });\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.data.length > 0 ? (\n          <dl>\n            {this.data.map(it => (\n              <div class=\"predicate-values\">\n                <dt>\n                  <pos-predicate uri={it.predicate} label={it.label} />\n                </dt>\n                <div class=\"values\">\n                  {it.values.map(value => (\n                    <dd>{value}</dd>\n                  ))}\n                </div>\n              </div>\n            ))}\n          </dl>\n        ) : null}\n        <pos-add-literal-value onPod-os:added-literal-value={event => this.literalValueAdded(event.detail)} />\n      </Host>\n    );\n  }\n}\n",":host {\n  --text-color: var(--pos-primary-color);\n  font-family: var(--font-sans);\n}\n\nbutton {\n  line-height: var(--scale-0);\n  font-family: inherit;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  background: none;\n  border: none;\n  cursor: pointer;\n}\n\nbutton,\na {\n  color: var(--text-color);\n  font-weight: var(--weight-light);\n  line-height: var(--scale-0);\n  font-size: var(--scale-0);\n  font-family: inherit;\n}\n\n.container {\n  display: flex;\n  gap: var(--size-1);\n  flex-direction: row;\n  align-items: center;\n  line-height: var(--scale-0);\n}\n","import { Component, h, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'pos-predicate',\n  shadow: true,\n  styleUrl: './pos-predicate.css',\n})\nexport class PosPredicate {\n  @Prop()\n  uri: string;\n\n  @Prop()\n  label: string;\n\n  @State()\n  expanded: boolean = false;\n\n  render() {\n    if (this.expanded) {\n      return (\n        <div class=\"container\">\n          <a href={this.uri}>{this.uri}</a>\n          <button aria-label={`collapse URI to ${this.label}`} onClick={() => (this.expanded = false)}>\n            <ion-icon name=\"chevron-back-circle-outline\"></ion-icon>\n          </button>\n        </div>\n      );\n    } else {\n      return (\n        <button onClick={() => (this.expanded = true)} title={this.uri}>\n          {this.label}\n        </button>\n      );\n    }\n  }\n}\n",".types {\n  display: flex;\n  gap: var(--size-1);\n}\n\n.expanded {\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n}\n\nion-badge {\n  color: #333;\n  background: #eee;\n}\n\nion-badge.toggle {\n  cursor: pointer;\n}\n\nion-badge.toggle:hover {\n  background: #ddd;\n}\n","import { RdfType, Thing } from '@pod-os/core';\nimport { Component, Event, EventEmitter, h, Host, State } from '@stencil/core';\nimport { ResourceAware, subscribeResource } from '../events/ResourceAware';\n\n@Component({\n  tag: 'pos-type-badges',\n  shadow: true,\n  styleUrl: 'pos-type-badges.css',\n})\nexport class PosTypeBadges implements ResourceAware {\n  @State() data: RdfType[] = [];\n  @State() typeLabels: string[] = [];\n\n  @State() isExpanded: boolean = false;\n\n  @Event({ eventName: 'pod-os:resource' })\n  subscribeResource: EventEmitter;\n\n  componentWillLoad() {\n    subscribeResource(this);\n  }\n\n  receiveResource = (resource: Thing) => {\n    this.data = resource.types();\n    this.typeLabels = [...new Set(resource.types().map(it => it.label))];\n  };\n\n  toggleDetails() {\n    this.isExpanded = !this.isExpanded;\n  }\n\n  render() {\n    if (this.data.length == 0) {\n      return null;\n    }\n    if (this.isExpanded) {\n      return (\n        <div class=\"types expanded\">\n          <ion-badge class=\"toggle\" onClick={() => this.toggleDetails()}>\n            <ion-icon name=\"contract-outline\"></ion-icon>\n          </ion-badge>\n          {this.data.map(it => (\n            <ion-badge>{it.uri}</ion-badge>\n          ))}\n        </div>\n      );\n    } else {\n      return (\n        <Host>\n          <div class=\"types\">\n            {this.typeLabels.map(it => (\n              <ion-badge>{it}</ion-badge>\n            ))}\n            <ion-badge class=\"toggle\" onClick={() => this.toggleDetails()}>\n              <ion-icon name=\"expand-outline\"></ion-icon>\n            </ion-badge>\n          </div>\n        </Host>\n      );\n    }\n  }\n}\n"],"version":3}

package/dist/esm/ion-breadcrumb.entry.js

@@ -1,8 +1,8 @@
-import { r as registerInstance, i as createEvent, h, H as Host, d as getElement } from './index-4fdc2561.js';
-import { h as inheritAriaAttributes } from './helpers-a93a8cd2.js';
+import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-9725d917.js';
+import { h as inheritAriaAttributes } from './helpers-c51da066.js';
 import { o as openURL, c as createColorClasses, h as hostContext } from './theme-d75c68ae.js';
 import { g as chevronForwardOutline, h as ellipsisHorizontal } from './index-9edae53a.js';
-import { g as getIonMode } from './ionic-global-df0a32a5.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const breadcrumbIosCss = ":host{display:flex;flex:0 0 auto;align-items:center;color:var(--color);font-size:1rem;font-weight:400;line-height:1.5}.breadcrumb-native{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:flex;align-items:center;width:100%;outline:none;background:inherit}:host(.breadcrumb-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.breadcrumb-active){color:var(--color-active)}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .breadcrumb-native{background:var(--background-focused)}@media (any-hover: hover){:host(.ion-activatable:hover){color:var(--color-hover)}:host(.ion-activatable.in-breadcrumbs-color:hover),:host(.ion-activatable.ion-color:hover){color:var(--ion-color-shade)}}.breadcrumb-separator{display:inline-flex}:host(.breadcrumb-collapsed) .breadcrumb-native{display:none}:host(.in-breadcrumbs-color),:host(.in-breadcrumbs-color.breadcrumb-active){color:var(--ion-color-base)}:host(.in-breadcrumbs-color) .breadcrumb-separator{color:var(--ion-color-base)}:host(.ion-color){color:var(--ion-color-base)}:host(.in-toolbar-color),:host(.in-toolbar-color) .breadcrumb-separator{color:rgba(var(--ion-color-contrast-rgb), 0.8)}:host(.in-toolbar-color.breadcrumb-active){color:var(--ion-color-contrast)}.breadcrumbs-collapsed-indicator{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;-webkit-margin-start:14px;margin-inline-start:14px;-webkit-margin-end:14px;margin-inline-end:14px;margin-top:0;margin-bottom:0;display:flex;flex:1 1 100%;align-items:center;justify-content:center;width:32px;height:18px;border:0;outline:none;cursor:pointer;appearance:none}.breadcrumbs-collapsed-indicator ion-icon{margin-top:1px;font-size:1.375rem}:host{--color:var(--ion-color-step-850, #2d4665);--color-active:var(--ion-text-color, #03060b);--color-hover:var(--ion-text-color, #03060b);--color-focused:var(--color-active);--background-focused:var(--ion-color-step-50, rgba(233, 237, 243, 0.7));font-size:clamp(16px, 1rem, 22px)}:host(.breadcrumb-active){font-weight:600}.breadcrumb-native{border-radius:4px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:5px;padding-bottom:5px;border:1px solid transparent}:host(.ion-focused) .breadcrumb-native{border-radius:8px}:host(.in-breadcrumbs-color.ion-focused) .breadcrumb-native,:host(.ion-color.ion-focused) .breadcrumb-native{background:rgba(var(--ion-color-base-rgb), 0.1);color:var(--ion-color-base)}:host(.ion-focused) ::slotted(ion-icon),:host(.in-breadcrumbs-color.ion-focused) ::slotted(ion-icon),:host(.ion-color.ion-focused) ::slotted(ion-icon){color:var(--ion-color-step-750, #445b78)}.breadcrumb-separator{color:var(--ion-color-step-550, #73849a)}::slotted(ion-icon){color:var(--ion-color-step-400, #92a0b3);font-size:min(1.125rem, 21.6px)}::slotted(ion-icon[slot=start]){-webkit-margin-end:8px;margin-inline-end:8px}::slotted(ion-icon[slot=end]){-webkit-margin-start:8px;margin-inline-start:8px}:host(.breadcrumb-active) ::slotted(ion-icon){color:var(--ion-color-step-850, #242d39)}.breadcrumbs-collapsed-indicator{border-radius:4px;background:var(--ion-color-step-100, #e9edf3);color:var(--ion-color-step-550, #73849a)}.breadcrumbs-collapsed-indicator:hover{opacity:0.45}.breadcrumbs-collapsed-indicator:focus{background:var(--ion-color-step-150, #d9e0ea)}.breadcrumbs-collapsed-indicator ion-icon{font-size:min(1.375rem, 22px)}";
 const IonBreadcrumbIosStyle0 = breadcrumbIosCss;

package/dist/esm/ion-breadcrumbs.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, i as createEvent, h, H as Host, d as getElement } from './index-4fdc2561.js';
+import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-9725d917.js';
 import { c as createColorClasses, h as hostContext } from './theme-d75c68ae.js';
-import { g as getIonMode } from './ionic-global-df0a32a5.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const breadcrumbsIosCss = ":host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;flex-wrap:wrap;align-items:center}:host(.in-toolbar-color),:host(.in-toolbar-color) .breadcrumbs-collapsed-indicator ion-icon{color:var(--ion-color-contrast)}:host(.in-toolbar-color) .breadcrumbs-collapsed-indicator{background:rgba(var(--ion-color-contrast-rgb), 0.11)}:host(.in-toolbar){-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:0;padding-bottom:0;justify-content:center}";
 const IonBreadcrumbsIosStyle0 = breadcrumbsIosCss;

package/dist/esm/ion-button_4.entry.js

@@ -1,8 +1,8 @@
-import { r as registerInstance, i as createEvent, h, H as Host, d as getElement } from './index-4fdc2561.js';
-import { q as hasShadowDom, h as inheritAriaAttributes, r as raf, g as getElementRoot } from './helpers-a93a8cd2.js';
+import { r as registerInstance, i as createEvent, h, H as Host, e as getElement } from './index-9725d917.js';
+import { q as hasShadowDom, h as inheritAriaAttributes, r as raf, g as getElementRoot } from './helpers-c51da066.js';
 import { p as printIonWarning } from './index-f7ac0403.js';
 import { o as openURL, c as createColorClasses, h as hostContext } from './theme-d75c68ae.js';
-import { g as getIonMode, a as isPlatform } from './ionic-global-df0a32a5.js';
+import { g as getIonMode, a as isPlatform } from './ionic-global-07f989af.js';
 import { a as hapticSelectionStart, b as hapticSelectionChanged, c as hapticSelectionEnd } from './haptic-910fb8d2.js';
 import './capacitor-8d3da60f.js';
 import './index-6b94f340.js';

package/dist/{components/card-content.js → esm/ion-card-content.entry.js}

@@ -1,5 +1,5 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { g as getIonMode } from './ionic-global.js';
+import { r as registerInstance, h, H as Host } from './index-9725d917.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const cardContentIosCss = "ion-card-content{display:block;position:relative}.card-content-ios{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:20px;padding-bottom:20px;font-size:1rem;line-height:1.4}.card-content-ios h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:1.5rem;font-weight:normal}.card-content-ios h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:1rem;font-weight:normal}.card-content-ios h3,.card-content-ios h4,.card-content-ios h5,.card-content-ios h6{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:0.875rem;font-weight:normal}.card-content-ios p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:0.875rem}ion-card-header+.card-content-ios{padding-top:0}";
 const IonCardContentIosStyle0 = cardContentIosCss;
@@ -7,10 +7,9 @@ const IonCardContentIosStyle0 = cardContentIosCss;
 const cardContentMdCss = "ion-card-content{display:block;position:relative}.card-content-md{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:13px;padding-bottom:13px;font-size:0.875rem;line-height:1.5}.card-content-md h1{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:1.5rem;font-weight:normal}.card-content-md h2{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:1rem;font-weight:normal}.card-content-md h3,.card-content-md h4,.card-content-md h5,.card-content-md h6{margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:0.875rem;font-weight:normal}.card-content-md p{margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:0.875rem;font-weight:normal;line-height:1.5}ion-card-header+.card-content-md{padding-top:0}";
 const IonCardContentMdStyle0 = cardContentMdCss;
 
-const CardContent = /*@__PURE__*/ proxyCustomElement(class CardContent extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
+const CardContent = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
     }
     render() {
         const mode = getIonMode(this);
@@ -20,25 +19,12 @@ const CardContent = /*@__PURE__*/ proxyCustomElement(class CardContent extends H
                 [`card-content-${mode}`]: true,
             } }));
     }
-    static get style() { return {
-        ios: IonCardContentIosStyle0,
-        md: IonCardContentMdStyle0
-    }; }
-}, [32, "ion-card-content"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-card-content"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-card-content":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CardContent);
-            }
-            break;
-    } });
-}
+};
+CardContent.style = {
+    ios: IonCardContentIosStyle0,
+    md: IonCardContentMdStyle0
+};
 
-export { CardContent as C, defineCustomElement as d };
+export { CardContent as ion_card_content };
 
-//# sourceMappingURL=card-content.js.map
+//# sourceMappingURL=ion-card-content.entry.js.map

package/dist/esm/ion-card-content.entry.js.map

@@ -0,0 +1 @@
+{"file":"ion-card-content.entry.js","mappings":";;;AAAA,MAAM,iBAAiB,GAAG,oyBAAoyB,CAAC;AAC/zB,gCAAe,iBAAiB;;ACDhC,MAAM,gBAAgB,GAAG,k0BAAk0B,CAAC;AAC51B,+BAAe,gBAAgB;;MCOlB,WAAW;;;;IACpB,MAAM;QACF,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QAC9B,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE;gBAClE,CAAC,IAAI,GAAG,IAAI;;gBAEZ,CAAC,gBAAgB,IAAI,EAAE,GAAG,IAAI;aACjC,EAAE,CAAC,EAAE;KACb;;;;;;;;;","names":[],"sources":["../node_modules/@ionic/core/dist/collection/components/card-content/card-content.ios.css?tag=ion-card-content&mode=ios","../node_modules/@ionic/core/dist/collection/components/card-content/card-content.md.css?tag=ion-card-content&mode=md","../node_modules/@ionic/core/dist/collection/components/card-content/card-content.js"],"sourcesContent":["/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\nion-card-content {\n  display: block;\n  position: relative;\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n.card-content-ios {\n  -webkit-padding-start: 20px;\n  padding-inline-start: 20px;\n  -webkit-padding-end: 20px;\n  padding-inline-end: 20px;\n  padding-top: 20px;\n  padding-bottom: 20px;\n  font-size: 1rem;\n  line-height: 1.4;\n}\n.card-content-ios h1 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 2px;\n  font-size: 1.5rem;\n  font-weight: normal;\n}\n.card-content-ios h2 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 2px;\n  margin-bottom: 2px;\n  font-size: 1rem;\n  font-weight: normal;\n}\n.card-content-ios h3,\n.card-content-ios h4,\n.card-content-ios h5,\n.card-content-ios h6 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 2px;\n  margin-bottom: 2px;\n  font-size: 0.875rem;\n  font-weight: normal;\n}\n.card-content-ios p {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 2px;\n  font-size: 0.875rem;\n}\n\nion-card-header + .card-content-ios {\n  padding-top: 0;\n}","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\nion-card-content {\n  display: block;\n  position: relative;\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n.card-content-md {\n  -webkit-padding-start: 16px;\n  padding-inline-start: 16px;\n  -webkit-padding-end: 16px;\n  padding-inline-end: 16px;\n  padding-top: 13px;\n  padding-bottom: 13px;\n  font-size: 0.875rem;\n  line-height: 1.5;\n}\n.card-content-md h1 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 2px;\n  font-size: 1.5rem;\n  font-weight: normal;\n}\n.card-content-md h2 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 2px;\n  margin-bottom: 2px;\n  font-size: 1rem;\n  font-weight: normal;\n}\n.card-content-md h3,\n.card-content-md h4,\n.card-content-md h5,\n.card-content-md h6 {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 2px;\n  margin-bottom: 2px;\n  font-size: 0.875rem;\n  font-weight: normal;\n}\n.card-content-md p {\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 2px;\n  font-size: 0.875rem;\n  font-weight: normal;\n  line-height: 1.5;\n}\n\nion-card-header + .card-content-md {\n  padding-top: 0;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { getIonMode } from \"../../global/ionic-global\";\n/**\n * @virtualProp {\"ios\" | \"md\"} mode - The mode determines which platform styles to use.\n */\nexport class CardContent {\n    render() {\n        const mode = getIonMode(this);\n        return (h(Host, { key: 'dd95806f042fcd124b18126679f671be6e32a021', class: {\n                [mode]: true,\n                // Used internally for styling\n                [`card-content-${mode}`]: true,\n            } }));\n    }\n    static get is() { return \"ion-card-content\"; }\n    static get originalStyleUrls() {\n        return {\n            \"ios\": [\"card-content.ios.scss\"],\n            \"md\": [\"card-content.md.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"ios\": [\"card-content.ios.css\"],\n            \"md\": [\"card-content.md.css\"]\n        };\n    }\n}\n"],"version":3}

package/dist/{components/card-header.js → esm/ion-card-header.entry.js}

@@ -1,6 +1,6 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as createColorClasses } from './theme.js';
-import { g as getIonMode } from './ionic-global.js';
+import { r as registerInstance, h, H as Host } from './index-9725d917.js';
+import { c as createColorClasses } from './theme-d75c68ae.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const cardHeaderIosCss = ":host{--background:transparent;--color:inherit;display:flex;position:relative;flex-direction:column;background:var(--background);color:var(--color)}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:20px;padding-bottom:16px;flex-direction:column-reverse}@supports (backdrop-filter: blur(0)){:host(.card-header-translucent){background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.9);backdrop-filter:saturate(180%) blur(30px)}}";
 const IonCardHeaderIosStyle0 = cardHeaderIosCss;
@@ -8,11 +8,9 @@ const IonCardHeaderIosStyle0 = cardHeaderIosCss;
 const cardHeaderMdCss = ":host{--background:transparent;--color:inherit;display:flex;position:relative;flex-direction:column;background:var(--background);color:var(--color)}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:16px;padding-bottom:16px}::slotted(ion-card-title:not(:first-child)),::slotted(ion-card-subtitle:not(:first-child)){margin-top:8px}";
 const IonCardHeaderMdStyle0 = cardHeaderMdCss;
 
-const CardHeader = /*@__PURE__*/ proxyCustomElement(class CardHeader extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
+const CardHeader = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
         this.color = undefined;
         this.translucent = false;
     }
@@ -24,28 +22,12 @@ const CardHeader = /*@__PURE__*/ proxyCustomElement(class CardHeader extends HTM
                 [mode]: true,
             }) }, h("slot", { key: '51b6f4048d25521ece18d79e5361c762af41cae7' })));
     }
-    static get style() { return {
-        ios: IonCardHeaderIosStyle0,
-        md: IonCardHeaderMdStyle0
-    }; }
-}, [33, "ion-card-header", {
-        "color": [513],
-        "translucent": [4]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-card-header"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-card-header":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CardHeader);
-            }
-            break;
-    } });
-}
+};
+CardHeader.style = {
+    ios: IonCardHeaderIosStyle0,
+    md: IonCardHeaderMdStyle0
+};
 
-export { CardHeader as C, defineCustomElement as d };
+export { CardHeader as ion_card_header };
 
-//# sourceMappingURL=card-header.js.map
+//# sourceMappingURL=ion-card-header.entry.js.map

package/dist/esm/ion-card-header.entry.js.map

@@ -0,0 +1 @@
+{"file":"ion-card-header.entry.js","mappings":";;;;AAAA,MAAM,gBAAgB,GAAG,mlBAAmlB,CAAC;AAC7mB,+BAAe,gBAAgB;;ACD/B,MAAM,eAAe,GAAG,oeAAoe,CAAC;AAC7f,8BAAe,eAAe;;MCQjB,UAAU;IACnB;;QACI,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;QACvB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;KAC5B;IACD,MAAM;QACF,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QAC9B,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,EAAE;gBACjG,yBAAyB,EAAE,IAAI,CAAC,WAAW;gBAC3C,mBAAmB,EAAE,IAAI;gBACzB,CAAC,IAAI,GAAG,IAAI;aACf,CAAC,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC,EAAE;KAC9E;;;;;;;;;","names":[],"sources":["../node_modules/@ionic/core/dist/collection/components/card-header/card-header.ios.css?tag=ion-card-header&mode=ios&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-header/card-header.md.css?tag=ion-card-header&mode=md&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-header/card-header.js"],"sourcesContent":["/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  --background: transparent;\n  --color: inherit;\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  background: var(--background);\n  color: var(--color);\n}\n\n:host(.ion-color) {\n  background: var(--ion-color-base);\n  color: var(--ion-color-contrast);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  -webkit-padding-start: 20px;\n  padding-inline-start: 20px;\n  -webkit-padding-end: 20px;\n  padding-inline-end: 20px;\n  padding-top: 20px;\n  padding-bottom: 16px;\n  flex-direction: column-reverse;\n}\n\n@supports (backdrop-filter: blur(0)) {\n  :host(.card-header-translucent) {\n    background-color: rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.9);\n    backdrop-filter: saturate(180%) blur(30px);\n  }\n}","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  --background: transparent;\n  --color: inherit;\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  background: var(--background);\n  color: var(--color);\n}\n\n:host(.ion-color) {\n  background: var(--ion-color-base);\n  color: var(--ion-color-contrast);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  -webkit-padding-start: 16px;\n  padding-inline-start: 16px;\n  -webkit-padding-end: 16px;\n  padding-inline-end: 16px;\n  padding-top: 16px;\n  padding-bottom: 16px;\n}\n\n::slotted(ion-card-title:not(:first-child)),\n::slotted(ion-card-subtitle:not(:first-child)) {\n  margin-top: 8px;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { createColorClasses } from \"../../utils/theme\";\nimport { getIonMode } from \"../../global/ionic-global\";\n/**\n * @virtualProp {\"ios\" | \"md\"} mode - The mode determines which platform styles to use.\n */\nexport class CardHeader {\n    constructor() {\n        this.color = undefined;\n        this.translucent = false;\n    }\n    render() {\n        const mode = getIonMode(this);\n        return (h(Host, { key: '44077ad8e3edf7726d0f7a039046e32dc56a83c9', class: createColorClasses(this.color, {\n                'card-header-translucent': this.translucent,\n                'ion-inherit-color': true,\n                [mode]: true,\n            }) }, h(\"slot\", { key: '51b6f4048d25521ece18d79e5361c762af41cae7' })));\n    }\n    static get is() { return \"ion-card-header\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"ios\": [\"card-header.ios.scss\"],\n            \"md\": [\"card-header.md.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"ios\": [\"card-header.ios.css\"],\n            \"md\": [\"card-header.md.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"color\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"Color\",\n                    \"resolved\": \"\\\"danger\\\" | \\\"dark\\\" | \\\"light\\\" | \\\"medium\\\" | \\\"primary\\\" | \\\"secondary\\\" | \\\"success\\\" | \\\"tertiary\\\" | \\\"warning\\\" | string & Record<never, never> | undefined\",\n                    \"references\": {\n                        \"Color\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../interface\",\n                            \"id\": \"src/interface.d.ts::Color\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The color to use from your application's color palette.\\nDefault options are: `\\\"primary\\\"`, `\\\"secondary\\\"`, `\\\"tertiary\\\"`, `\\\"success\\\"`, `\\\"warning\\\"`, `\\\"danger\\\"`, `\\\"light\\\"`, `\\\"medium\\\"`, and `\\\"dark\\\"`.\\nFor more information on colors, see [theming](/docs/theming/basics).\"\n                },\n                \"attribute\": \"color\",\n                \"reflect\": true\n            },\n            \"translucent\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the card header will be translucent.\\nOnly applies when the mode is `\\\"ios\\\"` and the device supports\\n[`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).\"\n                },\n                \"attribute\": \"translucent\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            }\n        };\n    }\n}\n"],"version":3}

package/dist/esm/ion-card-subtitle.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host } from './index-4fdc2561.js';
+import { r as registerInstance, h, H as Host } from './index-9725d917.js';
 import { c as createColorClasses } from './theme-d75c68ae.js';
-import { g as getIonMode } from './ionic-global-df0a32a5.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const cardSubtitleIosCss = ":host{display:block;position:relative;color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}:host{--color:var(--ion-color-step-600, #666666);margin-left:0;margin-right:0;margin-top:0;margin-bottom:4px;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:0.75rem;font-weight:700;letter-spacing:0.4px;text-transform:uppercase}";
 const IonCardSubtitleIosStyle0 = cardSubtitleIosCss;

package/dist/{components/card-title.js → esm/ion-card-title.entry.js}

@@ -1,6 +1,6 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as createColorClasses } from './theme.js';
-import { g as getIonMode } from './ionic-global.js';
+import { r as registerInstance, h, H as Host } from './index-9725d917.js';
+import { c as createColorClasses } from './theme-d75c68ae.js';
+import { g as getIonMode } from './ionic-global-07f989af.js';
 
 const cardTitleIosCss = ":host{display:block;position:relative;color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}:host{--color:var(--ion-text-color, #000);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:1.75rem;font-weight:700;line-height:1.2}";
 const IonCardTitleIosStyle0 = cardTitleIosCss;
@@ -8,11 +8,9 @@ const IonCardTitleIosStyle0 = cardTitleIosCss;
 const cardTitleMdCss = ":host{display:block;position:relative;color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}:host{--color:var(--ion-color-step-850, #262626);margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-size:1.25rem;font-weight:500;line-height:1.2}";
 const IonCardTitleMdStyle0 = cardTitleMdCss;
 
-const CardTitle = /*@__PURE__*/ proxyCustomElement(class CardTitle extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
+const CardTitle = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
         this.color = undefined;
     }
     render() {
@@ -22,27 +20,12 @@ const CardTitle = /*@__PURE__*/ proxyCustomElement(class CardTitle extends HTMLE
                 [mode]: true,
             }) }, h("slot", { key: '8d87636ad703545b6d2297629205a5a8616eb94e' })));
     }
-    static get style() { return {
-        ios: IonCardTitleIosStyle0,
-        md: IonCardTitleMdStyle0
-    }; }
-}, [33, "ion-card-title", {
-        "color": [513]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-card-title"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-card-title":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, CardTitle);
-            }
-            break;
-    } });
-}
+};
+CardTitle.style = {
+    ios: IonCardTitleIosStyle0,
+    md: IonCardTitleMdStyle0
+};
 
-export { CardTitle as C, defineCustomElement as d };
+export { CardTitle as ion_card_title };
 
-//# sourceMappingURL=card-title.js.map
+//# sourceMappingURL=ion-card-title.entry.js.map

package/dist/esm/ion-card-title.entry.js.map

@@ -0,0 +1 @@
+{"file":"ion-card-title.entry.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,6TAA6T,CAAC;AACtV,8BAAe,eAAe;;ACD9B,MAAM,cAAc,GAAG,oUAAoU,CAAC;AAC5V,6BAAe,cAAc;;MCQhB,SAAS;IAClB;;QACI,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC;KAC1B;IACD,MAAM;QACF,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QAC9B,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,EAAE,KAAK,EAAE,kBAAkB,CAAC,IAAI,CAAC,KAAK,EAAE;gBACrI,mBAAmB,EAAE,IAAI;gBACzB,CAAC,IAAI,GAAG,IAAI;aACf,CAAC,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC,EAAE;KAC9E;;;;;;;;;","names":[],"sources":["../node_modules/@ionic/core/dist/collection/components/card-title/card-title.ios.css?tag=ion-card-title&mode=ios&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-title/card-title.md.css?tag=ion-card-title&mode=md&encapsulation=shadow","../node_modules/@ionic/core/dist/collection/components/card-title/card-title.js"],"sourcesContent":["/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  /**\n   * @prop --color: Color of the card title\n   */\n  display: block;\n  position: relative;\n  color: var(--color);\n}\n\n:host(.ion-color) {\n  color: var(--ion-color-base);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  --color: var(--ion-text-color, #000);\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  padding-bottom: 0;\n  font-size: 1.75rem;\n  font-weight: 700;\n  line-height: 1.2;\n}","/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  /**\n   * @prop --color: Color of the card title\n   */\n  display: block;\n  position: relative;\n  color: var(--color);\n}\n\n:host(.ion-color) {\n  color: var(--ion-color-base);\n}\n\n/**\n * Convert a font size to a dynamic font size.\n * Fonts that participate in Dynamic Type should use\n * dynamic font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param unit (optional) - The unit to convert to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a maximum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * a minimum font size.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * Convert a font size to a dynamic font size but impose\n * maximum and minimum font sizes.\n * @param size - The initial font size including the unit (i.e. px or pt)\n * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).\n * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).\n * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to\n * convert to a unit other than $baselineUnit.\n */\n/**\n * A heuristic that applies CSS to tablet\n * viewports.\n *\n * Usage:\n * @include tablet-viewport() {\n *   :host {\n *     background-color: green;\n *   }\n * }\n */\n/**\n * A heuristic that applies CSS to mobile\n * viewports (i.e. phones, not tablets).\n *\n * Usage:\n * @include mobile-viewport() {\n *   :host {\n *     background-color: blue;\n *   }\n * }\n */\n:host {\n  --color: var(--ion-color-step-850, #262626);\n  margin-left: 0;\n  margin-right: 0;\n  margin-top: 0;\n  margin-bottom: 0;\n  padding-left: 0;\n  padding-right: 0;\n  padding-top: 0;\n  padding-bottom: 0;\n  font-size: 1.25rem;\n  font-weight: 500;\n  line-height: 1.2;\n}","/*!\n * (C) Ionic http://ionicframework.com - MIT License\n */\nimport { Host, h } from \"@stencil/core\";\nimport { createColorClasses } from \"../../utils/theme\";\nimport { getIonMode } from \"../../global/ionic-global\";\n/**\n * @virtualProp {\"ios\" | \"md\"} mode - The mode determines which platform styles to use.\n */\nexport class CardTitle {\n    constructor() {\n        this.color = undefined;\n    }\n    render() {\n        const mode = getIonMode(this);\n        return (h(Host, { key: 'a9e4190346e7d0a8e6089ec1fe01bca0f5f7200d', role: \"heading\", \"aria-level\": \"2\", class: createColorClasses(this.color, {\n                'ion-inherit-color': true,\n                [mode]: true,\n            }) }, h(\"slot\", { key: '8d87636ad703545b6d2297629205a5a8616eb94e' })));\n    }\n    static get is() { return \"ion-card-title\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"ios\": [\"card-title.ios.scss\"],\n            \"md\": [\"card-title.md.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"ios\": [\"card-title.ios.css\"],\n            \"md\": [\"card-title.md.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"color\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"Color\",\n                    \"resolved\": \"\\\"danger\\\" | \\\"dark\\\" | \\\"light\\\" | \\\"medium\\\" | \\\"primary\\\" | \\\"secondary\\\" | \\\"success\\\" | \\\"tertiary\\\" | \\\"warning\\\" | string & Record<never, never> | undefined\",\n                    \"references\": {\n                        \"Color\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../interface\",\n                            \"id\": \"src/interface.d.ts::Color\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The color to use from your application's color palette.\\nDefault options are: `\\\"primary\\\"`, `\\\"secondary\\\"`, `\\\"tertiary\\\"`, `\\\"success\\\"`, `\\\"warning\\\"`, `\\\"danger\\\"`, `\\\"light\\\"`, `\\\"medium\\\"`, and `\\\"dark\\\"`.\\nFor more information on colors, see [theming](/docs/theming/basics).\"\n                },\n                \"attribute\": \"color\",\n                \"reflect\": true\n            }\n        };\n    }\n}\n"],"version":3}