@public-ui/react 2.0.8 → 2.0.10

package/README.md

@@ -39,7 +39,8 @@ register(DEFAULT, defineCustomElements)
 Then, you can import any component from `@public-ui/react` and render it within React components:
 
 ```tsx
-import React, { FC } from 'react';
+import React from 'react';
+import type { FC } from 'react';
 import { KolButton } from '@public-ui/react';
 
 export default (): FC => <KolButton _label="Hello World" />;

package/dist/index.cjs

@@ -99,6 +99,11 @@ const arrayToMap = (arr) => {
   return map;
 };
 
+let tagNameTransformer;
+const setTagNameTransformer = (_tagNameTransformer) => {
+  tagNameTransformer = _tagNameTransformer;
+};
+
 const setRef = (ref, value) => {
   if (typeof ref === "function") {
     ref(value);
@@ -164,7 +169,8 @@ const createReactComponent = (tagName, ReactComponentContext, manipulatePropsFun
         ref: mergeRefs(forwardedRef, this.setComponentElRef),
         style
       };
-      return React.createElement(tagName, newProps, children);
+      const newTagName = typeof tagNameTransformer === "function" ? tagNameTransformer(tagName) : tagName;
+      return React.createElement(newTagName, newProps, children);
     }
     static get displayName() {
       return displayName;
@@ -279,3 +285,4 @@ exports.KolTreeItem = KolTreeItem;
 exports.KolTreeItemWc = KolTreeItemWc;
 exports.KolTreeWc = KolTreeWc;
 exports.KolVersion = KolVersion;
+exports.setTagNameTransformer = setTagNameTransformer;

package/dist/index.d.ts

@@ -9,6 +9,9 @@ interface StyleReactProps {
     };
 }
 
+type TagNameTransformer = (tagName: string) => string;
+declare const setTagNameTransformer: (_tagNameTransformer: TagNameTransformer) => void;
+
 declare const KolAbbr: react.ForwardRefExoticComponent<JSX.KolAbbr & Omit<react.HTMLAttributes<HTMLKolAbbrElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolAbbrElement>>;
 declare const KolAccordion: react.ForwardRefExoticComponent<JSX.KolAccordion & Omit<react.HTMLAttributes<HTMLKolAccordionElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolAccordionElement>>;
 declare const KolAlert: react.ForwardRefExoticComponent<JSX.KolAlert & Omit<react.HTMLAttributes<HTMLKolAlertElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolAlertElement>>;
@@ -61,4 +64,4 @@ declare const KolTreeItemWc: react.ForwardRefExoticComponent<JSX.KolTreeItemWc &
 declare const KolTreeWc: react.ForwardRefExoticComponent<JSX.KolTreeWc & Omit<react.HTMLAttributes<HTMLKolTreeWcElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolTreeWcElement>>;
 declare const KolVersion: react.ForwardRefExoticComponent<JSX.KolVersion & Omit<react.HTMLAttributes<HTMLKolVersionElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolVersionElement>>;
 
-export { KolAbbr, KolAccordion, KolAlert, KolAvatar, KolBadge, KolBreadcrumb, KolButton, KolButtonGroup, KolButtonLink, KolCard, KolDetails, KolForm, KolHeading, KolIcon, KolImage, KolIndentedText, KolInputCheckbox, KolInputColor, KolInputDate, KolInputEmail, KolInputFile, KolInputNumber, KolInputPassword, KolInputRadio, KolInputRange, KolInputText, KolKolibri, KolLink, KolLinkButton, KolLinkGroup, KolLogo, KolModal, KolNav, KolPagination, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolTree, KolTreeItem, KolTreeItemWc, KolTreeWc, KolVersion };
+export { KolAbbr, KolAccordion, KolAlert, KolAvatar, KolBadge, KolBreadcrumb, KolButton, KolButtonGroup, KolButtonLink, KolCard, KolDetails, KolForm, KolHeading, KolIcon, KolImage, KolIndentedText, KolInputCheckbox, KolInputColor, KolInputDate, KolInputEmail, KolInputFile, KolInputNumber, KolInputPassword, KolInputRadio, KolInputRange, KolInputText, KolKolibri, KolLink, KolLinkButton, KolLinkGroup, KolLogo, KolModal, KolNav, KolPagination, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolTree, KolTreeItem, KolTreeItemWc, KolTreeWc, KolVersion, setTagNameTransformer };

package/dist/index.mjs

@@ -93,6 +93,11 @@ const arrayToMap = (arr) => {
   return map;
 };
 
+let tagNameTransformer;
+const setTagNameTransformer = (_tagNameTransformer) => {
+  tagNameTransformer = _tagNameTransformer;
+};
+
 const setRef = (ref, value) => {
   if (typeof ref === "function") {
     ref(value);
@@ -158,7 +163,8 @@ const createReactComponent = (tagName, ReactComponentContext, manipulatePropsFun
         ref: mergeRefs(forwardedRef, this.setComponentElRef),
         style
       };
-      return createElement(tagName, newProps, children);
+      const newTagName = typeof tagNameTransformer === "function" ? tagNameTransformer(tagName) : tagName;
+      return createElement(newTagName, newProps, children);
     }
     static get displayName() {
       return displayName;
@@ -222,4 +228,4 @@ const KolTreeItemWc = /* @__PURE__ */ createReactComponent("kol-tree-item-wc");
 const KolTreeWc = /* @__PURE__ */ createReactComponent("kol-tree-wc");
 const KolVersion = /* @__PURE__ */ createReactComponent("kol-version");
 
-export { KolAbbr, KolAccordion, KolAlert, KolAvatar, KolBadge, KolBreadcrumb, KolButton, KolButtonGroup, KolButtonLink, KolCard, KolDetails, KolForm, KolHeading, KolIcon, KolImage, KolIndentedText, KolInputCheckbox, KolInputColor, KolInputDate, KolInputEmail, KolInputFile, KolInputNumber, KolInputPassword, KolInputRadio, KolInputRange, KolInputText, KolKolibri, KolLink, KolLinkButton, KolLinkGroup, KolLogo, KolModal, KolNav, KolPagination, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolTree, KolTreeItem, KolTreeItemWc, KolTreeWc, KolVersion };
+export { KolAbbr, KolAccordion, KolAlert, KolAvatar, KolBadge, KolBreadcrumb, KolButton, KolButtonGroup, KolButtonLink, KolCard, KolDetails, KolForm, KolHeading, KolIcon, KolImage, KolIndentedText, KolInputCheckbox, KolInputColor, KolInputDate, KolInputEmail, KolInputFile, KolInputNumber, KolInputPassword, KolInputRadio, KolInputRange, KolInputText, KolKolibri, KolLink, KolLinkButton, KolLinkGroup, KolLogo, KolModal, KolNav, KolPagination, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolTree, KolTreeItem, KolTreeItemWc, KolTreeWc, KolVersion, setTagNameTransformer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@public-ui/react",
-  "version": "2.0.8",
+  "version": "2.0.10",
   "license": "EUPL-1.2",
   "homepage": "https://public-ui.github.io",
   "repository": "https://github.com/public-ui/kolibri",
@@ -42,20 +42,20 @@
     "react"
   ],
   "devDependencies": {
-    "@public-ui/components": "2.0.8",
+    "@public-ui/components": "2.0.10",
     "@types/minimatch": "5.1.2",
     "@types/minimist": "1.2.5",
-    "@types/node": "ts5.3",
+    "@types/node": "ts5.4",
     "@types/normalize-package-data": "2.4.4",
-    "@types/react": "18.2.57",
-    "@types/react-dom": "18.2.19",
+    "@types/react": "18.2.68",
+    "@types/react-dom": "18.2.22",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "typescript": "5.3.3",
+    "typescript": "5.4.3",
     "unbuild": "1.2.1"
   },
   "peerDependencies": {
-    "@public-ui/components": "2.0.8",
+    "@public-ui/components": "2.0.10",
     "react": ">=16.14.0",
     "react-dom": ">=16.14.0"
   },