@oicl/openbridge-webcomponents 0.0.4

package/dist/components/clock/clock.css.js

@@ -0,0 +1,82 @@
+import { css } from "lit";
+const compentStyle = css`:host {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 0 12px;
+}
+
+.clock {
+  color: var(--element-active-color, #1a1a1a);
+  text-align: center;
+
+  font-family: 'Noto Sans';
+
+  font-size: 1rem;
+
+  font-style: normal;
+
+  font-weight: 570;
+
+  line-height: 1.5rem;
+
+  /* 150% */
+}
+
+.blink {
+  display: none;
+}
+
+@keyframes ticks {
+  from {
+    opacity: 1;
+  }
+
+  50% {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+.ticks {
+  animation: ticks 1s linear infinite;
+  width: 7px;
+  text-align: center;
+  padding: 0 2px;
+  position: relative;
+  top: -0.08em;
+}
+
+.blink .ticks {
+    display: block;
+    width: 16px;
+    padding: 0;
+  }
+
+.date {
+  color: var(--element-active-color, #1a1a1a);
+  text-align: center;
+
+  /* UI/Body */
+
+  font-family: 'Noto Sans';
+
+  font-size: 16px;
+
+  font-style: normal;
+
+  font-weight: 370;
+
+  line-height: 24px;
+
+  /* 150% */
+
+  text-decoration: none;
+}`;
+export {
+  compentStyle as default
+};
+//# sourceMappingURL=clock.css.js.map

package/dist/components/clock/clock.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/clock/clock.d.ts

@@ -0,0 +1,15 @@
+import { LitElement } from 'lit';
+import '../icon-button/icon-button';
+export declare class ObcClock extends LitElement {
+    date: string;
+    showDate: boolean;
+    blinkOnlyBreakpointPx: number;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-clock': ObcClock;
+    }
+}
+//# sourceMappingURL=clock.d.ts.map

package/dist/components/clock/clock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock.d.ts","sourceRoot":"","sources":["../../../src/components/clock/clock.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEhD,OAAO,4BAA4B,CAAC;AAkBpC,qBACa,QAAS,SAAQ,UAAU;IACZ,IAAI,SAA8B;IACT,QAAQ,UAAS;IAEpE,qBAAqB,SAAK;IAEjB,MAAM;IAoCf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}

package/dist/components/clock/clock.js

@@ -0,0 +1,87 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import "../icon-button/icon-button.js";
+import compentStyle from "./clock.css.js";
+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;
+};
+const monthNames = [
+  "Jan",
+  "Feb",
+  "Mar",
+  "Apr",
+  "May",
+  "Jun",
+  "Jul",
+  "Aug",
+  "Sep",
+  "Oct",
+  "Nov",
+  "Dec"
+];
+let ObcClock = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.date = "2021-01-01T11:11:11.111Z";
+    this.showDate = false;
+    this.blinkOnlyBreakpointPx = 0;
+  }
+  render() {
+    const date = new Date(this.date);
+    const hours = date.getHours();
+    const minutes = date.getMinutes();
+    const hoursString = hours < 10 ? `0${hours}` : `${hours}`;
+    const minutesString = minutes < 10 ? `0${minutes}` : `${minutes}`;
+    const day = date.getDate();
+    const month = monthNames[date.getMonth()];
+    const dateString = `${day}. ${month}`;
+    return html`
+      <style>
+        @media (max-width: ${this.blinkOnlyBreakpointPx}px) {
+          .clock {
+            display: none;
+          }
+          .clock.blink {
+            display: block;
+          }
+
+          :host {
+            padding: 0 !important;
+          }
+        }
+      </style>
+      <div class="clock">
+        ${hoursString}<span class="ticks">:</span>${minutesString}
+      </div>
+      <div class="clock blink">
+        <span class="ticks">:</span>
+      </div>
+      ${this.showDate ? html`<div class="date">${dateString}</div>` : null}
+    `;
+  }
+};
+ObcClock.styles = unsafeCSS(compentStyle);
+__decorateClass([
+  property({ type: String })
+], ObcClock.prototype, "date", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "show-date" })
+], ObcClock.prototype, "showDate", 2);
+__decorateClass([
+  property({ type: Number, attribute: "blink-only-breakpoint-px" })
+], ObcClock.prototype, "blinkOnlyBreakpointPx", 2);
+ObcClock = __decorateClass([
+  customElement("obc-clock")
+], ObcClock);
+export {
+  ObcClock
+};
+//# sourceMappingURL=clock.js.map

