diff --git a/.changeset/free-lizards-marry.md b/.changeset/free-lizards-marry.md deleted file mode 100644 index 99a2e6f3b7..0000000000 --- a/.changeset/free-lizards-marry.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -"@rhds/elements": minor ---- -``: added line numbers diff --git a/.changeset/hot-spiders-prove.md b/.changeset/hot-spiders-prove.md deleted file mode 100644 index 5ff1366f92..0000000000 --- a/.changeset/hot-spiders-prove.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -"@rhds/elements": minor ---- - -✨ Added `` - -Website status communicates the operational status of a website or domain using a status icon and link. It is usually located in the Footer component. - -```html - -``` \ No newline at end of file diff --git a/.changeset/large-kings-drop.md b/.changeset/large-kings-drop.md deleted file mode 100644 index 740b008108..0000000000 --- a/.changeset/large-kings-drop.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@rhds/elements": patch ---- - -``: improved focus accessibility for keyboard navigation users on firefox -``: improved focus accessibility on firefox diff --git a/.changeset/late-cobras-hammer.md b/.changeset/late-cobras-hammer.md deleted file mode 100644 index 0f0d8c8439..0000000000 --- a/.changeset/late-cobras-hammer.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -"@rhds/elements": minor ---- - -✨ Added ``. - -Back to top component is a fragment link that allows users to quickly navigate to the top of a lengthy content. - -```html -Back to top -``` \ No newline at end of file diff --git a/.changeset/lemon-comics-flow.md b/.changeset/lemon-comics-flow.md deleted file mode 100644 index 56a3d1a236..0000000000 --- a/.changeset/lemon-comics-flow.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@rhds/elements": patch ---- - -``: added a accents slot with placement options as inline and bottom diff --git a/.changeset/light-rice-warn.md b/.changeset/light-rice-warn.md deleted file mode 100644 index 2b1257a791..0000000000 --- a/.changeset/light-rice-warn.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@rhds/elements": patch ---- - -Context: aligned context implementation with updated [protocol defintions](https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md#definitions) diff --git a/.changeset/nervous-hairs-melt.md b/.changeset/nervous-hairs-melt.md deleted file mode 100644 index 1e245439b2..0000000000 --- a/.changeset/nervous-hairs-melt.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@rhds/elements": patch ---- - -Update dependencies, including Lit version 3 diff --git a/.changeset/new-grapes-hope.md b/.changeset/new-grapes-hope.md deleted file mode 100644 index 0cf7a21052..0000000000 --- a/.changeset/new-grapes-hope.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@rhds/elements": patch ---- - -``: make sure alerts always have to correct (lightest) colour palette diff --git a/.changeset/silver-hornets-cry.md b/.changeset/silver-hornets-cry.md deleted file mode 100644 index b9af1303eb..0000000000 --- a/.changeset/silver-hornets-cry.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@rhds/elements": patch ---- - -``: allow tabs with long text content to fit into different-sized containers diff --git a/.changeset/slow-drinks-grow.md b/.changeset/slow-drinks-grow.md deleted file mode 100644 index 2b19cecf86..0000000000 --- a/.changeset/slow-drinks-grow.md +++ /dev/null @@ -1,13 +0,0 @@ ---- -"@rhds/elements": minor ---- - -✨ Added ``. - -A skip link is used to skip repetitive content on a page. It is hidden by default and can be activated by hitting the "Tab" key after loading/refreshing a page. - -```html - - Skip to main content - -``` diff --git a/.changeset/spicy-cups-fly.md b/.changeset/spicy-cups-fly.md deleted file mode 100644 index 3d7aaaf773..0000000000 --- a/.changeset/spicy-cups-fly.md +++ /dev/null @@ -1,38 +0,0 @@ ---- -"@rhds/elements": minor ---- -⚛️ Added React wrapper components - -You can now more easily integrate RHDS elements into your React apps by importing our wrapper components - -First, make sure that you list `@lit/react` as a dependency in your project - -```sh -npm install --save @lit/react -``` - -Then import the element components you need and treat them like any other react component - -```js -import { Tabs } from '@rhds/elements/react/rh-tabs/rh-tabs.js'; -import { Tab } from '@rhds/elements/react/rh-tabs/rh-tab.js'; -import { TabPanel } from '@rhds/elements/react/rh-tabs/rh-tab-panel.js'; - -import { useState } from 'react'; - -const tabs = [ - { heading: 'Hello Red Hat', content: 'Let\'s break down silos' }, - { heading: 'Web components', content: 'They work everywhere' } -]; - -function App() { - const [index, setExpanded] = useState(-1); - return ( - expanded {expanded} - {tabs.map(({ heading, content }, i) => ( - setExpanded(i)}>{heading} - {content}))} - - ); -} -``` diff --git a/.changeset/tame-comics-sneeze.md b/.changeset/tame-comics-sneeze.md deleted file mode 100644 index 42b183efc6..0000000000 --- a/.changeset/tame-comics-sneeze.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -"@rhds/elements": minor ---- -``: added `Show more` toggle diff --git a/.changeset/witty-papayas-tease.md b/.changeset/witty-papayas-tease.md deleted file mode 100644 index 542a7f4e55..0000000000 --- a/.changeset/witty-papayas-tease.md +++ /dev/null @@ -1,16 +0,0 @@ ---- -"@rhds/elements": minor ---- -``: added copy and wrap actions, with localizable slots for the button labels - -```html - - Copy to Clipboard - - Toggle word wrap - - - -``` diff --git a/CHANGELOG.md b/CHANGELOG.md index 57f9726fb8..53c2859a64 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,103 @@ # @rhds/elements +## 1.4.0 + +### Minor Changes + +- fecdcbf: ``: added line numbers +- fecdcbf: ✨ Added `` + + Website status communicates the operational status of a website or domain using a status icon and link. It is usually located in the Footer component. + + ```html + + ``` + +- fecdcbf: ✨ Added ``. + + Back to top component is a fragment link that allows users to quickly navigate to the top of a lengthy content. + + ```html + Back to top + ``` + +- fecdcbf: ✨ Added ``. + + A skip link is used to skip repetitive content on a page. It is hidden by default and can be activated by hitting the "Tab" key after loading/refreshing a page. + + ```html + + Skip to main content + + ``` + +- fecdcbf: ⚛️ Added React wrapper components + + You can now more easily integrate RHDS elements into your React apps by importing our wrapper components + + First, make sure that you list `@lit/react` as a dependency in your project + + ```sh + npm install --save @lit/react + ``` + + Then import the element components you need and treat them like any other react component + + ```js + import { Tabs } from '@rhds/elements/react/rh-tabs/rh-tabs.js'; + import { Tab } from '@rhds/elements/react/rh-tabs/rh-tab.js'; + import { TabPanel } from '@rhds/elements/react/rh-tabs/rh-tab-panel.js'; + + import { useState } from 'react'; + + const tabs = [ + { heading: 'Hello Red Hat', content: 'Let\'s break down silos' }, + { heading: 'Web components', content: 'They work everywhere' } + ]; + + function App() { + const [index, setExpanded] = useState(-1); + return ( + expanded {expanded} + {tabs.map(({ heading, content }, i) => ( + setExpanded(i)}>{heading} + {content}))} + + ); + } + ``` + +- fecdcbf: ``: added `Show more` toggle +- fecdcbf: ``: added copy and wrap actions, with localizable slots for the button labels + + ```html + + Copy to Clipboard + + Toggle word wrap + + + + ``` + +### Patch Changes + +- fecdcbf: ``: improved focus accessibility for keyboard navigation users on firefox + ``: improved focus accessibility on firefox +- fecdcbf: ``: added a accents slot with placement options as inline and bottom +- fecdcbf: Context: aligned context implementation with updated [protocol defintions](https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md#definitions) +- fecdcbf: Update dependencies, including Lit version 3 +- fecdcbf: ``: make sure alerts always have to correct (lightest) colour palette +- fecdcbf: ``: allow tabs with long text content to fit into different-sized containers + ## 1.3.2 ### Patch Changes diff --git a/package.json b/package.json index add67b6fa8..24d8879fba 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@rhds/elements", - "version": "1.3.2", + "version": "1.4.0", "description": "Red Hat Design System Elements", "type": "module", "license": "MIT",