@nectary/components 4.7.8 → 4.8.1

package/accordion/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-accordion': TSinchAccordionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-accordion': TSinchAccordionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/accordion-item/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-accordion-item': TSinchAccordionItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-accordion-item': TSinchAccordionItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/action-menu/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-action-menu': TSinchActionMenuElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-action-menu': TSinchActionMenuReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/action-menu-option/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-action-menu-option': TSinchActionMenuOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-action-menu-option': TSinchActionMenuOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/alert/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-alert': TSinchAlertElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-alert': TSinchAlertReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/avatar/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-avatar': TSinchAvatarElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-avatar': TSinchAvatarReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/badge/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-badge': TSinchBadgeElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-badge': TSinchBadgeReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/button/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-button': TSinchButtonElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-button': TSinchButtonReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/button-group/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-button-group': TSinchButtonGroupElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-button-group': TSinchButtonGroupReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/button-group-item/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-button-group-item': TSinchButtonGroupItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-button-group-item': TSinchButtonGroupItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/card/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-card': TSinchCardElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-card': TSinchCardReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/card-container/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-card-container': TSinchCardContainerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-card-container': TSinchCardContainerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/card-v2/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-card-v2': TSinchCardV2Element;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-card-v2': TSinchCardV2React;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

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

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-card-v2-title': TSinchCardTitleElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-card-v2-title': TSinchCardTitleReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/checkbox/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-checkbox': TSinchCheckboxElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-checkbox': TSinchCheckboxReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/chip/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-chip': TSinchChipElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-chip': TSinchChipReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/code-tag/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-code-tag': TSinchCodeTagElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-code-tag': TSinchCodeTagReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/color-menu/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-color-menu': TSinchColorMenuElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-color-menu': TSinchColorMenuReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/color-menu-option/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-color-menu-option': TSinchColorMenuOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-color-menu-option': TSinchColorMenuOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/color-swatch/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-color-swatch': TSinchColorSwatchElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-color-swatch': TSinchColorSwatchReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/date-picker/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-date-picker': TSinchDatePickerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-date-picker': TSinchDatePickerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/dialog/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-dialog': TSinchDialogElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-dialog': TSinchDialogReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/emoji/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-emoji': TSinchEmojiElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-emoji': TSinchEmojiReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/emoji-picker/index.d.ts

@@ -13,6 +13,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-emoji-picker': TSinchEmojiPickerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-emoji-picker': TSinchEmojiPickerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/field/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-field': TSinchFieldElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-field': TSinchFieldReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/file-drop/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-file-drop': TSinchFileDropElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-file-drop': TSinchFileDropReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/file-picker/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-file-picker': TSinchFilePickerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-file-picker': TSinchFilePickerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/file-status/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-file-status': TSinchFileStatusElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-file-status': TSinchFileStatusReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/flag/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-flag': TSinchFlagElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-flag': TSinchFlagReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/grid/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-grid': TSinchGridElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-grid': TSinchGridReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/grid-item/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-grid-item': TSinchGridItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-grid-item': TSinchGridItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/help-tooltip/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-help-tooltip': TSinchHelpTooltipElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-help-tooltip': TSinchHelpTooltipReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/horizontal-stepper/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-horizontal-stepper': TSinchHorizontalStepperElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-horizontal-stepper': TSinchHorizontalStepperReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/horizontal-stepper-item/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-horizontal-stepper-item': TSinchHorizontalStepperItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-horizontal-stepper-item': TSinchHorizontalStepperItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/icon/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-icon': TSinchIconElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-icon': TSinchIconReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/inline-alert/index.d.ts

@@ -7,6 +7,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-inline-alert': TSinchInlineAlertElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-inline-alert': TSinchInlineAlertReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/inline-alert/index.js

@@ -3,7 +3,7 @@ import '../rich-text';
 import '../text';
 import '../title';
 import { defineCustomElement, getAttribute, getLiteralAttribute, updateAttribute, updateLiteralAttribute, NectaryElement, setClass } from '../utils';
