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 `