kemet-ui 4.0.2 → 5.0.0

package/dist/elements/button/styles.css.js

@@ -0,0 +1,310 @@
+// src/elements/button/styles.css.ts
+import { css } from "lit";
+var styles_css_default = css`:host {
+  /* public */
+  --kemet-button-hover-brightness: 1.25;
+  --kemet-button-active-brightness: 1.75;
+  --kemet-button-circle-size: 50px;
+  --kemet-button-transition-speed: 300ms;
+  --kemet-button-gap: 0.5rem;
+  --kemet-button-border-width: 1.5px;
+  --kemet-button-border-style: solid;
+
+  /* private */
+  --_kemet-button-brightness: 1;
+  --_kemet-button-font-size: inherit;
+  --_kemet-button-width: auto;
+  --_kemet-button-height: auto;
+  --_kemet-button-padding: 1rem 1.25rem;
+  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);
+  --_kemet-button-border: 0;
+  --_kemet-button-border-radius: 0;
+  --_kemet-button-background-color: var(--kemet-color-background-button-primary-base);
+  --_kemet-button-hover-decoration: underline;
+  --_kemet-button-border-color: var(--kemet-color-background-button-primary-base);
+
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: var(--_kemet-button-font-size);
+  color: var(--_kemet-button-font-color);
+  width: var(--_kemet-button-width);
+  height: var(--_kemet-button-height);
+  border: var(--_kemet-button-border);
+  border-radius: var(--_kemet-button-border-radius);
+  filter: brightness(var(--_kemet-button-brightness));
+  transition: filter var(--kemet-button-transition-speed) ease;
+  background-color: var(--_kemet-button-background-color);
+}
+
+:host(:hover:not([disabled])) {
+  --_kemet-button-brightness: var(--kemet-button-hover-brightness);
+}
+
+:host(:active:not([disabled])) {
+  --_kemet-button-brightness: var(--kemet-button-active-brightness);
+}
+
+:host([disabled]) {
+  --_kemet-button-font-color: var(--kemet-color-font-disabled);
+  --_kemet-button-background-color: var(--kemet-color-background-disabled);
+}
+
+:host([disabled][variant=outlined]) {
+  --_kemet-button-border-color: var(--kemet-color-font-disabled);
+}
+
+:host([polarity=dark]) {
+  --_kemet-button-font-color: var(--kemet-color-font-base);
+  --_kemet-button-background-color: var(--kemet-color-background-base);
+}
+
+:host([polarity=dark][appearance]) {
+  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);
+}
+
+:host([polarity=dark][variant=text]),
+:host([polarity=dark][variant=plain]) {
+  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);
+}
+
+:host([polarity=dark][variant=outlined]) {
+  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);
+  --_kemet-button-border-color: var(--kemet-color-font-inverse-base);
+}
+
+.button {
+  cursor: pointer;
+  text-decoration: none;
+  display: flex;
+  gap: var(--kemet-button-gap);
+  align-items: center;
+  justify-content: center;
+  color: inherit;
+  font-size: inherit;
+  width: 100%;
+  padding: var(--_kemet-button-padding);
+  border: 0;
+  background: none;
+}
+
+:host([disabled]) .button {
+  cursor: not-allowed;
+}
+
+:host([variant=text]) {
+  --_kemet-button-font-color: var(--kemet-color-font-base);
+  --_kemet-button-background-color: none;
+}
+
+:host([variant=text]:hover) {
+  text-decoration: var(--_kemet-button-hover-decoration);
+}
+
+:host([appearance]:not([disabled]):not([variant])) {
+  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);
+}
+
+:host([appearance=brand]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-brand-primary-base);
+}
+
+:host([appearance=success]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-background-success);
+}
+
+:host([appearance=warning]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-background-warning);
+}
+
+:host([appearance=error]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-background-error);
+}
+
+:host([appearance=info]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-background-info);
+}
+
+:host([appearance=link]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {
+  --_kemet-button-background-color: var(--kemet-color-background-link);
+}
+
+:host([variant=text][appearance=brand]:not([disabled])),
+:host([variant=plain][appearance=brand]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-brand-primary-base);
+}
+
+:host([variant=text][appearance=success]:not([disabled])),
+:host([variant=plain][appearance=success]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-success);
+}
+
+:host([variant=text][appearance=warning]:not([disabled])),
+:host([variant=plain][appearance=warning]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-warning);
+}
+
+:host([variant=text][appearance=error]:not([disabled])),
+:host([variant=plain][appearance=error]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-error);
+}
+
+:host([variant=text][appearance=info]:not([disabled])),
+:host([variant=plain][appearance=info]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-info);
+}
+
+:host([variant=text][appearance=link]:not([disabled])),
+:host([variant=plain][appearance=link]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-link);
+}
+
+:host([appearance=neutral][polarity=dark]) {
+  --_kemet-button-font-color: var(--kemet-color-font-base);
+}
+
+:host([rounded]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-md);
+}
+
+:host([rounded=sm]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-sm);
+}
+
+:host([rounded=lg]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-lg);
+}
+
+:host([rounded=xl]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-xl);
+}
+
+:host([rounded=circle]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-circle);
+  --_kemet-button-width: var(--kemet-button-circle-size);
+  --_kemet-button-height: var(--kemet-button-circle-size);
+}
+
+:host([rounded=pill]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-pill);
+}
+
+:host([variant=outlined]) {
+  --_kemet-button-font-color: var(--kemet-color-background-button-primary-base);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=brand]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-brand-primary-base);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-brand-primary-base);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=success]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-success);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-background-success);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=warning]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-warning);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-background-warning);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=error]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-error);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-background-error);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=info]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-info);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-background-info);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+:host([variant=outlined][appearance=link]:not([disabled])) {
+  --_kemet-button-font-color: var(--kemet-color-background-link);
+  --_kemet-button-background-color: transparent;
+  --_kemet-button-border-color: var(--kemet-color-background-link);
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);
+}
+
+
+
+:host([variant=edge]) {
+  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) rgba(255, 255, 255, 0.25);
+}
+
+:host([variant=plain]) {
+  --_kemet-button-font-color: var(--kemet-color-font-base);
+  --_kemet-button-padding: 0;
+  --_kemet-button-border: none;
+  --_kemet-button-background-color: transparent;
+}
+
+:host([size=xs]) {
+  --_kemet-button-font-size: 0.8rem;
+  --_kemet-button-padding: 0.5rem 0.75rem;
+}
+
+:host([size=sm]) {
+  --_kemet-button-font-size: 0.9rem;
+  --_kemet-button-padding: 0.75rem 1rem;
+}
+
+:host([size=lg]) {
+  --_kemet-button-font-size: 1.1rem;
+  --_kemet-button-padding: 1.25rem 1.5rem;
+}
+
+:host([size=xl]) {
+  --_kemet-button-font-size: 1.2rem;
+  --_kemet-button-padding: 1.5rem 2rem;
+}
+
+:host([icon-left]) {
+  --_kemet-button-padding: 1rem 1.25rem 1rem .75rem;
+}
+
+:host([icon-right]) {
+  --_kemet-button-padding:  1rem .75rem 1rem 1.25rem;
+}
+
+
+::slotted([slot="loader"]) {
+  --kemet-loader-color: var(--_kemet-button-font-color);
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+:host([loading]) .text {
+  visibility: hidden;
+}
+
+:host([icon-button]) .text {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+`;
+export {
+  styles_css_default as default
+};
+//# sourceMappingURL=styles.css.js.map