-const templateHTML = '<style>:host{display:block}#wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:16px;border-radius:var(--sinch-comp-inline-alert-shape-radius);box-sizing:border-box;width:100%}:host([type=success]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-success-default-background)}:host([type=warn]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-warning-default-background)}:host([type=error]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-error-default-background)}:host([type=info]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-info-default-background)}#icon-error,#icon-info,#icon-success,#icon-warn{display:none}#icon-success{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-success-default-icon)}#icon-warn{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-warning-default-icon)}#icon-error{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-error-default-icon)}#icon-info{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-info-default-icon)}:host([type=error]) #icon-error,:host([type=info]) #icon-info,:host([type=success]) #icon-success,:host([type=warn]) #icon-warn{display:block}#body-wrapper{display:flex;flex-direction:column;align-items:flex-start;margin-left:8px;min-width:0;flex:1}#caption{align-self:stretch;--sinch-comp-title-font:var(--sinch-comp-inline-alert-font-title)}:host([type=success]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-success-default-text)}:host([type=warn]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-warning-default-text)}:host([type=error]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-error-default-text)}:host([type=info]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-info-default-text)}#text{display:flex;flex-direction:column;gap:8px;margin-top:4px;align-self:stretch;--sinch-comp-rich-text-font:var(--sinch-comp-inline-alert-font-body)}:host([type=success]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-success-default-text)}:host([type=warn]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-warning-default-text)}:host([type=error]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-error-default-text)}:host([type=info]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-info-default-text)}#action{width:100%;display:flex;margin-top:16px;min-width:0;gap:16px}#action.empty{display:none}#close{margin-left:16px}#close.empty{display:none}</style><div id="wrapper"><sinch-icon icons-version="2" name="circle-info" id="icon-info"></sinch-icon><sinch-icon icons-version="2" name="circle-check" id="icon-success"></sinch-icon><sinch-icon icons-version="2" name="triangle-exclamation" id="icon-warn"></sinch-icon><sinch-icon icons-version="2" name="octagon-exclamation" id="icon-error"></sinch-icon><div id="body-wrapper"><sinch-title id="caption" level="3" type="s"></sinch-title><sinch-rich-text id="text"></sinch-rich-text><div id="action"><slot name="action"></slot></div></div><div id="close"><slot name="close"></slot></div></div>';
+const templateHTML = '<style>:host{display:block}#wrapper{display:flex;flex-direction:row;align-items:flex-start;padding:16px;border-radius:var(--sinch-comp-inline-alert-shape-radius);box-sizing:border-box;width:100%}:host([type=success]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-success-default-background)}:host([type=warn]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-warning-default-background)}:host([type=error]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-error-default-background)}:host([type=info]) #wrapper{background-color:var(--sinch-comp-inline-alert-color-info-default-background)}#icon-error,#icon-info,#icon-success,#icon-warn{display:none}#icon-success{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-success-default-icon)}#icon-warn{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-warning-default-icon)}#icon-error{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-error-default-icon)}#icon-info{--sinch-global-color-icon:var(--sinch-comp-inline-alert-color-info-default-icon)}:host([type=error]) #icon-error,:host([type=info]) #icon-info,:host([type=success]) #icon-success,:host([type=warn]) #icon-warn{display:block}#body-wrapper{display:flex;flex-direction:column;align-items:flex-start;margin-left:8px;min-width:0;flex:1}#caption{align-self:stretch;--sinch-comp-title-font:var(--sinch-comp-inline-alert-font-title)}:host([type=success]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-success-default-text)}:host([type=warn]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-warning-default-text)}:host([type=error]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-error-default-text)}:host([type=info]) #caption{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-info-default-text)}#text{display:flex;flex-direction:column;gap:8px;margin-top:0;align-self:stretch;--sinch-comp-rich-text-font:var(--sinch-comp-inline-alert-font-body)}:host([type=success]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-success-default-text)}:host([type=warn]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-warning-default-text)}:host([type=error]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-error-default-text)}:host([type=info]) #text{--sinch-global-color-text:var(--sinch-comp-inline-alert-color-info-default-text)}:host([caption=""]) #text,:host([caption]) #text{margin-top:4px}#action{width:100%;display:flex;margin-top:16px;min-width:0;gap:16px}#action.empty{display:none}#close{margin-left:16px}#close.empty{display:none}</style><div id="wrapper"><sinch-icon icons-version="2" name="circle-info" id="icon-info"></sinch-icon><sinch-icon icons-version="2" name="circle-check" id="icon-success"></sinch-icon><sinch-icon icons-version="2" name="triangle-exclamation" id="icon-warn"></sinch-icon><sinch-icon icons-version="2" name="octagon-exclamation" id="icon-error"></sinch-icon><div id="body-wrapper"><sinch-title id="caption" level="3" type="s"></sinch-title><sinch-rich-text id="text"></sinch-rich-text><div id="action"><slot name="action"></slot></div></div><div id="close"><slot name="close"></slot></div></div>';
 import { typeValues } from './utils';
 const template = document.createElement('template');
 template.innerHTML = templateHTML;

package/inline-alert/types.d.ts

