diff --git a/.changeset/dry-fishes-shake.md b/.changeset/dry-fishes-shake.md
new file mode 100644
index 000000000..c3bed5b5d
--- /dev/null
+++ b/.changeset/dry-fishes-shake.md
@@ -0,0 +1,16 @@
+---
+'@lion/checkbox-group': patch
+'@lion/collapsible': patch
+'@lion/fieldset': patch
+'@lion/form': patch
+'@lion/input-amount': patch
+'@lion/input-date': patch
+'@lion/input-datepicker': patch
+'@lion/input-email': patch
+'@lion/input-iban': patch
+'@lion/input-range': patch
+'@lion/input-stepper': patch
+'@lion/radio-group': patch
+---
+
+Remove lion references in docs for easier extending
diff --git a/docs/components/content/collapsible/overview.md b/docs/components/content/collapsible/overview.md
index 2132374f6..ff80e8013 100644
--- a/docs/components/content/collapsible/overview.md
+++ b/docs/components/content/collapsible/overview.md
@@ -21,10 +21,10 @@ export const main = () => html`
## Features
-- Use `opened` attribute or `toggle()` method to render default open
-- `invoker` slot can be custom template e.g. `lion-button` or native `button` with custom styling
-- Observe the state with the help of `@opened-changed` event
-- `show()` and `hide()` are helper methods to hide or show the content from outside
+- Use `opened` attribute or `toggle()` method to render default open.
+- `invoker` slot can be custom template e.g. our [button](../../interaction/button/overview.md) or native `button` with custom styling.
+- Observe the state with the help of `@opened-changed` event.
+- `show()` and `hide()` are helper methods to hide or show the content from outside.
## Installation
diff --git a/docs/components/inputs/checkbox-group/overview.md b/docs/components/inputs/checkbox-group/overview.md
index 7294dcea6..252db9a40 100644
--- a/docs/components/inputs/checkbox-group/overview.md
+++ b/docs/components/inputs/checkbox-group/overview.md
@@ -3,7 +3,7 @@
A checkbox group enhances the functionality of the native `` element.
Its purpose is to provide a way for users to check **multiple** options amongst a set of choices, or to function as a single toggle.
-> You should use `` elements as the children of the ``.
+> You should use our `checkbox` elements as children in checkbox group.
```js script
import { html } from '@lion/core';
@@ -20,11 +20,11 @@ export const main = () => html`
`;
```
-> Make sure that the checkbox-group also has a name attribute, this is necessary for the [lion-form](../form/overview.md)'s serialization result.
+> Make sure that the checkbox-group also has a name attribute, this is necessary for our [form](../form/overview.md)'s serialization result.
## Features
-Since it extends from [lion-fieldset](../fieldset/overview.md),
+Since it extends from our [fieldset](../fieldset/overview.md),
it has all the features a fieldset has.
## Installation
diff --git a/docs/components/inputs/fieldset/overview.md b/docs/components/inputs/fieldset/overview.md
index 99837337f..89abb792d 100644
--- a/docs/components/inputs/fieldset/overview.md
+++ b/docs/components/inputs/fieldset/overview.md
@@ -20,9 +20,9 @@ export const main = () => html`
We have three specific fieldset implementations:
-- [lion-form](../form/overview.md)
-- [lion-checkbox-group](../checkbox-group/overview.md)
-- [lion-radio-group](../radio-group/overview.md)
+- [form](../form/overview.md)
+- [checkbox-group](../checkbox-group/overview.md)
+- [radio-group](../radio-group/overview.md)
A native fieldset element should always have a legend-element for a11y purposes.
However, our fieldset element is not native and should not have a legend-element.
diff --git a/docs/components/inputs/form/overview.md b/docs/components/inputs/form/overview.md
index 69300a463..65703c2d9 100644
--- a/docs/components/inputs/form/overview.md
+++ b/docs/components/inputs/form/overview.md
@@ -30,7 +30,7 @@ export const main = () => html`
- Registration mechanism for form controls
- Accessible out of the box
-For more information about fields that are designed for `lion-form`, please read [form system](../../../docs/systems/form/overview.md).
+For more information about fields that are designed for our `form`, please read [form system](../../../docs/systems/form/overview.md).
## Installation
diff --git a/docs/components/inputs/input-amount/overview.md b/docs/components/inputs/input-amount/overview.md
index fc84d5c3c..32fbc4a4e 100644
--- a/docs/components/inputs/input-amount/overview.md
+++ b/docs/components/inputs/input-amount/overview.md
@@ -24,7 +24,7 @@ export const main = () => {
## Features
-- Based on [lion-input](../input/overview.md)
+- Based on our [input](../input/overview.md)
- Makes use of [formatNumber](../../../docs/systems/localize/numbers.md) for formatting and parsing.
- Option to show currency as a suffix
- Option to override locale to change the formatting and parsing
diff --git a/docs/components/inputs/input-date/overview.md b/docs/components/inputs/input-date/overview.md
index 23fd56ce3..f381586e7 100644
--- a/docs/components/inputs/input-date/overview.md
+++ b/docs/components/inputs/input-date/overview.md
@@ -16,7 +16,7 @@ export const main = () => html`
## Features
-- Based on [lion-input](../input/overview.md)
+- Based on our [input](../input/overview.md)
- Makes use of [formatDate](../../../docs/systems/localize/dates.md) for formatting and parsing.
- Option to override locale to change the formatting and parsing
- Default label in different languages
diff --git a/docs/components/inputs/input-datepicker/overview.md b/docs/components/inputs/input-datepicker/overview.md
index 25922f6af..18042e2fe 100644
--- a/docs/components/inputs/input-datepicker/overview.md
+++ b/docs/components/inputs/input-datepicker/overview.md
@@ -2,7 +2,7 @@
A web component based on the date text input field. Its purpose is to provide a way for users to fill in a date with a datepicker.
For an input field with a big range, such as `birthday-input`, a datepicker is not the best choice due to the high variance between possible inputs.
-We encourage using the standard [lion-input-date](../input-date/overview.md) for this.
+We encourage using our standard [input-date](../input-date/overview.md) for this.
```js script
import { html } from '@lion/core';
@@ -18,8 +18,8 @@ export const main = () => {
## Features
- Input field with a datepicker to help to choose a date
-- Based on [lion-input-date](../input-date/overview.md)
-- Makes use of [lion-calendar](../calendar/overview.md) inside the datepicker
+- Based on our [input-date](../input-date/overview.md)
+- Makes use of our [calendar](../calendar/overview.md) inside the datepicker
- Makes use of [formatDate](../../../docs/systems/localize/dates.md) for formatting and parsing.
- Option to overwrite locale to change the formatting and parsing
- Can make use of date specific [validators](../../../docs/systems/form/validate.md) with corresponding error messages in different languages
diff --git a/docs/components/inputs/input-email/overview.md b/docs/components/inputs/input-email/overview.md
index 3c87a4b14..0e9410947 100644
--- a/docs/components/inputs/input-email/overview.md
+++ b/docs/components/inputs/input-email/overview.md
@@ -15,7 +15,7 @@ export const main = () => {
## Features
-- Based on [lion-input](../input/overview.md)
+- Based on our [input](../input/overview.md)
- Makes use of email [validators](../../../docs/systems/form/validate.md) with corresponding error messages in different languages
- IsEmail (default)
diff --git a/docs/components/inputs/input-iban/overview.md b/docs/components/inputs/input-iban/overview.md
index 45f24317a..84d6612f8 100644
--- a/docs/components/inputs/input-iban/overview.md
+++ b/docs/components/inputs/input-iban/overview.md
@@ -16,7 +16,7 @@ export const main = () => {
## Features
-- Based on [lion-input](../input/overview.md)
+- Based on our [input](../input/overview.md)
- Default label in different languages
- Makes use of IBAN specific [validate](../../../docs/systems/form/validate.md) with corresponding error messages in different languages
- IsIBAN (default)
diff --git a/docs/components/inputs/input-range/overview.md b/docs/components/inputs/input-range/overview.md
index 3deaf93fb..da661ffab 100644
--- a/docs/components/inputs/input-range/overview.md
+++ b/docs/components/inputs/input-range/overview.md
@@ -15,7 +15,7 @@ export const main = () => html`
## Features
-- Based on [lion-input](../input/overview.md).
+- Based on our [input](../input/overview.md).
- Shows `modelValue` and `unit` above the range input.
- Shows `min` and `max` value after the range input.
- Can hide the `min` and `max` value via `no-min-max-labels`.
diff --git a/docs/components/inputs/input-stepper/overview.md b/docs/components/inputs/input-stepper/overview.md
index 4c4928ff6..a5024a110 100644
--- a/docs/components/inputs/input-stepper/overview.md
+++ b/docs/components/inputs/input-stepper/overview.md
@@ -18,7 +18,7 @@ export const main = () => html`
## Features
-- Based on [lion-input](../input/overview.md).
+- Based on our [input](../input/overview.md).
- Set `min` and `max` value to define the range.
- Set `step` value in integer or decimal to increase and decrease the value.
- Use `ArrowUp` or `ArrowDown` to update the value.
diff --git a/docs/components/inputs/radio-group/overview.md b/docs/components/inputs/radio-group/overview.md
index b90928e55..ad7ba1ba9 100644
--- a/docs/components/inputs/radio-group/overview.md
+++ b/docs/components/inputs/radio-group/overview.md
@@ -2,7 +2,7 @@
A web component that enhances the functionality of the native `` element. Its purpose is to provide a way for users to check a **single** option amongst a set of choices.
-You should use ``s inside this element.
+You should use our `radio` inside this element.
```js script
import { html } from '@lion/core';
@@ -19,12 +19,12 @@ export const main = () => html`
`;
```
-- Make sure that to use a name attribute as it is necessary for the [lion-form](../form/overview.md)'s serialization result.
-- If you have many options for a user to pick from, consider using [lion-select](../select/overview.md) instead
+- Make sure that to use a name attribute as it is necessary for our [form](../form/overview.md)'s serialization result.
+- If you have many options for a user to pick from, consider using our [select](../select/overview.md) instead.
## Features
-Since it extends from [lion-fieldset](../fieldset/overview.md), it has all the features a fieldset has.
+Since it extends from our [fieldset](../fieldset/overview.md), it has all the features a fieldset has.
- Get or set the checked value of the group:
- modelValue (default) - `checkedValue()`
diff --git a/docs/components/inputs/select/overview.md b/docs/components/inputs/select/overview.md
index b4f25e97f..b66c34e4b 100644
--- a/docs/components/inputs/select/overview.md
+++ b/docs/components/inputs/select/overview.md
@@ -24,7 +24,7 @@ export const main = () => html`
```
For this form element it is important to put the `slot="input"` with the native `select` yourself, because you are responsible for filling it with `