package/dist/elements/button/styles.css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/elements/button/styles.css.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport default css`:host {\n  /* public */\n  --kemet-button-hover-brightness: 1.25;\n  --kemet-button-active-brightness: 1.75;\n  --kemet-button-circle-size: 50px;\n  --kemet-button-transition-speed: 300ms;\n  --kemet-button-gap: 0.5rem;\n  --kemet-button-border-width: 1.5px;\n  --kemet-button-border-style: solid;\n\n  /* private */\n  --_kemet-button-brightness: 1;\n  --_kemet-button-font-size: inherit;\n  --_kemet-button-width: auto;\n  --_kemet-button-height: auto;\n  --_kemet-button-padding: 1rem 1.25rem;\n  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);\n  --_kemet-button-border: 0;\n  --_kemet-button-border-radius: 0;\n  --_kemet-button-background-color: var(--kemet-color-background-button-primary-base);\n  --_kemet-button-hover-decoration: underline;\n  --_kemet-button-border-color: var(--kemet-color-background-button-primary-base);\n\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  font-size: var(--_kemet-button-font-size);\n  color: var(--_kemet-button-font-color);\n  width: var(--_kemet-button-width);\n  height: var(--_kemet-button-height);\n  border: var(--_kemet-button-border);\n  border-radius: var(--_kemet-button-border-radius);\n  filter: brightness(var(--_kemet-button-brightness));\n  transition: filter var(--kemet-button-transition-speed) ease;\n  background-color: var(--_kemet-button-background-color);\n}\n\n:host(:hover:not([disabled])) {\n  --_kemet-button-brightness: var(--kemet-button-hover-brightness);\n}\n\n:host(:active:not([disabled])) {\n  --_kemet-button-brightness: var(--kemet-button-active-brightness);\n}\n\n:host([disabled]) {\n  --_kemet-button-font-color: var(--kemet-color-font-disabled);\n  --_kemet-button-background-color: var(--kemet-color-background-disabled);\n}\n\n:host([disabled][variant=outlined]) {\n  --_kemet-button-border-color: var(--kemet-color-font-disabled);\n}\n\n:host([polarity=dark]) {\n  --_kemet-button-font-color: var(--kemet-color-font-base);\n  --_kemet-button-background-color: var(--kemet-color-background-base);\n}\n\n:host([polarity=dark][appearance]) {\n  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);\n}\n\n:host([polarity=dark][variant=text]),\n:host([polarity=dark][variant=plain]) {\n  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);\n}\n\n:host([polarity=dark][variant=outlined]) {\n  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);\n  --_kemet-button-border-color: var(--kemet-color-font-inverse-base);\n}\n\n.button {\n  cursor: pointer;\n  text-decoration: none;\n  display: flex;\n  gap: var(--kemet-button-gap);\n  align-items: center;\n  justify-content: center;\n  color: inherit;\n  font-size: inherit;\n  width: 100%;\n  padding: var(--_kemet-button-padding);\n  border: 0;\n  background: none;\n}\n\n:host([disabled]) .button {\n  cursor: not-allowed;\n}\n\n:host([variant=text]) {\n  --_kemet-button-font-color: var(--kemet-color-font-base);\n  --_kemet-button-background-color: none;\n}\n\n:host([variant=text]:hover) {\n  text-decoration: var(--_kemet-button-hover-decoration);\n}\n\n:host([appearance]:not([disabled]):not([variant])) {\n  --_kemet-button-font-color: var(--kemet-color-font-inverse-base);\n}\n\n:host([appearance=brand]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-brand-primary-base);\n}\n\n:host([appearance=success]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-background-success);\n}\n\n:host([appearance=warning]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-background-warning);\n}\n\n:host([appearance=error]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-background-error);\n}\n\n:host([appearance=info]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-background-info);\n}\n\n:host([appearance=link]:not([disabled]):not([variant=text]):not([variant=outlined]):not([variant=plain])) {\n  --_kemet-button-background-color: var(--kemet-color-background-link);\n}\n\n:host([variant=text][appearance=brand]:not([disabled])),\n:host([variant=plain][appearance=brand]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-brand-primary-base);\n}\n\n:host([variant=text][appearance=success]:not([disabled])),\n:host([variant=plain][appearance=success]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-success);\n}\n\n:host([variant=text][appearance=warning]:not([disabled])),\n:host([variant=plain][appearance=warning]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-warning);\n}\n\n:host([variant=text][appearance=error]:not([disabled])),\n:host([variant=plain][appearance=error]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-error);\n}\n\n:host([variant=text][appearance=info]:not([disabled])),\n:host([variant=plain][appearance=info]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-info);\n}\n\n:host([variant=text][appearance=link]:not([disabled])),\n:host([variant=plain][appearance=link]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-link);\n}\n\n:host([appearance=neutral][polarity=dark]) {\n  --_kemet-button-font-color: var(--kemet-color-font-base);\n}\n\n:host([rounded]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-md);\n}\n\n:host([rounded=sm]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-sm);\n}\n\n:host([rounded=lg]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-lg);\n}\n\n:host([rounded=xl]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-xl);\n}\n\n:host([rounded=circle]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-circle);\n  --_kemet-button-width: var(--kemet-button-circle-size);\n  --_kemet-button-height: var(--kemet-button-circle-size);\n}\n\n:host([rounded=pill]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-pill);\n}\n\n:host([variant=outlined]) {\n  --_kemet-button-font-color: var(--kemet-color-background-button-primary-base);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=brand]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-brand-primary-base);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-brand-primary-base);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=success]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-success);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-background-success);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=warning]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-warning);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-background-warning);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=error]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-error);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-background-error);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=info]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-info);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-background-info);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n:host([variant=outlined][appearance=link]:not([disabled])) {\n  --_kemet-button-font-color: var(--kemet-color-background-link);\n  --_kemet-button-background-color: transparent;\n  --_kemet-button-border-color: var(--kemet-color-background-link);\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) var(--_kemet-button-border-color);\n}\n\n\n\n:host([variant=edge]) {\n  --_kemet-button-border: var(--kemet-button-border-width) var(--kemet-button-border-style) rgba(255, 255, 255, 0.25);\n}\n\n:host([variant=plain]) {\n  --_kemet-button-font-color: var(--kemet-color-font-base);\n  --_kemet-button-padding: 0;\n  --_kemet-button-border: none;\n  --_kemet-button-background-color: transparent;\n}\n\n:host([size=xs]) {\n  --_kemet-button-font-size: 0.8rem;\n  --_kemet-button-padding: 0.5rem 0.75rem;\n}\n\n:host([size=sm]) {\n  --_kemet-button-font-size: 0.9rem;\n  --_kemet-button-padding: 0.75rem 1rem;\n}\n\n:host([size=lg]) {\n  --_kemet-button-font-size: 1.1rem;\n  --_kemet-button-padding: 1.25rem 1.5rem;\n}\n\n:host([size=xl]) {\n  --_kemet-button-font-size: 1.2rem;\n  --_kemet-button-padding: 1.5rem 2rem;\n}\n\n:host([icon-left]) {\n  --_kemet-button-padding: 1rem 1.25rem 1rem .75rem;\n}\n\n:host([icon-right]) {\n  --_kemet-button-padding:  1rem .75rem 1rem 1.25rem;\n}\n\n\n::slotted([slot=\"loader\"]) {\n  --kemet-loader-color: var(--_kemet-button-font-color);\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n\n:host([loading]) .text {\n  visibility: hidden;\n}\n\n:host([icon-button]) .text {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n`;\n"],"mappings":";AAAA,SAAS,WAAW;AAEpB,IAAO,qBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;","names":[]}

