Skip to content

Commit

Permalink
chore: add typecheck to our documentation (#4267)
Browse files Browse the repository at this point in the history
* typescript docs

* save

* add tsconfig check

* refa card in iconlist

* add to root command

* test

* update

* test

* test

* test

* undo

* move in one file

* test test test

* test

* update

* maybe build

* add build step for typecheck
  • Loading branch information
sarahgm authored Oct 30, 2024
1 parent e784098 commit 8892d06
Show file tree
Hide file tree
Showing 24 changed files with 519 additions and 68 deletions.
2 changes: 2 additions & 0 deletions .github/workflows/typecheck.yml
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,8 @@ jobs:
cache: 'pnpm'
- name: Install dependencies
run: pnpm install
- name: Build docs for generated files
run: pnpm build:docs

# Action
- name: Typecheck
Expand Down
2 changes: 1 addition & 1 deletion docs/app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ const SectionLink = ({

// Page
// ---------------
export const Page = () => {
const Page = () => {
const latestPost = getLatestPost();
return (
<main className="grid justify-center px-[--page-padding-md] xl:px-[--page-padding-xl]">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export default () => {
<Inset space={8}>
<Stack space={4}>
{invalid ? (
<SectionMessage variant="error" role="alert" tabIndex={-1}>
<SectionMessage variant="error">
<SectionMessage.Title>Whoopsies!</SectionMessage.Title>
<SectionMessage.Content>
Please enter both your email address and password to proceed.
Expand Down
2 changes: 1 addition & 1 deletion docs/content/components/form/slider/slider-width.demo.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { Slider } from '@marigold/components';

export default () => (
<Slider width="180px" aria-label="width">
<Slider width="full" aria-label="width">
Example
</Slider>
);
12 changes: 1 addition & 11 deletions docs/content/components/overlay/menu/menu-open-dialog.demo.tsx
Original file line number Diff line number Diff line change
@@ -1,15 +1,5 @@
import { useState } from 'react';
import {
Body,
Button,
Dialog,
Footer,
Header,
Inline,
Menu,
Stack,
Text,
} from '@marigold/components';
import { Button, Dialog, Menu } from '@marigold/components';

export default () => {
const [open, setDialogOpen] = useState(false);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import {
Form,
Image,
Inline,
Menu,
Select,
Stack,
Text,
Expand Down
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@
import { Select } from '@marigold/components';

export default () => (
<Select
label="Genre"
placeholder="Select genre"
width="fit"
required
>
<Select label="Genre" placeholder="Select genre" width="fit" required>
<Select.Option id="pop">Pop</Select.Option>
<Select.Option id="hiphop">Hip Hop</Select.Option>
<Select.Option id="rock">Rock</Select.Option>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,11 @@ const paymentMethods = [
export default () => (
<SelectList
selectionMode="multiple"
label="Payment Methods"
aria-label="Payment Methods"
items={paymentMethods}
>
{item => <SelectList.Item id={item.id}>{item.name}</SelectList.Item>}
{(item: { id: string; name: string }) => (
<SelectList.Item id={item.id}>{item.name}</SelectList.Item>
)}
</SelectList>
);
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,7 @@ export default () => {
<Tag id="pool">Swimming pool</Tag>
<Tag id="breakfast">Breakfast</Tag>
</Tag.Group>
<p>
Current selection (controlled):{' '}
{selected === 'all' ? 'all' : [...selected].join(', ')}
</p>
<p>Current selection (controlled): {[...selected].join(', ')}</p>
</>
);
};
30 changes: 30 additions & 0 deletions docs/content/releases/config/storybook/release.mdx
Original file line number Diff line number Diff line change
@@ -1,9 +1,39 @@
---
title: '@marigold/storybook-config'
caption: 'Have a look on the latest changes regarding @marigold/storybook-config'
badge: new
toc: false
---

## 1.1.50 (Released on <DateFormat value={new Date("Fri Oct 25 2024 18:15:28 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes

- Updated dependencies [65608b4]
- Updated dependencies [caefbe4]
- Updated dependencies [2d9917f]
- Updated dependencies [6f8e3a2]
- Updated dependencies [7ea3838]
- Updated dependencies [6687af7]
- Updated dependencies [2babc0b]
- Updated dependencies [8c539d3]
- Updated dependencies [f18c8aa]
- Updated dependencies [d5386e4]
- Updated dependencies [5798b4d]
- Updated dependencies [5c029ec]
- Updated dependencies [2169b6f]
- Updated dependencies [bfd2843]
- Updated dependencies [0e77996]
- Updated dependencies [b8cd92a]
- Updated dependencies [45fb3c4]
- Updated dependencies [f6a132c]
- Updated dependencies [956982a]
- Updated dependencies [df04623]
- Updated dependencies [f3f0ea0]
- @marigold/components@10.0.0
- @marigold/theme-b2b@28.0.0
- @marigold/theme-core@27.0.0

## 1.1.49 (Released on <DateFormat value={new Date("Wed Sep 11 2024 14:52:49 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes
Expand Down
106 changes: 106 additions & 0 deletions docs/content/releases/docs/release.mdx
Original file line number Diff line number Diff line change
@@ -1,9 +1,115 @@
---
title: '@marigold/docs'
caption: 'Have a look on the latest changes regarding @marigold/docs'
badge: new
toc: false
---

## 10.0.0 (Released on <DateFormat value={new Date("Fri Oct 25 2024 18:15:28 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Major Changes

- caefbe4: refa(listbox): Allow sections in `<Combobox>` and `<Autocomplete>`, adjust Section API in `<Select>`, `<Combobox>` and `<Autocomplete>`.

- Added the possibility to use sections with `<Combobox>` and `<Autocomplete>`
- Refactored the `<Section>` (from `<Listbox>`) to fit our API, no need for the extra `<Header>` anymore. Instead you can do `<Select.Section header="My header">`, same for the other components
- Renamed `<Item>` to `<Option>` in `<Combobox>` and `<Autocomplete>` to align with `<Select>`
- Updated the docs for `<Select>`, `<Combobox>` and `<Autocomplete>`
- Updated Storybook for `<Select>`, `<Combobox>` and `<Autocomplete>` with section stories
- Renamed the part of the `<ListBox>` accordingly (from `sectionTitle` to `header`)

**BREAKING CHANGE:** We changed the API of the `<Section>` component that is used in `<Select>`, `<Combobox>` and `<Autocomplete>`. It is no longer necessary to add a `Header` within the `<Section>`.

Use the newly added `header` prop instead. Additionally, to unify the APIs all choices of `<Select>`, `<Combobox>` and `<Autocomplete>` are now called `<Option>` instead of `<Item>`.

### Minor Changes

- 6687af7: refa: remove footer from `<Dialog>` + allow styles

- dialogs can only have action now
- align buttons in `<Dialog.Actions>` correctly

- f3f0ea0: With the changes of the `<Dialog>` component, we also needed to update they docs page.

### Patch Changes

- 4818227: docs([DST-570]): Added "Release" pages to our documentation

We now create for each changelog a page on our documentation, it is also possible to create release blog posts.
With these pages we improve communication, enhance user experience, and ensure all users have easy access to the latest updates in one central location.

- f18c8aa: [DST-494]: add loading states pattern

[DST-494]: added prop `mode`to the `<XLoader />` to support inline and full-section loading

- e83566d: docs: remove examples from checkbox page and add guidline section

- removed the examples section
- add a guidline about the difference between a checkbox and a switch
- site clean up

- 9ff555b: docs: add landing page to the site
- 0e77996: docs([DST-572]): Adding a general form guideline in docs explaining different concepts such as when to use lable and help text
- 380704d: docs[DST-519]: Clean up Marigold Docs/ Improve Navigation

- deleted old files (scripts, about , release)
- updated some faqs
- improved the navigation structure
- added overview pages
- improved folder structure in code (a bit)
- adjust some links

- b8cd92a: feat: `CheckboxGroup` can now be used as a compound component

- Refactored the `CheckboxGroup` to be a compound component and align it with other components: `<CheckboxGroup>` -> `<Checkbox.Group>`
- Adjusted the Checkbox appearance demo a bit

- a582035: docs: Update the `MarigoldProvider` page

Updated the MarigoldProvider page according to our new page layout and information.

- fab9442: docs(Combobox): add info that section headers are not included wehen filtering
- 45fb3c4: chore(deps): update react-aria to 1.4
- f6a132c: docs([DST-582]): revise `<SectionMessage>` page according to new component page structure
feat(components): add close button on `<SectionMessage>`

Revised the `<SectionMessage>` documentation page to our new layout of component pages. And added a close button to allow the user to dismiss the `<SectionMessage>` this is now aligned with our feedback message pattern.

- f85bb04: docs: Apply root styles to overlay portal so they are displayed correctly.

Overlay components (e.g. `<Dialog>` did not display correctly in the docs.

- Updated dependencies [65608b4]
- Updated dependencies [caefbe4]
- Updated dependencies [165e184]
- Updated dependencies [2d9917f]
- Updated dependencies [6f8e3a2]
- Updated dependencies [7ea3838]
- Updated dependencies [6687af7]
- Updated dependencies [2babc0b]
- Updated dependencies [8c539d3]
- Updated dependencies [f18c8aa]
- Updated dependencies [d5386e4]
- Updated dependencies [5798b4d]
- Updated dependencies [5c029ec]
- Updated dependencies [2169b6f]
- Updated dependencies [bfd2843]
- Updated dependencies [9ff555b]
- Updated dependencies [0e77996]
- Updated dependencies [b8cd92a]
- Updated dependencies [45fb3c4]
- Updated dependencies [f6a132c]
- Updated dependencies [956982a]
- Updated dependencies [df04623]
- Updated dependencies [f3f0ea0]
- @marigold/components@10.0.0
- @marigold/theme-b2b@28.0.0
- @marigold/theme-core@27.0.0
- @marigold/system@10.0.0
- @marigold/theme-docs@2.2.0
- @marigold/icons@1.2.58
- @marigold/theme-preset@1.3.23

## 9.0.2 (Released on <DateFormat value={new Date("Wed Sep 11 2024 14:52:49 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes
Expand Down
99 changes: 99 additions & 0 deletions docs/content/releases/packages/components/release.mdx
Original file line number Diff line number Diff line change
@@ -1,9 +1,108 @@
---
title: '@marigold/components'
caption: 'Have a look on the latest changes regarding @marigold/components'
badge: new
toc: false
---

## 10.0.0 (Released on <DateFormat value={new Date("Fri Oct 25 2024 18:15:28 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Major Changes

- 65608b4: fix([DSTSUP-94]): Adjust date unavailable property from `<DatePicker>`

**Breaking Change:** Adjusted `isDateUnavailable` prop to our code guidelines `dateUnavailable`

Added disabled styles for `data-unavailable` in both b2b and core theme

- caefbe4: refa(listbox): Allow sections in `<Combobox>` and `<Autocomplete>`, adjust Section API in `<Select>`, `<Combobox>` and `<Autocomplete>`.

- Added the possibility to use sections with `<Combobox>` and `<Autocomplete>`
- Refactored the `<Section>` (from `<Listbox>`) to fit our API, no need for the extra `<Header>` anymore. Instead you can do `<Select.Section header="My header">`, same for the other components
- Renamed `<Item>` to `<Option>` in `<Combobox>` and `<Autocomplete>` to align with `<Select>`
- Updated the docs for `<Select>`, `<Combobox>` and `<Autocomplete>`
- Updated Storybook for `<Select>`, `<Combobox>` and `<Autocomplete>` with section stories
- Renamed the part of the `<ListBox>` accordingly (from `sectionTitle` to `header`)

**BREAKING CHANGE:** We changed the API of the `<Section>` component that is used in `<Select>`, `<Combobox>` and `<Autocomplete>`. It is no longer necessary to add a `Header` within the `<Section>`.

Use the newly added `header` prop instead. Additionally, to unify the APIs all choices of `<Select>`, `<Combobox>` and `<Autocomplete>` are now called `<Option>` instead of `<Item>`.

- 2d9917f: **Breaking changes**

- `Dialog.Headline` has been renamed to `Dialog.Title`. Please update your code accordingly.
- `<Dialog.Content>` and `<Dialog.Actions>` have been introduced for better organization and flexibility.
- The internal layout now uses grid areas, ensuring consistent ordering and layout of the dialog elements.
- Existing implementations of the `<Dialog>` component will need to be updated to use these new subcomponents.

### Minor Changes

- 6f8e3a2: style(dialog): make `<Dialog>` sizes responsive

Using `size` with a `<Dialog>` will allow the dialog to be at most sm/md/lg wide. Will use full width on smaller screens.

- 6687af7: refa: remove footer from `<Dialog>` + allow styles

- dialogs can only have action now
- align buttons in `<Dialog.Actions>` correctly

- 2babc0b: feat(components): Mark layout components as regions for accessibility.

Added the ability to mark layout components as regions (ARIA role). This improves accessibility by allowing assistive technologies to identify significant sections of the page, making navigation easier for users with disabilities.

- 956982a: feat(components): Make `<Text>` and `<Headline>` accessible by allowing ARIA labelling props

`<Text>` and `<Headline>` will no longer cause type errors when ARIA labelling is used (`aria-label`, `id`, ...).

- df04623: Adding size to dialog component

### Patch Changes

- 7ea3838: feat(Menu): pass `aria-label` to menu button instead of menu
- f18c8aa: [DST-494]: add loading states pattern

[DST-494]: added prop `mode`to the `<XLoader />` to support inline and full-section loading

- d5386e4: fix(components): Display `<Checkbox>` focus ring and adjust focus ring of `<Table>`

Focus ring was not showing for the `<Checkbox>`. It does now!

- 5c029ec: feat(components): Expose `Selection` type for easy usage with `Table` and other components

When working with a `<Table>` you can now use

```ts
import type { Selection } from '@marigold/components';
```

instead of creating the type.

- 2169b6f: bugfix([DSTSUP-92]): fixed variants in table stories

At certain stories the control variants doesn't worked properly. Now it should work at least for all table stories.

- bfd2843: chore: refa `<Text>` component. Based on the slot property it now takes the RAC text or not. Needed to prevent other components breaking.
- 0e77996: docs([DST-572]): Adding a general form guideline in docs explaining different concepts such as when to use lable and help text
- b8cd92a: feat: `CheckboxGroup` can now be used as a compound component

- Refactored the `CheckboxGroup` to be a compound component and align it with other components: `<CheckboxGroup>` -> `<Checkbox.Group>`
- Adjusted the Checkbox appearance demo a bit

- 45fb3c4: chore(deps): update react-aria to 1.4
- f6a132c: docs([DST-582]): revise `<SectionMessage>` page according to new component page structure
feat(components): add close button on `<SectionMessage>`

Revised the `<SectionMessage>` documentation page to our new layout of component pages. And added a close button to allow the user to dismiss the `<SectionMessage>` this is now aligned with our feedback message pattern.

- Updated dependencies [caefbe4]
- Updated dependencies [6687af7]
- Updated dependencies [2babc0b]
- Updated dependencies [45fb3c4]
- Updated dependencies [956982a]
- @marigold/[email protected]
- @marigold/[email protected]
- @marigold/[email protected]

## 9.0.2 (Released on <DateFormat value={new Date("Wed Sep 11 2024 14:52:49 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes
Expand Down
10 changes: 10 additions & 0 deletions docs/content/releases/packages/icons/release.mdx
Original file line number Diff line number Diff line change
@@ -1,9 +1,19 @@
---
title: '@marigold/icons'
caption: 'Have a look on the latest changes regarding @marigold/icons'
badge: new
toc: false
---

## 1.2.58 (Released on <DateFormat value={new Date("Fri Oct 25 2024 18:15:28 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes

- Updated dependencies [caefbe4]
- Updated dependencies [6687af7]
- Updated dependencies [45fb3c4]
- @marigold/system@10.0.0

## 1.2.57 (Released on <DateFormat value={new Date("Wed Sep 11 2024 14:52:49 GMT+0200 (Central European Summer Time)")} dateStyle="medium" />)

### Patch Changes
Expand Down
Loading

0 comments on commit 8892d06

Please sign in to comment.