@public-ui/react 2.0.0-rc.8 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +43 -4
  2. package/dist/index.cjs +0 -2
  3. package/dist/index.d.ts +1 -2
  4. package/dist/index.mjs +1 -2
  5. package/package.json +9 -9
package/README.md CHANGED
@@ -1,7 +1,46 @@
1
- # React-Adapter
1
+ # KoliBri - React-Adapter
2
2
 
3
- Das [**React**](https://reactjs.org)-Modul ist der Framework-Adapter für die Komponenten-Bibliothek.
3
+ ## Motivation
4
4
 
5
- Mehr zur **Modularisierung** kann im [Architekturkonzept](https://public-ui.github.io/docs/concepts/architecture) nachgelesen werden.
5
+ Provide an adapter for [React](https://reactjs.org) to use the KoliBri components.
6
6
 
7
- Mehr zum **Projekt** kann in der [README](https://public-ui.github.io/docs) nachgelesen werden.
7
+ ## Installation
8
+
9
+ You can install the adapter with `npm`, `pnpm` or `yarn`:
10
+
11
+ ```bash
12
+ npm i -g @public-ui/react
13
+ pnpm i -g @public-ui/react
14
+ yarn add -g @public-ui/react
15
+ ```
16
+
17
+ ## Usage
18
+
19
+ First, initialize KoliBri with a [theme](https://github.com/public-ui/kolibri/tree/develop/packages/themes) and create a React root:
20
+
21
+ ```ts
22
+ import { defineCustomElements } from '@public-ui/components/dist/loader';
23
+ import { register } from '@public-ui/components';
24
+ import { DEFAULT } from '@public-ui/themes';
25
+
26
+ register(DEFAULT, defineCustomElements)
27
+ .then(() => {
28
+ ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
29
+ <React.StrictMode>
30
+ <App />
31
+ </React.StrictMode>
32
+ );
33
+ })
34
+ .catch((error) => {
35
+ /* Handle errors */
36
+ });
37
+ ```
38
+
39
+ Then, you can import any component from `@public-ui/react` and render it within React components:
40
+
41
+ ```tsx
42
+ import React, { FC } from 'react';
43
+ import { KolButton } from '@public-ui/react';
44
+
45
+ export default (): FC => <KolButton _label="Hello World" />;
46
+ ```
package/dist/index.cjs CHANGED
@@ -210,7 +210,6 @@ const KolLogo = /* @__PURE__ */ createReactComponent("kol-logo");
210
210
  const KolModal = /* @__PURE__ */ createReactComponent("kol-modal");
211
211
  const KolNav = /* @__PURE__ */ createReactComponent("kol-nav");
212
212
  const KolPagination = /* @__PURE__ */ createReactComponent("kol-pagination");
213
- const KolPopover = /* @__PURE__ */ createReactComponent("kol-popover");
214
213
  const KolProgress = /* @__PURE__ */ createReactComponent("kol-progress");
215
214
  const KolQuote = /* @__PURE__ */ createReactComponent("kol-quote");
216
215
  const KolSelect = /* @__PURE__ */ createReactComponent("kol-select");
@@ -259,7 +258,6 @@ exports.KolLogo = KolLogo;
259
258
  exports.KolModal = KolModal;
260
259
  exports.KolNav = KolNav;
261
260
  exports.KolPagination = KolPagination;
262
- exports.KolPopover = KolPopover;
263
261
  exports.KolProgress = KolProgress;
264
262
  exports.KolQuote = KolQuote;
265
263
  exports.KolSelect = KolSelect;
package/dist/index.d.ts CHANGED
@@ -43,7 +43,6 @@ declare const KolLogo: react.ForwardRefExoticComponent<JSX.KolLogo & Omit<react.
43
43
  declare const KolModal: react.ForwardRefExoticComponent<JSX.KolModal & Omit<react.HTMLAttributes<HTMLKolModalElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolModalElement>>;
44
44
  declare const KolNav: react.ForwardRefExoticComponent<JSX.KolNav & Omit<react.HTMLAttributes<HTMLKolNavElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolNavElement>>;
45
45
  declare const KolPagination: react.ForwardRefExoticComponent<JSX.KolPagination & Omit<react.HTMLAttributes<HTMLKolPaginationElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolPaginationElement>>;
46
- declare const KolPopover: react.ForwardRefExoticComponent<JSX.KolPopover & Omit<react.HTMLAttributes<HTMLKolPopoverElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolPopoverElement>>;
47
46
  declare const KolProgress: react.ForwardRefExoticComponent<JSX.KolProgress & Omit<react.HTMLAttributes<HTMLKolProgressElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolProgressElement>>;
48
47
  declare const KolQuote: react.ForwardRefExoticComponent<JSX.KolQuote & Omit<react.HTMLAttributes<HTMLKolQuoteElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolQuoteElement>>;
49
48
  declare const KolSelect: react.ForwardRefExoticComponent<JSX.KolSelect & Omit<react.HTMLAttributes<HTMLKolSelectElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolSelectElement>>;
@@ -58,4 +57,4 @@ declare const KolTextarea: react.ForwardRefExoticComponent<JSX.KolTextarea & Omi
58
57
  declare const KolToastContainer: react.ForwardRefExoticComponent<JSX.KolToastContainer & Omit<react.HTMLAttributes<HTMLKolToastContainerElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolToastContainerElement>>;
59
58
  declare const KolVersion: react.ForwardRefExoticComponent<JSX.KolVersion & Omit<react.HTMLAttributes<HTMLKolVersionElement>, "style"> & StyleReactProps & react.RefAttributes<HTMLKolVersionElement>>;
60
59
 
61
- 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, KolPopover, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolVersion };
60
+ 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, KolVersion };
package/dist/index.mjs CHANGED
@@ -204,7 +204,6 @@ const KolLogo = /* @__PURE__ */ createReactComponent("kol-logo");
204
204
  const KolModal = /* @__PURE__ */ createReactComponent("kol-modal");
205
205
  const KolNav = /* @__PURE__ */ createReactComponent("kol-nav");
206
206
  const KolPagination = /* @__PURE__ */ createReactComponent("kol-pagination");
207
- const KolPopover = /* @__PURE__ */ createReactComponent("kol-popover");
208
207
  const KolProgress = /* @__PURE__ */ createReactComponent("kol-progress");
209
208
  const KolQuote = /* @__PURE__ */ createReactComponent("kol-quote");
210
209
  const KolSelect = /* @__PURE__ */ createReactComponent("kol-select");
@@ -219,4 +218,4 @@ const KolTextarea = /* @__PURE__ */ createReactComponent("kol-textarea");
219
218
  const KolToastContainer = /* @__PURE__ */ createReactComponent("kol-toast-container");
220
219
  const KolVersion = /* @__PURE__ */ createReactComponent("kol-version");
221
220
 
222
- 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, KolPopover, KolProgress, KolQuote, KolSelect, KolSkipNav, KolSpan, KolSpin, KolSplitButton, KolSymbol, KolTable, KolTabs, KolTextarea, KolToastContainer, KolVersion };
221
+ 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, KolVersion };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@public-ui/react",
3
- "version": "2.0.0-rc.8",
3
+ "version": "2.0.0",
4
4
  "license": "EUPL-1.2",
5
5
  "homepage": "https://public-ui.github.io",
6
6
  "repository": "https://github.com/public-ui/kolibri",
@@ -42,20 +42,20 @@
42
42
  "react"
43
43
  ],
44
44
  "devDependencies": {
45
- "@public-ui/components": "2.0.0-rc.8",
45
+ "@public-ui/components": "2.0.0",
46
46
  "@types/minimatch": "5.1.2",
47
- "@types/minimist": "1.2.4",
48
- "@types/node": "ts5.1",
49
- "@types/normalize-package-data": "2.4.3",
50
- "@types/react": "18.2.33",
51
- "@types/react-dom": "18.2.14",
47
+ "@types/minimist": "1.2.5",
48
+ "@types/node": "ts5.3",
49
+ "@types/normalize-package-data": "2.4.4",
50
+ "@types/react": "18.2.41",
51
+ "@types/react-dom": "18.2.17",
52
52
  "react": "18.2.0",
53
53
  "react-dom": "18.2.0",
54
- "typescript": "5.2.2",
54
+ "typescript": "5.3.2",
55
55
  "unbuild": "1.2.1"
56
56
  },
57
57
  "peerDependencies": {
58
- "@public-ui/components": "2.0.0-rc.8",
58
+ "@public-ui/components": "2.0.0",
59
59
  "react": ">=16.14.0",
60
60
  "react-dom": ">=16.14.0"
61
61
  },