package/dist/elements/card/index.d.ts

@@ -0,0 +1,76 @@
+import * as lit_html from 'lit-html';
+import * as lit from 'lit';
+import { LitElement } from 'lit';
+import { e as EnumRoundedSizes } from '../../constants-W9QKPlZP.js';
+import '../../form-controller-3q581XcZ.js';
+
+declare enum EnumElevation {
+    Level1 = "level1",
+    Level2 = "level2",
+    Level3 = "level3",
+    Level4 = "level4",
+    Level5 = "level5",
+    Level6 = "level6",
+    Inner = "inner"
+}
+/**
+ * @since 1.4.0
+ * @status stable
+ *
+ * @tagname kemet-card
+ * @summary A highly configurable panel design to display media and information.
+ *
+ * @prop {boolean} center - Centers the elements in the card.
+ * @prop {boolean} filled - Fills the card with a background color.
+ * @prop {boolean} borderless - Removes the border from the card.
+ * @prop {EnumElevation} elevation - The elevation level of the card.
+ * @prop {'light' | 'dark'} polarity - Determines if the component has a dark or light background
+ * @prop {string} dom - The status of dom initalization.
+ *
+ * @slot default - The contents of the alert.
+ * @slot header - The card's header.
+ * @slot media - A slot for images, videos, or embeds.
+ * @slot caption - Text for the media slot.
+ * @slot footer - The card's footer.
+ *
+ *
+ * @csspart media - The media area of the card.
+ * @csspart body - The main contents of the card.
+ *
+ * @cssproperty --kemet-card-padding - The space around elements.
+ * @cssproperty --kemet-card-border-color - The color of the borders.
+ * @cssproperty --kemet-card-color - The color of the text. Default:
+ * @cssproperty --kemet-card-max-width - The max width of the card.
+ * @cssproperty --kemet-card-border - The border around the card.
+ * @cssproperty --kemet-card-body-padding - The body spacing.
+ * @cssproperty --kemet-card-header-padding - The header spacing.
+ * @cssproperty --kemet-card-header-border-bottom - The header border.
+ * @cssproperty --kemet-card-caption-color - The caption text color.
+ * @cssproperty --kemet-card-caption-padding - The caption spacing.
+ * @cssproperty --kemet-card-caption-background-color - The caption background color.
+ * @cssproperty --kemet-card-footer-padding - The footer spacing.
+ * @cssproperty --kemet-card-footer-border-top - The footer border.
+ * @cssproperty --kemet-card-filled-color - The filled background color.
+ *
+ * @fires kemet-card-mounted - Fired when the card is mounted to the DOM
+ * @detail {HTMLElement} element - The card element
+ */
+declare class KemetCard extends LitElement {
+    static styles: lit.CSSResult[];
+    center: boolean;
+    rounded: EnumRoundedSizes;
+    filled: boolean;
+    borderless: boolean;
+    elevation: string;
+    polarity?: 'light' | 'dark';
+    dom: string;
+    firstUpdated(): void;
+    render(): lit_html.TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'kemet-card': KemetCard;
+    }
+}
+
+export { EnumElevation, KemetCard as default };

