@nectary/components 4.12.0 → 4.12.1

package/card-v2/index.js

@@ -1,19 +1,17 @@
-import { updateBooleanAttribute, updateAttribute, getBooleanAttribute, setClass, isAttrTrue } from "../utils/dom.js";
-import { defineCustomElement, NectaryElement } from "../utils/element.js";
-import { getReactEventHandler } from "../utils/get-react-event-handler.js";
-const templateHTML = '<style>\n:host {\n  display: flex;\n}\n\n.empty {\n  display: none !important;\n}\n\n#card {\n  border-radius: var(--sinch-comp-card-v2-shape-radius);\n  border: 1px solid var(--sinch-comp-card-v2-color-default-border-initial);\n  background-color: var(--sinch-comp-card-v2-color-default-background-initial);\n  box-shadow: var(--sinch-comp-card-v2-shadow-initial);\n  overflow: hidden;\n  transition: 0.15s linear;\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n}\n\n#card-media {\n  display: block;\n  overflow: hidden;\n}\n\n#body {\n  display: flex;\n  flex-direction: column;\n  padding: 16px;\n  gap: 8px;\n  align-self: stretch;\n  flex: 1;\n}\n\n#card-title {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 8px;\n  align-self: stretch;\n}\n\n#card-content {\n  display: flex;\n  gap: 10px;\n  align-self: stretch;\n}\n\n#card-footer {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 16px;\n  align-self: stretch;\n  margin-top: auto;\n}\n\n:host([selected]:not([selected="false"])) #card {\n  background-color: var(--sinch-comp-card-v2-color-selected-background-initial);\n  border-color: var(--sinch-comp-card-v2-color-selected-border-initial);\n  cursor: pointer;\n}\n\n:host([clickable]:not([clickable="false"])) #card {\n  cursor: pointer;\n}\n\n:host([disabled]:not([disabled="false"])) #card {\n  box-shadow: var(--sinch-comp-card-v2-shadow-disabled);\n  background-color: var(--sinch-comp-card-v2-color-default-background-disabled);\n  border-color: var(--sinch-comp-card-v2-color-default-border-disabled);\n  cursor: not-allowed;\n}\n\n:host([clickable]:not([clickable="false"]):is(:not([disabled]), [disabled="false"]):hover) #card {\n  background-color: var(--sinch-comp-card-v2-color-default-background-hover);\n  border-color: var(--sinch-comp-card-v2-color-default-border-hover);\n  box-shadow: var(--sinch-comp-card-v2-shadow-hover);\n}\n\n:host([clickable]:not([clickable="false"]):is(:not([disabled]), [disabled="false"]):active) #card {\n  background-color: var(--sinch-comp-card-v2-color-default-background-active);\n  border-color: var(--sinch-comp-card-v2-color-default-border-active);\n  box-shadow: var(--sinch-comp-card-v2-shadow-active);\n}\n\n:host([selected]:not([selected="false"]):is(:not([disabled]), [disabled="false"]):hover) #card {\n  background-color: var(--sinch-comp-card-v2-color-selected-background-hover);\n  border-color: var(--sinch-comp-card-v2-color-selected-border-hover);\n}\n\n:host([selected]:not([selected="false"]):is(:not([disabled]), [disabled="false"]):active) #card {\n  background-color: var(--sinch-comp-card-v2-color-selected-background-active);\n  border-color: var(--sinch-comp-card-v2-color-selected-border-active);\n}\n\n:host([selected]:not([selected="false"])[disabled]:not([disabled="false"])) #card {\n  background-color: var(--sinch-comp-card-v2-color-selected-background-disabled);\n  border-color: var(--sinch-comp-card-v2-color-selected-border-disabled);\n}\n\n::slotted([slot="content"]) {\n  max-width: 100%;\n  color: var(--sinch-comp-card-v2-color-default-description-initial);\n  font-size: var(--sinch-comp-card-v2-font-description);\n}\n\n::slotted([slot="title"]) {\n  max-width: 100%;\n}\n\n::slotted([slot="footer"]) {\n  max-width: 100%;\n}\n\n:host([selected]:not([selected="false"])) ::slotted([slot="content"]) {\n  color: var(--sinch-comp-card-v2-color-selected-description-initial);\n}\n\n:host([disabled]:not([disabled="false"])) ::slotted([slot="content"]) {\n  color: var(--sinch-comp-card-v2-color-default-description-disabled);\n}\n\n:host([selected]:not([selected="false"])[disabled]:not([disabled="false"])) ::slotted([slot="content"]) {\n  color: var(--sinch-comp-card-v2-color-selected-description-disabled);\n}\n\n</style>\n\n<div id="card">\n  <div id="card-media">\n    <slot name="media"></slot>\n  </div>\n  <div id="body">\n    <div id="card-title">\n      <slot name="title"></slot>\n    </div>\n    <div id="card-content">\n      <slot name="content"></slot>\n    </div>\n    <div id="card-footer">\n      <slot name="footer"></slot>\n    </div>\n  </div>\n</div>\n';
-const template = document.createElement("template");
+import { defineCustomElement, NectaryElement, updateBooleanAttribute, getReactEventHandler, getBooleanAttribute, updateAttribute, isAttrTrue, setClass } from '../utils';
+const templateHTML = '<style>:host{display:flex}.empty{display:none!important}#card{border-radius:var(--sinch-comp-card-v2-shape-radius);border:1px solid var(--sinch-comp-card-v2-color-default-border-initial);background-color:var(--sinch-comp-card-v2-color-default-background-initial);box-shadow:var(--sinch-comp-card-v2-shadow-initial);overflow:hidden;transition:.15s linear;display:flex;flex-direction:column;flex:1}#card-media{display:block;overflow:hidden}#body{display:flex;flex-direction:column;padding:16px;gap:8px;align-self:stretch;flex:1}#card-title{display:flex;flex-direction:row;align-items:center;gap:8px;align-self:stretch}#card-content{display:flex;gap:10px;align-self:stretch}#card-footer{display:flex;flex-direction:row;align-items:center;gap:16px;align-self:stretch;margin-top:auto}:host([selected]:not([selected=false])) #card{background-color:var(--sinch-comp-card-v2-color-selected-background-initial);border-color:var(--sinch-comp-card-v2-color-selected-border-initial);cursor:pointer}:host([clickable]:not([clickable=false])) #card{cursor:pointer}:host([disabled]:not([disabled=false])) #card{box-shadow:var(--sinch-comp-card-v2-shadow-disabled);background-color:var(--sinch-comp-card-v2-color-default-background-disabled);border-color:var(--sinch-comp-card-v2-color-default-border-disabled);cursor:not-allowed}:host([clickable]:not([clickable=false]):is(:not([disabled]),[disabled=false]):hover) #card{background-color:var(--sinch-comp-card-v2-color-default-background-hover);border-color:var(--sinch-comp-card-v2-color-default-border-hover);box-shadow:var(--sinch-comp-card-v2-shadow-hover)}:host([clickable]:not([clickable=false]):is(:not([disabled]),[disabled=false]):active) #card{background-color:var(--sinch-comp-card-v2-color-default-background-active);border-color:var(--sinch-comp-card-v2-color-default-border-active);box-shadow:var(--sinch-comp-card-v2-shadow-active)}:host([selected]:not([selected=false]):is(:not([disabled]),[disabled=false]):hover) #card{background-color:var(--sinch-comp-card-v2-color-selected-background-hover);border-color:var(--sinch-comp-card-v2-color-selected-border-hover)}:host([selected]:not([selected=false]):is(:not([disabled]),[disabled=false]):active) #card{background-color:var(--sinch-comp-card-v2-color-selected-background-active);border-color:var(--sinch-comp-card-v2-color-selected-border-active)}:host([selected]:not([selected=false])[disabled]:not([disabled=false])) #card{background-color:var(--sinch-comp-card-v2-color-selected-background-disabled);border-color:var(--sinch-comp-card-v2-color-selected-border-disabled)}::slotted([slot=content]){max-width:100%;color:var(--sinch-comp-card-v2-color-default-description-initial);font-size:var(--sinch-comp-card-v2-font-description)}::slotted([slot=title]){max-width:100%}::slotted([slot=footer]){max-width:100%}:host([selected]:not([selected=false])) ::slotted([slot=content]){color:var(--sinch-comp-card-v2-color-selected-description-initial)}:host([disabled]:not([disabled=false])) ::slotted([slot=content]){color:var(--sinch-comp-card-v2-color-default-description-disabled)}:host([selected]:not([selected=false])[disabled]:not([disabled=false])) ::slotted([slot=content]){color:var(--sinch-comp-card-v2-color-selected-description-disabled)}</style><div id="card"><div id="card-media"><slot name="media"></slot></div><div id="body"><div id="card-title"><slot name="title"></slot></div><div id="card-content"><slot name="content"></slot></div><div id="card-footer"><slot name="footer"></slot></div></div></div>';
+const template = document.createElement('template');
 template.innerHTML = templateHTML;