package/dist/components/clock/clock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock.js","sources":["../../../src/components/clock/clock.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport '../icon-button/icon-button';\nimport compentStyle from './clock.css?inline';\n\nconst monthNames = [\n  'Jan',\n  'Feb',\n  'Mar',\n  'Apr',\n  'May',\n  'Jun',\n  'Jul',\n  'Aug',\n  'Sep',\n  'Oct',\n  'Nov',\n  'Dec',\n];\n\n@customElement('obc-clock')\nexport class ObcClock extends LitElement {\n  @property({type: String}) date = '2021-01-01T11:11:11.111Z';\n  @property({type: Boolean, attribute: 'show-date'}) showDate = false;\n  @property({type: Number, attribute: 'blink-only-breakpoint-px'})\n  blinkOnlyBreakpointPx = 0;\n\n  override render() {\n    const date = new Date(this.date);\n    const hours = date.getHours();\n    const minutes = date.getMinutes();\n    const hoursString = hours < 10 ? `0${hours}` : `${hours}`;\n    const minutesString = minutes < 10 ? `0${minutes}` : `${minutes}`;\n\n    const day = date.getDate();\n    const month = monthNames[date.getMonth()];\n    const dateString = `${day}. ${month}`;\n\n    return html`\n      <style>\n        @media (max-width: ${this.blinkOnlyBreakpointPx}px) {\n          .clock {\n            display: none;\n          }\n          .clock.blink {\n            display: block;\n          }\n\n          :host {\n            padding: 0 !important;\n          }\n        }\n      </style>\n      <div class=\"clock\">\n        ${hoursString}<span class=\"ticks\">:</span>${minutesString}\n      </div>\n      <div class=\"clock blink\">\n        <span class=\"ticks\">:</span>\n      </div>\n      ${this.showDate ? html`<div class=\"date\">${dateString}</div>` : null}\n    `;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-clock': ObcClock;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAKA,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAGa,IAAA,WAAN,cAAuB,WAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA;AAC4B,SAAA,OAAA;AAC6B,SAAA,WAAA;AAEtC,SAAA,wBAAA;AAAA,EAAA;AAAA,EAEf,SAAS;AAChB,UAAM,OAAO,IAAI,KAAK,KAAK,IAAI;AACzB,UAAA,QAAQ,KAAK;AACb,UAAA,UAAU,KAAK;AACrB,UAAM,cAAc,QAAQ,KAAK,IAAI,KAAK,KAAK,GAAG,KAAK;AACvD,UAAM,gBAAgB,UAAU,KAAK,IAAI,OAAO,KAAK,GAAG,OAAO;AAEzD,UAAA,MAAM,KAAK;AACjB,UAAM,QAAQ,WAAW,KAAK,SAAU,CAAA;AACxC,UAAM,aAAa,GAAG,GAAG,KAAK,KAAK;AAE5B,WAAA;AAAA;AAAA,6BAEkB,KAAK,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAc7C,WAAW,+BAA+B,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,QAKzD,KAAK,WAAW,yBAAyB,UAAU,WAAW,IAAI;AAAA;AAAA,EAExE;AAGF;AA3Ca,SA0CK,SAAS,UAAU,YAAY;AAzCrB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,QAAO;AAAA,GADb,SACe,WAAA,QAAA,CAAA;AACyB,gBAAA;AAAA,EAAlD,SAAS,EAAC,MAAM,SAAS,WAAW,aAAY;AAAA,GAFtC,SAEwC,WAAA,YAAA,CAAA;AAEnD,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAQ,WAAW,4BAA2B;AAAA,GAHpD,SAIX,WAAA,yBAAA,CAAA;AAJW,WAAN,gBAAA;AAAA,EADN,cAAc,WAAW;AAAA,GACb,QAAA;"}

package/dist/components/context-menu/context-menu.css.js

@@ -0,0 +1,16 @@
+import { css } from "lit";
+const compentStyle = css`ol {
+    display: block;
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+    width: fit-content;
+
+    border-radius: 6px;
+    background: var(--normal-enabled-background-color);
+    box-shadow: var(--shadow-floating);
+}`;
+export {
+  compentStyle as default
+};
+//# sourceMappingURL=context-menu.css.js.map

package/dist/components/context-menu/context-menu.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/components/context-menu/context-menu.d.ts

@@ -0,0 +1,11 @@
+import { LitElement } from 'lit';
+export declare class ObcContextMenu extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-context-menu': ObcContextMenu;
+    }
+}
+//# sourceMappingURL=context-menu.d.ts.map

