@kelvininc/ui-components
Version:
Kelvin UI Components
41 lines (36 loc) • 3.99 kB
JavaScript
import { p as proxyCustomElement, H, h, e as Host } from './p-D6GMjtmE.js';
import { a as isValidLabel } from './p-BVsEG3aJ.js';
const formLabelLightCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}:host{}.required{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:600;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase}.required+label{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:600;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase}.label{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase;color:var(--label-color);margin-left:var(--kv-spacing, 4px)}.required{color:var(--kv-error, #e11900);margin-left:var(--kv-spacing, 4px)}.label-container{margin-bottom:var(--kv-spacing, 4px)}:host{--label-color:var(--kv-neutral-5, #707070)}";
const formLabelNightCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}:host{}.required{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:600;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase}.required+label{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:600;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase}.label{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;letter-spacing:1.5px;text-transform:uppercase;color:var(--label-color);margin-left:var(--kv-spacing, 4px)}.required{color:var(--kv-error, #e11900);margin-left:var(--kv-spacing, 4px)}.label-container{margin-bottom:var(--kv-spacing, 4px)}:host{--label-color:var(--kv-neutral-4, #bebebe)}";
const KvFormLabel = /*@__PURE__*/ proxyCustomElement(class KvFormLabel extends H {
constructor() {
super();
this.__registerHost();
this.__attachShadow();
}
render() {
return (h(Host, { key: '5e6266f1840de5eb1e1ec90d963d690ce9a465c3' }, h("div", { key: '239914614f97a770ab3bf285b5124324b9295df9', class: "form-field-container" }, isValidLabel(this.label) && (h("div", { key: '63a8dfd9500eac893251862ee4db8bb2598d88d9', class: "label-container" }, this.required && h("span", { key: '00c16d9d85f45e07f0bd4b0ba2a97e31dfb99fdd', class: "required" }, "*"), this.label && h("span", { key: '72e13e80ba2d64ac25c8fc2e5bf9341f9e5b4d71', class: "label" }, this.label))))));
}
static get style() { return {
light: formLabelLightCss,
night: formLabelNightCss
}; }
}, [33, "kv-form-label", {
"label": [513],
"required": [516]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["kv-form-label"];
components.forEach(tagName => { switch (tagName) {
case "kv-form-label":
if (!customElements.get(tagName)) {
customElements.define(tagName, KvFormLabel);
}
break;
} });
}
defineCustomElement();
export { KvFormLabel as K, defineCustomElement as d };