@@ -11,7 +11,7 @@ export type TSinchInlineAlertElement = HTMLElement & {
 export type TSinchInlineAlertReact = TSinchElementReact<TSinchInlineAlertElement> & {
     type: TSinchInlineAlertType;
     text?: string;
-    caption: string;
+    caption?: string;
 } & {
     style?: {
         '--sinch-comp-inline-alert-shape-radius'?: string;

package/input/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-input': TSinchInputElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-input': TSinchInputReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/link/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-link': TSinchLinkElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-link': TSinchLinkReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/list/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-list': TSinchListElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-list': TSinchListReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/list-item/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-list-item': TSinchListItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-list-item': TSinchListItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nectary/components",
-  "version": "4.7.8",
+  "version": "4.8.1",
   "files": [
     "**/*/*.css",
     "**/*/*.json",
@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.22.15",
-    "@nectary/assets": "2.2.4"
+    "@nectary/assets": "2.2.5"
   },
   "devDependencies": {
     "@babel/cli": "^7.22.15",

package/pagination/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-pagination': TSinchPaginationElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-pagination': TSinchPaginationReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/persistent-overlay/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-persistent-overlay': TSinchPersistentOverlayElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-persistent-overlay': TSinchPersistentOverlayReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/pop/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-pop': TSinchPopElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-pop': TSinchPopReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/popover/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-popover': TSinchPopoverElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-popover': TSinchPopoverReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/progress/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-progress': TSinchProgressElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress': TSinchProgressReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/progress-stepper/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-progress-stepper': TSinchProgressStepperElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress-stepper': TSinchProgressStepperReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/progress-stepper-item/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-progress-stepper-item': TSinchProgressStepperItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-progress-stepper-item': TSinchProgressStepperItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/radio/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-radio': TSinchRadioElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-radio': TSinchRadioReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/radio-option/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-radio-option': TSinchRadioOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-radio-option': TSinchRadioOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/rich-text/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-rich-text': TSinchRichTextElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-rich-text': TSinchRichTextReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/rich-textarea/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-rich-textarea': TSinchRichTextareaElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-rich-textarea': TSinchRichTextareaReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segment/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segment': TSinchSegmentElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segment': TSinchSegmentReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segment-collapse/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segment-collapse': TSinchSegmentExpandElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segment-collapse': TSinchSegmentExpandReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segmented-control/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segmented-control': TSinchSegmentedControlElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segmented-control': TSinchSegmentedControlReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segmented-control-option/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segmented-control-option': TSinchSegmentedControlOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segmented-control-option': TSinchSegmentedControlOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segmented-icon-control/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segmented-icon-control': TSinchSegmentedIconControlElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segmented-icon-control': TSinchSegmentedIconControlReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/segmented-icon-control-option/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-segmented-icon-control-option': TSinchSegmentedIconControlOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-segmented-icon-control-option': TSinchSegmentedIconControlOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/select-button/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-select-button': TSinchSelectButtonElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-select-button': TSinchSelectButtonReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/select-menu/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-select-menu': TSinchSelectMenuElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-select-menu': TSinchSelectMenuReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/select-menu-option/index.d.ts

@@ -20,6 +20,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-select-menu-option': TSinchSelectMenuOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-select-menu-option': TSinchSelectMenuOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/skeleton/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-skeleton': TSinchSkeletonElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-skeleton': TSinchSkeletonReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/skeleton-item/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-skeleton-item': TSinchSkeletonItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-skeleton-item': TSinchSkeletonItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/spinner/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-spinner': TSinchSpinnerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-spinner': TSinchSpinnerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table': TSinchTableElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table': TSinchTableReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table-body/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table-body': TSinchTableBodyElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table-body': TSinchTableBodyReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table-cell/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table-cell': TSinchTableCellElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table-cell': TSinchTableCellReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table-head/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table-head': TSinchTableHeadElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table-head': TSinchTableHeadReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table-head-cell/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table-head-cell': TSinchTableHeaderCellElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table-head-cell': TSinchTableHeaderCellReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/table-row/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-table-row': TSinchTableRowElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-table-row': TSinchTableRowReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tabs/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tabs': TSinchTabsElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tabs': TSinchTabsReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tabs-icon-option/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tabs-icon-option': TSinchTabsIconOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tabs-icon-option': TSinchTabsIconOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tabs-option/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tabs-option': TSinchTabsOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tabs-option': TSinchTabsOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tag/index.d.ts

@@ -4,6 +4,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tag': TSinchTagElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tag': TSinchTagReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/text/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-text': TSinchTextElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-text': TSinchTextReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/textarea/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-textarea': TSinchTextareaElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-textarea': TSinchTextareaReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tile-control/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tile-control': TSinchTileControlElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tile-control': TSinchTileControlReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tile-control-option/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tile-control-option': TSinchTileControlOptionElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tile-control-option': TSinchTileControlOptionReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/time-picker/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-time-picker': TSinchTimePickerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-time-picker': TSinchTimePickerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/title/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-title': TSinchTitleElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-title': TSinchTitleReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/toast/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-toast': TSinchToastElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-toast': TSinchToastReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/toast-manager/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-toast-manager': TSinchToastManagerElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-toast-manager': TSinchToastManagerReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/toggle/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-toggle': TSinchToggleElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-toggle': TSinchToggleReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/tooltip/index.d.ts

@@ -5,6 +5,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-tooltip': TSinchTooltipElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-tooltip': TSinchTooltipReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/vertical-stepper/index.d.ts

@@ -3,6 +3,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-vertical-stepper': TSinchVerticalStepperElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-vertical-stepper': TSinchVerticalStepperReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {

package/vertical-stepper-item/index.d.ts

@@ -6,6 +6,11 @@ declare global {
     interface HTMLElementTagNameMap {
         'sinch-vertical-stepper-item': TSinchVerticalStepperItemElement;
     }
+    namespace JSX {
+        interface IntrinsicElements {
+            'sinch-vertical-stepper-item': TSinchVerticalStepperItemReact;
+        }
+    }
 }
 declare module 'react' {
     namespace JSX {