package/dist/components/context-menu/context-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.d.ts","sourceRoot":"","sources":["../../../src/components/context-menu/context-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,qBACa,cAAe,SAAQ,UAAU;IACnC,MAAM;IAMf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,cAAc,CAAC;KACpC;CACF"}

package/dist/components/context-menu/context-menu.js

@@ -0,0 +1,29 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { customElement } from "lit/decorators.js";
+import compentStyle from "./context-menu.css.js";
+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;
+};
+let ObcContextMenu = class extends LitElement {
+  render() {
+    return html` <ol>
+      <slot></slot>
+    </ol>`;
+  }
+};
+ObcContextMenu.styles = unsafeCSS(compentStyle);
+ObcContextMenu = __decorateClass([
+  customElement("obc-context-menu")
+], ObcContextMenu);
+export {
+  ObcContextMenu
+};
+//# sourceMappingURL=context-menu.js.map

package/dist/components/context-menu/context-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.js","sources":["../../../src/components/context-menu/context-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement} from 'lit/decorators.js';\nimport compentStyle from './context-menu.css?inline';\n\n@customElement('obc-context-menu')\nexport class ObcContextMenu extends LitElement {\n  override render() {\n    return html` <ol>\n      <slot></slot>\n    </ol>`;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-context-menu': ObcContextMenu;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAKa,IAAA,iBAAN,cAA6B,WAAW;AAAA,EACpC,SAAS;AACT,WAAA;AAAA;AAAA;AAAA,EAGT;AAGF;AARa,eAOK,SAAS,UAAU,YAAY;AAPpC,iBAAN,gBAAA;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB,cAAA;"}

package/dist/components/divider/divider.css.js

@@ -0,0 +1,12 @@
+import { css } from "lit";
+const compentStyle = css`:host {
+    width: 1px;
+    height: 24px;
+    flex-shrink: 0;
+    border-radius: 1px;
+    background: var(--border-divider-color, rgba(0, 0, 0, 0.08));
+}`;
+export {
+  compentStyle as default
+};
+//# sourceMappingURL=divider.css.js.map

package/dist/components/divider/divider.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/divider/divider.d.ts

@@ -0,0 +1,11 @@
+import { LitElement } from 'lit';
+export declare class ObcDivider extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-divider': ObcDivider;
+    }
+}
+//# sourceMappingURL=divider.d.ts.map

package/dist/components/divider/divider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.d.ts","sourceRoot":"","sources":["../../../src/components/divider/divider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,qBACa,UAAW,SAAQ,UAAU;IAC/B,MAAM;IAIf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/dist/components/divider/divider.js

@@ -0,0 +1,27 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { customElement } from "lit/decorators.js";
+import compentStyle from "./divider.css.js";
+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;
+};
+let ObcDivider = class extends LitElement {
+  render() {
+    return html``;
+  }
+};
+ObcDivider.styles = unsafeCSS(compentStyle);
+ObcDivider = __decorateClass([
+  customElement("obc-divider")
+], ObcDivider);
+export {
+  ObcDivider
+};
+//# sourceMappingURL=divider.js.map