package/dist/elements/card/index.js

@@ -0,0 +1,238 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+
+// src/elements/card/index.ts
+import { html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators.js";
+
+// src/utilities/events.ts
+var emitEvent = (element, name, detail, bubbles = true, composed = true) => {
+  element.dispatchEvent(
+    new CustomEvent(name, { bubbles, composed, detail })
+  );
+};
+
+// src/elements/card/styles.css.ts
+import { css } from "lit";
+var styles_css_default = css`:host {
+  /* public */
+  --kemet-card-font-color: inherit;
+  --kemet-card-max-width: 600px;
+  --kemet-card-padding: 1rem;
+  --kemet-card-border: 1px solid;
+  --kemet-card-caption-font-color: var(--kemet-color-font-base-inverse);
+  --kemet-card-caption-padding: calc(var(--kemet-card-padding) / 2) var(--kemet-card-padding);
+  --kemet-card-caption-background-color: var(--kemet-color-background-overlay-dark);
+  --kemet-card-body-padding: var(--kemet-card-padding);
+  --kemet-card-header-padding: var(--kemet-card-padding);
+  --kemet-card-header-border-bottom: 1px solid;
+  --kemet-card-footer-padding: var(--kemet-card-padding);
+  --kemet-card-footer-border-top: 1px solid;
+  --kemet-card-filled-color: var(--kemet-color-background-base);
+
+  /* private */
+  --_kemet-card-border-radius: 0;
+  --_kemet-card-background-color: transparent;
+  --_kemet-card-elevation: none;
+
+  color: var(--kemet-card-font-color);
+  display: inline-flex;
+  flex-direction: column;
+  max-width: var(--kemet-card-max-width);
+  border: var(--kemet-card-border);
+  border-radius: var(--_kemet-card-border-radius);
+  background-color: var(--_kemet-card-background-color);
+  box-shadow: var(--_kemet-card-elevation);
+}
+
+:host([center]) {
+  align-items: center;
+  text-align: center;
+}
+
+:host([borderless]) ::slotted(*) {
+  border: none;
+}
+
+.body {
+  padding: var(--kemet-card-body-padding);
+}
+
+.media {
+  position: relative;
+}
+
+::slotted(*) {
+  max-width: 100%;
+}
+
+::slotted(img) {
+  display: flex;
+  max-width: 100%;
+}
+
+::slotted([slot="header"]) {
+  width: 100%;
+  box-sizing: border-box;
+  padding: var(--kemet-card-header-padding);
+  border-bottom: var(--kemet-card-header-border-bottom);
+}
+
+::slotted([slot="caption"]) {
+  color: var(--kemet-card-caption-font-color);
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  box-sizing: border-box;
+  padding: var(--kemet-card-caption-padding);
+  background-color: var(--kemet-card-caption-background-color);
+}
+
+:host([polarity=dark]) {
+  --kemet-card-caption-font-color: var(--kemet-color-font-base);
+}
+
+::slotted([slot="footer"]) {
+  width: 100%;
+  box-sizing: border-box;
+  padding: var(--kemet-card-footer-padding);
+  border-top: var(--kemet-card-footer-border-top);
+}
+
+:host([rounded]) {
+  --_kemet-card-border-radius: var(--kemet-border-radius-md);
+}
+
+:host([rounded=sm]) {
+  --_kemet-card-border-radius: var(--kemet-border-radius-sm);
+}
+
+:host([rounded=lg]) {
+  --_kemet-card-border-radius: var(--kemet-border-radius-lg);
+}
+
+:host([rounded=xl]) {
+  --_kemet-button-border-radius: var(--kemet-border-radius-xl);
+}
+
+:host([filled]) {
+  --kemet-card-border: none;
+  --_kemet-card-background-color: var(--kemet-card-filled-color);
+}
+
+:host([polarity=dark][filled]) {
+  --kemet-card-filled-color: var(--kemet-color-background-inverse);
+}
+
+:host([elevation]),
+:host([elevation=level1]) {
+  --_kemet-card-elevation: 0 1px 2px 0 rgba(0, 0, 0, .05);
+}
+
+:host([elevation=level2]) {
+  --_kemet-card-elevation: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);
+}
+
+:host([elevation=level3]) {
+  --_kemet-card-elevation: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);;
+}
+
+:host([elevation=level4]) {
+  --_kemet-card-elevation: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);;
+}
+
+:host([elevation=level5]) {
+  --_kemet-card-elevation: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);
+}
+
+:host([elevation=level6]) {
+  --_kemet-card-elevation: 0 25px 50px -12px rgba(0, 0, 0, .25);
+}
+
+:host([elevation=inner]) {
+  --_kemet-card-elevation: inset 0 2px 4px 0 rgba(0, 0, 0, .05);
+}
+`;
+
+// src/elements/card/index.ts
+var EnumElevation = /* @__PURE__ */ ((EnumElevation2) => {
+  EnumElevation2["Level1"] = "level1";
+  EnumElevation2["Level2"] = "level2";
+  EnumElevation2["Level3"] = "level3";
+  EnumElevation2["Level4"] = "level4";
+  EnumElevation2["Level5"] = "level5";
+  EnumElevation2["Level6"] = "level6";
+  EnumElevation2["Inner"] = "inner";
+  return EnumElevation2;
+})(EnumElevation || {});
+var KemetCard = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.center = false;
+    this.filled = false;
+    this.borderless = false;
+    this.dom = "initializing";
+  }
+  firstUpdated() {
+    emitEvent(this, "kemet-card-mounted", {
+      bubbles: true,
+      composed: true,
+      detail: {
+        element: this
+      }
+    });
+    this.dom = "mounted";
+  }
+  render() {
+    return html`
+      <slot name="header"></slot>
+      <div class="media" part="media">
+        <slot name="media"></slot>
+        <slot name="caption"></slot>
+      </div>
+      <div class="body" part="body">
+        <slot></slot>
+      </div>
+      </div>
+      <slot name="footer"></slot>
+    `;
+  }
+};
+KemetCard.styles = [styles_css_default];
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], KemetCard.prototype, "center", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], KemetCard.prototype, "rounded", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], KemetCard.prototype, "filled", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], KemetCard.prototype, "borderless", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], KemetCard.prototype, "elevation", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], KemetCard.prototype, "polarity", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], KemetCard.prototype, "dom", 2);
+KemetCard = __decorateClass([
+  customElement("kemet-card")
+], KemetCard);
+export {
+  EnumElevation,
+  KemetCard as default
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/elements/card/index.ts","../../../src/utilities/events.ts","../../../src/elements/card/styles.css.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { emitEvent } from '../../utilities/events';\nimport { EnumRoundedSizes } from '../../utilities/constants';\nimport styles from './styles.css.ts';\n\nexport enum EnumElevation {\n  Level1 = 'level1',\n  Level2 = 'level2',\n  Level3 = 'level3',\n  Level4 = 'level4',\n  Level5 = 'level5',\n  Level6 = 'level6',\n  Inner = 'inner',\n}\n\n/**\n * @since 1.4.0\n * @status stable\n *\n * @tagname kemet-card\n * @summary A highly configurable panel design to display media and information.\n *\n * @prop {boolean} center - Centers the elements in the card.\n * @prop {boolean} filled - Fills the card with a background color.\n * @prop {boolean} borderless - Removes the border from the card.\n * @prop {EnumElevation} elevation - The elevation level of the card.\n * @prop {'light' | 'dark'} polarity - Determines if the component has a dark or light background\n * @prop {string} dom - The status of dom initalization.\n *\n * @slot default - The contents of the alert.\n * @slot header - The card's header.\n * @slot media - A slot for images, videos, or embeds.\n * @slot caption - Text for the media slot.\n * @slot footer - The card's footer.\n *\n *\n * @csspart media - The media area of the card.\n * @csspart body - The main contents of the card.\n *\n * @cssproperty --kemet-card-padding - The space around elements.\n * @cssproperty --kemet-card-border-color - The color of the borders.\n * @cssproperty --kemet-card-color - The color of the text. Default:\n * @cssproperty --kemet-card-max-width - The max width of the card.\n * @cssproperty --kemet-card-border - The border around the card.\n * @cssproperty --kemet-card-body-padding - The body spacing.\n * @cssproperty --kemet-card-header-padding - The header spacing.\n * @cssproperty --kemet-card-header-border-bottom - The header border.\n * @cssproperty --kemet-card-caption-color - The caption text color.\n * @cssproperty --kemet-card-caption-padding - The caption spacing.\n * @cssproperty --kemet-card-caption-background-color - The caption background color.\n * @cssproperty --kemet-card-footer-padding - The footer spacing.\n * @cssproperty --kemet-card-footer-border-top - The footer border.\n * @cssproperty --kemet-card-filled-color - The filled background color.\n *\n * @fires kemet-card-mounted - Fired when the card is mounted to the DOM\n * @detail {HTMLElement} element - The card element\n */\n\n@customElement('kemet-card')\nexport default class KemetCard extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Boolean, reflect: true })\n  center: boolean = false;\n\n  @property({ type: String, reflect: true })\n  rounded!: EnumRoundedSizes;\n\n  @property({ type: Boolean, reflect: true })\n  filled: boolean = false;\n\n  @property({ type: Boolean, reflect: true })\n  borderless: boolean = false;\n\n  @property({ type: String, reflect: true })\n  elevation!: string;\n\n  @property({ type: String, reflect: true })\n  polarity?: 'light' | 'dark';\n\n  @property({ type: String, reflect: true })\n  dom: string = 'initializing';\n\n  firstUpdated() {\n    emitEvent(this, 'kemet-card-mounted', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        element: this,\n      },\n    });\n    this.dom = 'mounted';\n  }\n\n  render() {\n    return html`\n      <slot name=\"header\"></slot>\n      <div class=\"media\" part=\"media\">\n        <slot name=\"media\"></slot>\n        <slot name=\"caption\"></slot>\n      </div>\n      <div class=\"body\" part=\"body\">\n        <slot></slot>\n      </div>\n      </div>\n      <slot name=\"footer\"></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kemet-card': KemetCard\n  }\n}\n","export const emitEvent = (element, name, detail, bubbles = true, composed = true) => {\n  element.dispatchEvent(\n    new CustomEvent(name, { bubbles, composed, detail }),\n  );\n};\n","import { css } from 'lit';\n\nexport default css`:host {\n  /* public */\n  --kemet-card-font-color: inherit;\n  --kemet-card-max-width: 600px;\n  --kemet-card-padding: 1rem;\n  --kemet-card-border: 1px solid;\n  --kemet-card-caption-font-color: var(--kemet-color-font-base-inverse);\n  --kemet-card-caption-padding: calc(var(--kemet-card-padding) / 2) var(--kemet-card-padding);\n  --kemet-card-caption-background-color: var(--kemet-color-background-overlay-dark);\n  --kemet-card-body-padding: var(--kemet-card-padding);\n  --kemet-card-header-padding: var(--kemet-card-padding);\n  --kemet-card-header-border-bottom: 1px solid;\n  --kemet-card-footer-padding: var(--kemet-card-padding);\n  --kemet-card-footer-border-top: 1px solid;\n  --kemet-card-filled-color: var(--kemet-color-background-base);\n\n  /* private */\n  --_kemet-card-border-radius: 0;\n  --_kemet-card-background-color: transparent;\n  --_kemet-card-elevation: none;\n\n  color: var(--kemet-card-font-color);\n  display: inline-flex;\n  flex-direction: column;\n  max-width: var(--kemet-card-max-width);\n  border: var(--kemet-card-border);\n  border-radius: var(--_kemet-card-border-radius);\n  background-color: var(--_kemet-card-background-color);\n  box-shadow: var(--_kemet-card-elevation);\n}\n\n:host([center]) {\n  align-items: center;\n  text-align: center;\n}\n\n:host([borderless]) ::slotted(*) {\n  border: none;\n}\n\n.body {\n  padding: var(--kemet-card-body-padding);\n}\n\n.media {\n  position: relative;\n}\n\n::slotted(*) {\n  max-width: 100%;\n}\n\n::slotted(img) {\n  display: flex;\n  max-width: 100%;\n}\n\n::slotted([slot=\"header\"]) {\n  width: 100%;\n  box-sizing: border-box;\n  padding: var(--kemet-card-header-padding);\n  border-bottom: var(--kemet-card-header-border-bottom);\n}\n\n::slotted([slot=\"caption\"]) {\n  color: var(--kemet-card-caption-font-color);\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n  box-sizing: border-box;\n  padding: var(--kemet-card-caption-padding);\n  background-color: var(--kemet-card-caption-background-color);\n}\n\n:host([polarity=dark]) {\n  --kemet-card-caption-font-color: var(--kemet-color-font-base);\n}\n\n::slotted([slot=\"footer\"]) {\n  width: 100%;\n  box-sizing: border-box;\n  padding: var(--kemet-card-footer-padding);\n  border-top: var(--kemet-card-footer-border-top);\n}\n\n:host([rounded]) {\n  --_kemet-card-border-radius: var(--kemet-border-radius-md);\n}\n\n:host([rounded=sm]) {\n  --_kemet-card-border-radius: var(--kemet-border-radius-sm);\n}\n\n:host([rounded=lg]) {\n  --_kemet-card-border-radius: var(--kemet-border-radius-lg);\n}\n\n:host([rounded=xl]) {\n  --_kemet-button-border-radius: var(--kemet-border-radius-xl);\n}\n\n:host([filled]) {\n  --kemet-card-border: none;\n  --_kemet-card-background-color: var(--kemet-card-filled-color);\n}\n\n:host([polarity=dark][filled]) {\n  --kemet-card-filled-color: var(--kemet-color-background-inverse);\n}\n\n:host([elevation]),\n:host([elevation=level1]) {\n  --_kemet-card-elevation: 0 1px 2px 0 rgba(0, 0, 0, .05);\n}\n\n:host([elevation=level2]) {\n  --_kemet-card-elevation: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px -1px rgba(0, 0, 0, .1);\n}\n\n:host([elevation=level3]) {\n  --_kemet-card-elevation: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);;\n}\n\n:host([elevation=level4]) {\n  --_kemet-card-elevation: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);;\n}\n\n:host([elevation=level5]) {\n  --_kemet-card-elevation: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);\n}\n\n:host([elevation=level6]) {\n  --_kemet-card-elevation: 0 25px 50px -12px rgba(0, 0, 0, .25);\n}\n\n:host([elevation=inner]) {\n  --_kemet-card-elevation: inset 0 2px 4px 0 rgba(0, 0, 0, .05);\n}\n`;\n"],"mappings":"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","names":["EnumElevation"]}

package/dist/elements/card/styles.css.d.ts

@@ -0,0 +1,5 @@
+import * as lit from 'lit';
+
+declare const _default: lit.CSSResult;
+
+export { _default as default };