-const CLICK_EVENTS = ["click", "-click"];
-class CardV2 extends NectaryElement {
+const CLICK_EVENTS = ['click', '-click'];
+export class CardV2 extends NectaryElement {
   #$slots;
   #controller = null;
-  #clickEventListeners = /* @__PURE__ */ new Map();
+  #clickEventListeners = (() => new Map())();
   constructor() {
     super();
     const shadowRoot = this.attachShadow();
     shadowRoot.appendChild(template.content.cloneNode(true));
-    this.#$slots = shadowRoot.querySelectorAll("slot");
+    this.#$slots = shadowRoot.querySelectorAll('slot');
   }
   connectedCallback() {
     super.connectedCallback();
@@ -25,7 +23,8 @@ class CardV2 extends NectaryElement {
     this.#controller?.abort();
     this.#controller = null;
   }
-  addEventListener(type, listener, options, isInitial = false) {
+  addEventListener(type, listener, options) {
+    let isInitial = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
     super.addEventListener(type, listener, options);
     if (!isInitial && this.#isClickEvent(type)) {
       this.#handleClickListenerAdded(type, listener);
@@ -42,96 +41,95 @@ class CardV2 extends NectaryElement {
   }
   #setupEventListeners() {
     this.#controller = new AbortController();
-    const options = { signal: this.#controller.signal };
-    const handleClick = (e) => {
+    const options = {
+      signal: this.#controller.signal
+    };
+    const handleClick = e => {
       if (this.disabled) {
         e.stopPropagation();
         e.preventDefault();
       } else {
-        this.dispatchEvent(
-          new CustomEvent("-click")
-        );
+        this.dispatchEvent(new CustomEvent('-click'));
       }
     };
-    const handleReactClick = (e) => {
-      getReactEventHandler(this, "on-click")?.(e);
+    const handleReactClick = e => {
+      getReactEventHandler(this, 'on-click')?.(e);
     };
-    this.addEventListener("click", handleClick, options, true);
-    this.addEventListener("-click", handleReactClick, options, true);
-    const handleSlotChange = (slot) => {
+    this.addEventListener('click', handleClick, options, true);
+    this.addEventListener('-click', handleReactClick, options, true);
+    const handleSlotChange = slot => {
       const isEmpty = slot.assignedNodes().length <= 0;
-      setClass(slot.parentElement, "empty", isEmpty);
+      setClass(slot.parentElement, 'empty', isEmpty);
     };
-    this.#$slots.forEach((slot) => {
+    this.#$slots.forEach(slot => {
       handleSlotChange(slot);
-      slot.addEventListener("slotchange", () => handleSlotChange(slot), options);
+      slot.addEventListener('slotchange', () => handleSlotChange(slot), options);
     });
   }
   #updateClickableState() {
-    const hasClickHandler = this.hasAttribute("onclick") === true || Boolean(getReactEventHandler(this, "on-click"));
-    if (this.hasAttribute("clickable") === false && hasClickHandler) {
-      updateBooleanAttribute(this, "clickable", true);
+    const hasClickHandler = this.hasAttribute('onclick') || Boolean(getReactEventHandler(this, 'on-click'));
+    if (!this.hasAttribute('clickable') && hasClickHandler) {
+      updateBooleanAttribute(this, 'clickable', true);
     }
   }
   #handleClickListenerAdded(type, listener) {
-    const listeners = this.#clickEventListeners.get(type) ?? /* @__PURE__ */ new Set();
+    const listeners = this.#clickEventListeners.get(type) ?? new Set();
     if (!listeners.has(listener)) {
       listeners.add(listener);
       this.#clickEventListeners.set(type, listeners);
     }
-    if (this.hasAttribute("clickable") === false) {
-      updateBooleanAttribute(this, "clickable", true);
+    if (!this.hasAttribute('clickable')) {
+      updateBooleanAttribute(this, 'clickable', true);
     }
   }
   #handleClickListenerRemoved(type, listener) {
     const listeners = this.#clickEventListeners.get(type);
     listeners?.delete(listener);
-    const hasListeners = Array.from(this.#clickEventListeners.values()).some((set) => set.size > 0);
-    if (!hasListeners && this.getAttribute("clickable") === "") {
-      updateBooleanAttribute(this, "clickable", false);
+    const hasListeners = Array.from(this.#clickEventListeners.values()).some(set => set.size > 0);
+    if (!hasListeners && this.getAttribute('clickable') === '') {
+      updateBooleanAttribute(this, 'clickable', false);
     }
   }
   static get observedAttributes() {
-    return ["clickable", "disabled", "selected"];
+    return ['clickable', 'disabled', 'selected'];
   }
   attributeChangedCallback(name, _oldVal, newVal) {
     switch (name) {
-      case "clickable": {
-        const isClickable = isAttrTrue(newVal);
-        if (isClickable) {
-          updateAttribute(this, "role", "button");
-          updateAttribute(this, "tabindex", "0");
-        } else {
-          updateAttribute(this, "role", null);
-          updateAttribute(this, "tabindex", null);
+      case 'clickable':
+        {
+          const isClickable = isAttrTrue(newVal);
+          if (isClickable) {
+            updateAttribute(this, 'role', 'button');
+            updateAttribute(this, 'tabindex', '0');
+          } else {
+            updateAttribute(this, 'role', null);
+            updateAttribute(this, 'tabindex', null);
+          }
+          break;
         }
-        break;
-      }
-      case "selected":
-      case "disabled": {
-        const bool = isAttrTrue(newVal);
-        const titleElement = this.querySelector("sinch-card-v2-title");
-        if (titleElement !== null) {
-          updateBooleanAttribute(titleElement, name, bool);
+      case 'selected':
+      case 'disabled':
+        {
+          const bool = isAttrTrue(newVal);
+          const titleElement = this.querySelector('sinch-card-v2-title');
+          if (titleElement !== null) {
+            updateBooleanAttribute(titleElement, name, bool);
+          }
+          break;
         }
-        break;
-      }
     }
   }
   get disabled() {
-    return getBooleanAttribute(this, "disabled");
+    return getBooleanAttribute(this, 'disabled');
   }
   set disabled(value) {
-    updateBooleanAttribute(this, "disabled", value);
+    updateBooleanAttribute(this, 'disabled', value);
   }
   get selected() {
-    return getBooleanAttribute(this, "selected");
+    return getBooleanAttribute(this, 'selected');
   }
   set selected(value) {
-    updateBooleanAttribute(this, "selected", value);
+    updateBooleanAttribute(this, 'selected', value);
   }
 }
-defineCustomElement("sinch-card-v2", CardV2);
-export {
-  CardV2
-};
+defineCustomElement('sinch-card-v2', CardV2);

package/card-v2/types.d.ts

@@ -1,4 +1,4 @@
-import type { NectaryComponentReactByType, NectaryComponentVanillaByType, NectaryComponentReact, NectaryComponentVanilla } from '../types';
+import type { NectaryComponentReactByType, NectaryComponentVanillaByType } from '../types';
 export type TSinchCardV2Props = {
     /** Disabled */
     disabled?: boolean;
@@ -49,23 +49,3 @@ export type TSinchCardV2 = {
 };
 export type TSinchCardV2Element = NectaryComponentVanillaByType<TSinchCardV2>;
 export type TSinchCardV2React = NectaryComponentReactByType<TSinchCardV2>;
-declare global {
-    interface NectaryComponentMap {
-        'sinch-card-v2': TSinchCardV2;
-    }
-    interface HTMLElementTagNameMap {
-        'sinch-card-v2': NectaryComponentVanilla<'sinch-card-v2'>;
-    }
-    namespace JSX {
-        interface IntrinsicElements {
-            'sinch-card-v2': NectaryComponentReact<'sinch-card-v2'>;
-        }
-    }
-}
-declare module 'react' {
-    namespace JSX {
-        interface IntrinsicElements extends globalThis.JSX.IntrinsicElements {
-            'sinch-card-v2': NectaryComponentReact<'sinch-card-v2'>;
-        }
-    }
-}

package/card-v2/types.js

@@ -1 +1 @@
-
+export {};

package/card-v2-title/index.d.ts

@@ -1,6 +1,6 @@
 import { NectaryElement } from '../utils';
-import type { TSinchOrientation } from './types';
-export * from './types';
+import type { TSinchOrientation, TSinchCardTitle } from './types';
+import type { NectaryComponentReact, NectaryComponentVanilla } from '../types';
 export declare class CardV2Title extends NectaryElement {
     #private;
     constructor();
@@ -14,3 +14,23 @@ export declare class CardV2Title extends NectaryElement {
     set ellipsis(isEllipsis: boolean);
     get ellipsis(): boolean;
 }
+declare global {
+    interface NectaryComponentMap {
+        'sinch-card-v2-title': TSinchCardTitle;
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-card-v2-title': NectaryComponentVanilla<'sinch-card-v2-title'>;
+    }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-card-v2-title': NectaryComponentReact<'sinch-card-v2-title'>;
+        }
+    }
+}
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements extends globalThis.JSX.IntrinsicElements {
+            'sinch-card-v2-title': NectaryComponentReact<'sinch-card-v2-title'>;
+        }
+    }
+}

package/card-v2-title/index.js

@@ -1,58 +1,56 @@
-import { updateBooleanAttribute, getAttribute, updateAttribute, getBooleanAttribute, isAttrTrue } from "../utils/dom.js";
-import { defineCustomElement, NectaryElement } from "../utils/element.js";
-const templateHTML = '<style>\n:host {\n  display: block;\n}\n\n#title {\n  display: flex;\n  align-items: center;\n  flex-direction: row;\n}\n\n#title-text {\n  font: var(--sinch-comp-card-v2-font-title);\n  color: var(--sinch-comp-card-v2-color-default-title-initial);\n}\n\n#title-icon {\n  display: flex;\n}\n\n:host([orientation="vertical"]) #title {\n  align-items: start;\n  flex-direction: column;\n}\n\n:host([disabled]:not([disabled="false"])) #title-text {\n  color: var(--sinch-comp-card-v2-color-default-title-disabled);\n}\n\n:host([selected]:not([selected="false"])[disabled]:not([disabled="false"])) #title-text {\n  color: var(--sinch-comp-card-v2-color-selected-title-disabled);\n}\n\n::slotted([slot="icon"]) {\n  --sinch-global-color-icon: var(--sinch-comp-card-v2-color-default-icon-initial);\n  --sinch-global-size-icon: var(--sinch-comp-card-v2-size-icon);\n\n  margin-right: 8px;\n  margin-bottom: 0;\n}\n\n:host([orientation="vertical"]) ::slotted([slot="icon"]) {\n  margin-right: 0;\n  margin-bottom: 8px;\n}\n\n:host([selected]:not([selected="false"])) ::slotted([slot="icon"]) {\n  --sinch-global-color-icon: var(--sinch-comp-card-v2-color-selected-icon-initial);\n}\n\n:host([disabled]:not([disabled="false"])) ::slotted([slot="icon"]) {\n  --sinch-global-color-icon: var(--sinch-comp-card-v2-color-default-icon-disabled);\n}\n\n:host([selected]:not([selected="false"])[disabled]:not([disabled="false"])) ::slotted([slot="icon"]) {\n  --sinch-global-color-icon: var(--sinch-comp-card-v2-color-selected-icon-disabled);\n}\n\n</style>\n\n<div id="title">\n  <div id="title-icon">\n    <slot name="icon"></slot>\n  </div>\n  <sinch-text id="title-text" type="m"></sinch-text>\n</div>\n';
-const template = document.createElement("template");
+import { defineCustomElement, getAttribute, updateAttribute, NectaryElement, updateBooleanAttribute, getBooleanAttribute, isAttrTrue } from '../utils';
+const templateHTML = '<style>:host{display:block}#title{display:flex;align-items:center;flex-direction:row}#title-text{font:var(--sinch-comp-card-v2-font-title);color:var(--sinch-comp-card-v2-color-default-title-initial)}#title-icon{display:flex}:host([orientation=vertical]) #title{align-items:start;flex-direction:column}:host([disabled]:not([disabled=false])) #title-text{color:var(--sinch-comp-card-v2-color-default-title-disabled)}:host([selected]:not([selected=false])[disabled]:not([disabled=false])) #title-text{color:var(--sinch-comp-card-v2-color-selected-title-disabled)}::slotted([slot=icon]){--sinch-global-color-icon:var(--sinch-comp-card-v2-color-default-icon-initial);--sinch-global-size-icon:var(--sinch-comp-card-v2-size-icon);margin-right:8px;margin-bottom:0}:host([orientation=vertical]) ::slotted([slot=icon]){margin-right:0;margin-bottom:8px}:host([selected]:not([selected=false])) ::slotted([slot=icon]){--sinch-global-color-icon:var(--sinch-comp-card-v2-color-selected-icon-initial)}:host([disabled]:not([disabled=false])) ::slotted([slot=icon]){--sinch-global-color-icon:var(--sinch-comp-card-v2-color-default-icon-disabled)}:host([selected]:not([selected=false])[disabled]:not([disabled=false])) ::slotted([slot=icon]){--sinch-global-color-icon:var(--sinch-comp-card-v2-color-selected-icon-disabled)}</style><div id="title"><div id="title-icon"><slot name="icon"></slot></div><sinch-text id="title-text" type="m"></sinch-text></div>';
+const template = document.createElement('template');
 template.innerHTML = templateHTML;
-class CardV2Title extends NectaryElement {
+export class CardV2Title extends NectaryElement {
   #$text;
   constructor() {
     super();
     const shadowRoot = this.attachShadow();
     shadowRoot.appendChild(template.content.cloneNode(true));
-    this.#$text = shadowRoot.querySelector("#title-text");
+    this.#$text = shadowRoot.querySelector('#title-text');
   }
   connectedCallback() {
     super.connectedCallback();
-    if (this.hasAttribute("orientation") === false) {
-      this.setAttribute("orientation", "horizontal");
+    if (!this.hasAttribute('orientation')) {
+      this.setAttribute('orientation', 'horizontal');
     }
   }
   static get observedAttributes() {
-    return ["text", "ellipsis"];
+    return ['text', 'ellipsis'];
   }
   attributeChangedCallback(name, oldVal, newVal) {
     switch (name) {
-      case "text": {
-        this.#$text.textContent = newVal;
-        break;
-      }
-      case "ellipsis": {
-        const bool = isAttrTrue(newVal);
-        updateBooleanAttribute(this.#$text, "ellipsis", bool);
-        break;
-      }
+      case 'text':
+        {
+          this.#$text.textContent = newVal;
+          break;
+        }
+      case 'ellipsis':
+        {
+          const bool = isAttrTrue(newVal);
+          updateBooleanAttribute(this.#$text, 'ellipsis', bool);
+          break;
+        }
     }
   }
   get text() {
-    return getAttribute(this, "text", "");
+    return getAttribute(this, 'text', '');
   }
   set text(value) {
-    updateAttribute(this, "text", value);
+    updateAttribute(this, 'text', value);
   }
   get orientation() {
-    return getAttribute(this, "orientation", "");
+    return getAttribute(this, 'orientation', '');
   }
   set orientation(value) {
-    updateAttribute(this, "orientation", value);
+    updateAttribute(this, 'orientation', value);
   }
   set ellipsis(isEllipsis) {
-    updateBooleanAttribute(this, "ellipsis", isEllipsis);
+    updateBooleanAttribute(this, 'ellipsis', isEllipsis);
   }
   get ellipsis() {
-    return getBooleanAttribute(this, "ellipsis");
+    return getBooleanAttribute(this, 'ellipsis');
   }
 }
-defineCustomElement("sinch-card-v2-title", CardV2Title);
-export {
-  CardV2Title
-};
+defineCustomElement('sinch-card-v2-title', CardV2Title);

package/card-v2-title/types.d.ts

@@ -1,4 +1,4 @@
-import type { NectaryComponentReactByType, NectaryComponentVanillaByType, NectaryComponentReact, NectaryComponentVanilla } from '../types';
+import type { NectaryComponentReactByType, NectaryComponentVanillaByType } from '../types';
 export type TSinchOrientation = 'horizontal' | 'vertical';
 export type TSinchCardTitleProps = {
     /** Text */
@@ -30,23 +30,3 @@ export type TSinchCardTitle = {
 };
 export type TSinchCardTitleElement = NectaryComponentVanillaByType<TSinchCardTitle>;
 export type TSinchCardTitleReact = NectaryComponentReactByType<TSinchCardTitle>;
-declare global {
-    interface NectaryComponentMap {
-        'sinch-card-v2-title': TSinchCardTitle;
-    }
-    interface HTMLElementTagNameMap {
-        'sinch-card-v2-title': NectaryComponentVanilla<'sinch-card-v2-title'>;
-    }
-    namespace JSX {
-        interface IntrinsicElements {
-            'sinch-card-v2-title': NectaryComponentReact<'sinch-card-v2-title'>;
-        }
-    }
-}
-declare module 'react' {
-    namespace JSX {
-        interface IntrinsicElements extends globalThis.JSX.IntrinsicElements {
-            'sinch-card-v2-title': NectaryComponentReact<'sinch-card-v2-title'>;
-        }
-    }
-}

package/card-v2-title/types.js

@@ -1 +1 @@
-
+export {};

package/checkbox/index.d.ts

@@ -1,6 +1,7 @@
 import '../rich-text';
 import { NectaryElement } from '../utils';
-export * from './types';
+import type { TSinchCheckbox } from './types';
+import type { NectaryComponentReact, NectaryComponentVanilla } from '../types';
 export declare class Checkbox extends NectaryElement {
     #private;
     static formAssociated: boolean;
@@ -28,3 +29,23 @@ export declare class Checkbox extends NectaryElement {
     get text(): string | null;
     get focusable(): boolean;
 }
+declare global {
+    interface NectaryComponentMap {
+        'sinch-checkbox': TSinchCheckbox;
+    }
+    interface HTMLElementTagNameMap {
+        'sinch-checkbox': NectaryComponentVanilla<'sinch-checkbox'>;
+    }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-checkbox': NectaryComponentReact<'sinch-checkbox'>;
+        }
+    }
+}
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements extends globalThis.JSX.IntrinsicElements {
+            'sinch-checkbox': NectaryComponentReact<'sinch-checkbox'>;
+        }
+    }
+}