package/dist/components/divider/divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.js","sources":["../../../src/components/divider/divider.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement} from 'lit/decorators.js';\nimport compentStyle from './divider.css?inline';\n\n@customElement('obc-divider')\nexport class ObcDivider extends LitElement {\n  override render() {\n    return html``;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-divider': ObcDivider;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAKa,IAAA,aAAN,cAAyB,WAAW;AAAA,EAChC,SAAS;AACT,WAAA;AAAA,EACT;AAGF;AANa,WAKK,SAAS,UAAU,YAAY;AALpC,aAAN,gBAAA;AAAA,EADN,cAAc,aAAa;AAAA,GACf,UAAA;"}

package/dist/components/icon-button/icon-button.css.js

@@ -0,0 +1,175 @@
+import { css } from "lit";
+const iconStyle = css`.wrapper {
+  padding: 0;
+  background: transparent;
+  height: 48px;
+  width: 48px;
+  appearance: none;
+  border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.wrapper .visible-wrapper {
+    border-radius: 6px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+.wrapper.corner-left {
+    justify-content: flex-end;
+  }
+.wrapper.corner-left .visible-wrapper {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
+    }
+.wrapper.corner-right {
+    justify-content: flex-start;
+  }
+.wrapper.corner-right .visible-wrapper {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
+    }
+.wrapper.size-regular .visible-wrapper {
+    height: 32px;
+    width: 32px;
+  }
+.wrapper.size-large .visible-wrapper {
+    height: 48px;
+    width: 48px;
+  }
+.wrapper .icon {
+    height: 24px;
+    width: 24px;
+  }
+.wrapper.variant-normal {
+    color: var(--on-normal-neutral-color);
+  }
+.wrapper.variant-normal {
+  cursor: pointer;
+}
+.wrapper.variant-normal:focus {
+  outline: none;
+}
+.wrapper.variant-normal.activated .visible-wrapper {
+  border-color: var(--normal-activated-border-color);
+  background-color: var(--normal-activated-background-color);
+}
+.wrapper.variant-normal .visible-wrapper {
+  border-color: var(--normal-enabled-border-color);
+  background-color: var(--normal-enabled-background-color);
+  border-width: 1px;
+  border-style: solid;
+  cursor: pointer;
+}
+.wrapper.variant-normal:focus-visible .visible-wrapper {
+  outline-color: hsla(211, 100%, 44%, 0.3);
+  outline-width: 4px;
+  outline-style: solid;
+}
+.wrapper.variant-normal:hover .visible-wrapper {
+  border-color: var(--normal-hover-border-color);
+  background-color: var(--normal-hover-background-color);
+}
+.wrapper.variant-normal:active .visible-wrapper {
+  border-color: var(--normal-pressed-border-color);
+  background-color: var(--normal-pressed-background-color);
+}
+.wrapper.variant-normal:disabled .visible-wrapper {
+  border-color: var(--normal-disabled-border-color);
+  background-color: var(--normal-disabled-background-color);
+  cursor: not-allowed;
+  color: var(--on-normal-disabled-color);
+}
+.wrapper.variant-normal.active-color {
+      color: var(--on-normal-active-color);
+    }
+.wrapper.variant-flat {
+    color: var(--on-flat-neutral-color);
+  }
+.wrapper.variant-flat {
+  cursor: pointer;
+}
+.wrapper.variant-flat:focus {
+  outline: none;
+}
+.wrapper.variant-flat.activated .visible-wrapper {
+  border-color: var(--flat-activated-border-color);
+  background-color: var(--flat-activated-background-color);
+}
+.wrapper.variant-flat .visible-wrapper {
+  border-color: var(--flat-enabled-border-color);
+  background-color: var(--flat-enabled-background-color);
+  border-width: 1px;
+  border-style: solid;
+  cursor: pointer;
+}
+.wrapper.variant-flat:focus-visible .visible-wrapper {
+  outline-color: hsla(211, 100%, 44%, 0.3);
+  outline-width: 4px;
+  outline-style: solid;
+}
+.wrapper.variant-flat:hover .visible-wrapper {
+  border-color: var(--flat-hover-border-color);
+  background-color: var(--flat-hover-background-color);
+}
+.wrapper.variant-flat:active .visible-wrapper {
+  border-color: var(--flat-pressed-border-color);
+  background-color: var(--flat-pressed-background-color);
+}
+.wrapper.variant-flat:disabled .visible-wrapper {
+  border-color: var(--flat-disabled-border-color);
+  background-color: var(--flat-disabled-background-color);
+  cursor: not-allowed;
+  color: var(--on-flat-disabled-color);
+}
+.wrapper.variant-flat.active-color {
+      color: var(--on-flat-active-color);
+    }
+.wrapper.variant-raised {
+    color: var(--on-raised-active-color);
+  }
+.wrapper.variant-raised {
+  cursor: pointer;
+}
+.wrapper.variant-raised:focus {
+  outline: none;
+}
+.wrapper.variant-raised.activated .visible-wrapper {
+  border-color: var(--raised-activated-border-color);
+  background-color: var(--raised-activated-background-color);
+}
+.wrapper.variant-raised .visible-wrapper {
+  border-color: var(--raised-enabled-border-color);
+  background-color: var(--raised-enabled-background-color);
+  border-width: 1px;
+  border-style: solid;
+  cursor: pointer;
+}
+.wrapper.variant-raised:focus-visible .visible-wrapper {
+  outline-color: hsla(211, 100%, 44%, 0.3);
+  outline-width: 4px;
+  outline-style: solid;
+}
+.wrapper.variant-raised:hover .visible-wrapper {
+  border-color: var(--raised-hover-border-color);
+  background-color: var(--raised-hover-background-color);
+}
+.wrapper.variant-raised:active .visible-wrapper {
+  border-color: var(--raised-pressed-border-color);
+  background-color: var(--raised-pressed-background-color);
+}
+.wrapper.variant-raised:disabled .visible-wrapper {
+  border-color: var(--raised-disabled-border-color);
+  background-color: var(--raised-disabled-background-color);
+  cursor: not-allowed;
+  color: var(--on-raised-disabled-color);
+}
+.wrapper.variant-raised.active-color {
+      color: var(--on-raised-active-color);
+    }
+`;
+export {
+  iconStyle as default
+};
+//# sourceMappingURL=icon-button.css.js.map

package/dist/components/icon-button/icon-button.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/icon-button/icon-button.d.ts

@@ -0,0 +1,17 @@
+import { LitElement } from 'lit';
+export declare class ObcIconButton extends LitElement {
+    variant: string;
+    size: string;
+    activated: boolean;
+    cornerLeft: boolean;
+    cornerRight: boolean;
+    activeColor: boolean;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: import("lit").CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-icon-button': ObcIconButton;
+    }
+}
+//# sourceMappingURL=icon-button.d.ts.map

package/dist/components/icon-button/icon-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.d.ts","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAKhD,qBACa,aAAc,SAAQ,UAAU;IACjB,OAAO,SAAY;IACnB,IAAI,SAAa;IAChB,SAAS,UAAS;IACQ,UAAU,UAAS;IAClB,WAAW,UAAS;IACpB,WAAW,UAAS;IAEjE,MAAM;IAsBf,OAAgB,MAAM,0BAAwB;CAC/C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,aAAa,CAAC;KAClC;CACF"}

package/dist/components/icon-button/icon-button.js

@@ -0,0 +1,73 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import iconStyle from "./icon-button.css.js";
+import { classMap } from "lit/directives/class-map.js";
+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;
+};
+let ObcIconButton = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.variant = "normal";
+    this.size = "regular";
+    this.activated = false;
+    this.cornerLeft = false;
+    this.cornerRight = false;
+    this.activeColor = false;
+  }
+  render() {
+    return html`
+      <button
+        class=${classMap({
+      wrapper: true,
+      ["variant-" + this.variant]: true,
+      ["size-" + this.size]: true,
+      activated: this.activated,
+      "corner-left": this.cornerLeft,
+      "corner-right": this.cornerRight,
+      "active-color": this.activeColor
+    })}
+      >
+        <div class="visible-wrapper">
+          <div class="icon">
+            <slot></slot>
+          </div>
+        </div>
+      </button>
+    `;
+  }
+};
+ObcIconButton.styles = unsafeCSS(iconStyle);
+__decorateClass([
+  property({ type: String })
+], ObcIconButton.prototype, "variant", 2);
+__decorateClass([
+  property({ type: String })
+], ObcIconButton.prototype, "size", 2);
+__decorateClass([
+  property({ type: Boolean })
+], ObcIconButton.prototype, "activated", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "corner-left" })
+], ObcIconButton.prototype, "cornerLeft", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "corner-right" })
+], ObcIconButton.prototype, "cornerRight", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: "active-color" })
+], ObcIconButton.prototype, "activeColor", 2);
+ObcIconButton = __decorateClass([
+  customElement("obc-icon-button")
+], ObcIconButton);
+export {
+  ObcIconButton
+};
+//# sourceMappingURL=icon-button.js.map

package/dist/components/icon-button/icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-button.js","sources":["../../../src/components/icon-button/icon-button.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport iconStyle from './icon-button.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\n\n@customElement('obc-icon-button')\nexport class ObcIconButton extends LitElement {\n  @property({type: String}) variant = 'normal';\n  @property({type: String}) size = 'regular';\n  @property({type: Boolean}) activated = false;\n  @property({type: Boolean, attribute: 'corner-left'}) cornerLeft = false;\n  @property({type: Boolean, attribute: 'corner-right'}) cornerRight = false;\n  @property({type: Boolean, attribute: 'active-color'}) activeColor = false;\n\n  override render() {\n    return html`\n      <button\n        class=${classMap({\n          wrapper: true,\n          ['variant-' + this.variant]: true,\n          ['size-' + this.size]: true,\n          activated: this.activated,\n          'corner-left': this.cornerLeft,\n          'corner-right': this.cornerRight,\n          'active-color': this.activeColor,\n        })}\n      >\n        <div class=\"visible-wrapper\">\n          <div class=\"icon\">\n            <slot></slot>\n          </div>\n        </div>\n      </button>\n    `;\n  }\n\n  static override styles = unsafeCSS(iconStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-icon-button': ObcIconButton;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAMa,IAAA,gBAAN,cAA4B,WAAW;AAAA,EAAvC,cAAA;AAAA,UAAA,GAAA,SAAA;AAC+B,SAAA,UAAA;AACH,SAAA,OAAA;AACM,SAAA,YAAA;AAC2B,SAAA,aAAA;AACE,SAAA,cAAA;AACA,SAAA,cAAA;AAAA,EAAA;AAAA,EAE3D,SAAS;AACT,WAAA;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,SAAS;AAAA,MACT,CAAC,aAAa,KAAK,OAAO,GAAG;AAAA,MAC7B,CAAC,UAAU,KAAK,IAAI,GAAG;AAAA,MACvB,WAAW,KAAK;AAAA,MAChB,eAAe,KAAK;AAAA,MACpB,gBAAgB,KAAK;AAAA,MACrB,gBAAgB,KAAK;AAAA,IAAA,CACtB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASR;AAGF;AA/Ba,cA8BK,SAAS,UAAU,SAAS;AA7BlB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,QAAO;AAAA,GADb,cACe,WAAA,WAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,QAAO;AAAA,GAFb,cAEe,WAAA,QAAA,CAAA;AACC,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,SAAQ;AAAA,GAHd,cAGgB,WAAA,aAAA,CAAA;AAC0B,gBAAA;AAAA,EAApD,SAAS,EAAC,MAAM,SAAS,WAAW,eAAc;AAAA,GAJxC,cAI0C,WAAA,cAAA,CAAA;AACC,gBAAA;AAAA,EAArD,SAAS,EAAC,MAAM,SAAS,WAAW,gBAAe;AAAA,GALzC,cAK2C,WAAA,eAAA,CAAA;AACA,gBAAA;AAAA,EAArD,SAAS,EAAC,MAAM,SAAS,WAAW,gBAAe;AAAA,GANzC,cAM2C,WAAA,eAAA,CAAA;AAN3C,gBAAN,gBAAA;AAAA,EADN,cAAc,iBAAiB;AAAA,GACnB,aAAA;"}