Skip to content

Commit

Permalink
feat: include all type definitions in repo (#1996)
Browse files Browse the repository at this point in the history 
* chore: update generated (.js) style properties file

* chore: remove unused Style entry in components

* chore: rename all component entry points

* chore: add Component type definitions

* chore: fix failing types

* chore: correct Object usage

* chore: fix test that fails during type checking

* feat: include all type definitions in repo

* docs: add missing `label_sr_only` to properties table

* chore: correct types in Examples, Switch and Checkbox

* chore: rewrite prebuild tests to TS

* chore: update snapshots

* fix: use unknown on object value in definition files

* chore: rename index and style component files to ts

* fix: fix dialog/drawer typing in index

* chore: update docs only when `yarn build:types` is called

* fix: DrawerListPortal type definition file

* chore: update outdated prop docs in definition files
  • Loading branch information
@tujoworker @langz
tujoworker authored and langz committed Feb 22, 2023
1 parent 9745cb1 commit 4669a4d
Show file tree
Hide file tree
Showing 297 changed files with 9,069 additions and 151 deletions.
7 changes: 4 additions & 3 deletions packages/dnb-design-system-portal/src/docs/uilib/components/checkbox/properties.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,14 @@ showTabs: true

| Properties | Description |
| ------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `checked` | _(optional)_ determine whether the checkbox is checked or not. The default is `false`. |
| `checked` | _(optional)_ determine whether the checkbox is checked or not. The default is `false`. |
| `title` | _(optional)_ the `title` of the input - describing it a bit further for accessibility reasons. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label_position` | _(optional)_ defines the position of the `label`. Use either `left` or `right`. Defaults to `right`. |
| `label_sr_only` | _(optional)_ use `true` to make the label only readable by screen readers. |
| `size` | _(optional)_ the size of the checkbox. For now there is **medium** (default) and **large**. |
| `status` | _(optional)_ text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_props` | _(optional)_ use an object to define additional FormStatus properties. |
| `global_status_id` | _(optional)_ the `status_id` used for the target [GlobalStatus](/uilib/components/global-status). |
| `skeleton` | _(optional)_ if set to `true`, an overlaying skeleton with animation will be shown. |
Expand Down
2 changes: 1 addition & 1 deletion packages/dnb-design-system-portal/src/docs/uilib/components/dialog/Examples.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,7 @@ export const DialogConfirmLoggedOut = () => {
setOpen(false)
loginHandler()
}}
labelled_by="custom-triggerer"
labelledBy="custom-triggerer"
/>
</>
)
Expand Down
5 changes: 1 addition & 4 deletions packages/dnb-design-system-portal/src/docs/uilib/components/input/Examples.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ export const InputExampleSuffix = () => (
autocomplete="on"
placeholder="Placeholder text"
suffix={
<HelpButton title="Info" trigger_size="large">
<HelpButton title="Info" size="large">
Some content
</HelpButton>
}
Expand Down Expand Up @@ -199,9 +199,6 @@ export const InputExampleSubmit = () => (
on_change={({ value }) => {
console.log('on_change:', value)
}}
onChange={({ value }) => {
console.log('onChange:', value)
}}
right="small"
bottom="x-small"
/>
Expand Down
17 changes: 9 additions & 8 deletions packages/dnb-design-system-portal/src/docs/uilib/components/radio/properties.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,30 +6,31 @@ showTabs: true

| Properties | Description |
| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
| `value` | _(required)_ defines the `value` as a string. Use it to get the value during the `on_change` event listener callback in the **RadioGroup**. |
| `value` | _(required)_ defines the `value` as a string. Use it to get the value during the `on_change` event listener callback in the **RadioGroup**. |
| `checked` | _(optional)_ determine whether the radio is checked or not. Default will be `false`. |
| `group` | _(optional)_ use a unique group identifier to define the Radio buttons that belongs together. |
| `group` | _(optional)_ use a unique group identifier to define the Radio buttons that belongs together. |
| `size` | _(optional)_ the size of the Radio button. For now there is **medium** (default) and **large**. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label_position` | _(optional)_ defines the position of the `label`. Use either `left` or `right`. Defaults to `right`. |
| `label_sr_only` | _(optional)_ use `true` to make the label only readable by screen readers. |
| `status` | _(optional)_ text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_props` | _(optional)_ use an object to define additional FormStatus properties. |
| `global_status_id` | _(optional)_ the `status_id` used for the target [GlobalStatus](/uilib/components/global-status). |

## Radio group properties

| Properties | Description |
| ------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `value` | _(optional)_ defines the pre-selected Radio button. The value has to match the one provided in the Radio button. Use a string value. |
| `name` | _(optional)_ custom grouping name. Defaults to a random name. |
| `value` | _(optional)_ defines the pre-selected Radio button. The value has to match the one provided in the Radio button. Use a string value. |
| `name` | _(optional)_ custom grouping name. Defaults to a random name. |
| `layout_direction` | _(optional)_ Define the layout direction of the Radio buttons. Can be either `column` or `row`. Defaults to `column`. |
| `size` | _(optional)_ the size of the Radio button. For now there is **medium** (default) and **large**. |
| `status` | _(optional)_ uses the `form-status` component to show failure messages. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_props` | _(optional)_ use an object to define additional FormStatus properties. |
| `global_status_id` | _(optional)_ the `status_id` used for the target [GlobalStatus](/uilib/components/global-status). |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label_direction` | _(optional)_ to define the `label` layout direction on how the next element should be placed on. Can be either `vertical` or `horizontal`. Defaults to `horizontal`. |
| `label_sr_only` | _(optional)_ use `true` to make the label only readable by screen readers. |
| `vertical` | _(optional)_ will force both `direction` and `label_direction` to be **vertical** if set to `true`. |
Expand Down
9 changes: 5 additions & 4 deletions packages/dnb-design-system-portal/src/docs/uilib/components/switch/properties.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,14 @@ showTabs: true

| Properties | Description |
| ------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `checked` | _(optional)_ determine whether the switch is checked or not. The default will be `false`. |
| `title` | _(required)_ the `title` of the input - describing it a bit further for accessibility reasons. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `checked` | _(optional)_ determine whether the switch is checked or not. The default will be `false`. |
| `title` | _(required)_ the `title` of the input - describing it a bit further for accessibility reasons. |
| `label` | _(optional)_ use either the `label` property or provide a custom one. |
| `label_position` | _(optional)_ defines the position of the `label`. Use either `left` or `right`. Defaults to `right`. |
| `label_sr_only` | _(optional)_ use `true` to make the label only readable by screen readers. |
| `size` | _(optional)_ the size of the switch. For now there is **medium** (default) and **large**. |
| `status` | _(optional)_ text with a status message. The style defaults to an error message. You can use `true` to only get the status color, without a message. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_state` | _(optional)_ defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`. |
| `status_props` | _(optional)_ use an object to define additional FormStatus properties. |
| `global_status_id` | _(optional)_ the `status_id` used for the target [GlobalStatus](/uilib/components/global-status). |
| `suffix` | _(optional)_ text describing the content of the Switch more than the label. You can also send in a React component, so it gets wrapped inside the Switch component. |
Expand Down
2 changes: 2 additions & 0 deletions packages/dnb-design-system-portal/src/shared/tags/CodeBlock.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,8 @@ const CodeBlock = ({
{...defaultProps}
code={String(exampleCode).trim()}
language={language}
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
theme={prismTheme}
>
{({ className, style, tokens, getLineProps, getTokenProps }) => (
Expand Down
5 changes: 3 additions & 2 deletions packages/dnb-eufemia/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,8 @@
"build:packages": "./scripts/postbuild/build-packages.sh",
"build:prebuild": "babel-node --extensions .js,.ts,.tsx ./scripts/prebuild/runPrepub.js",
"build:resources": "babel-node --extensions .js,.ts,.tsx ./scripts/prebuild/resources/makeResourcesPackage.js",
"build:types": "./scripts/prebuild/generate-types.sh",
"build:types": "./scripts/prebuild/generate-types-docs.sh",
"build:types:generate": "./scripts/prebuild/generate-types.sh",
"build:types:definitions": "yarn tsc --project tsconfig.definitions.json",
"build:types:dev": "nodemon --exec 'babel-node --extensions .js,.ts,.tsx ./scripts/prebuild/generateTypes.js' --ext js --watch './src/**/*' --watch './scripts/**/*'",
"build:types:esm": "yarn tsc --project tsconfig.definitions.json --declarationDir ./build/esm --rootDir src",
Expand Down Expand Up @@ -66,7 +67,7 @@
"skeleton:font": "nodemon --exec 'babel-node --extensions .js,.ts,.tsx ./scripts/tools/createSkeletonFont.js'",
"start": "start-storybook -s / -p 8002 --ci --no-release-notes --no-version-updates",
"test": "jest",
"test:auto-generated-types": "jest ./postTypeGeneration.test.js --ci --testPathIgnorePatterns=[]",
"test:auto-generated-types": "jest ./postTypeGeneration.test.ts --ci --testPathIgnorePatterns=[]",
"test:ci": "jest --ci",
"test:screenshots": "jest --config=./jest.config.screenshots.js --detectOpenHandles --testPathPattern ",
"test:screenshots:ci": "jest --config=./jest.config.screenshots.js --ci --bail",
Expand Down
4 changes: 2 additions & 2 deletions packages/dnb-eufemia/scripts/postbuild/babel-cjs.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,6 @@ babel ./src \
--no-copy-ignored \
--ignore 'src/esm,src/umd,src/core,**/*.test.*,**/__tests__/**/*,**/*.stories.*,**/stories,**/*.d.ts'

echo 'Building cjs bundle done!'

echo 'Copy additional files to cjs ...'

OUT_DIR=./build/cjs babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/copyTypeScriptFiles.js
Expand All @@ -25,3 +23,5 @@ OUT_DIR=./build/cjs babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/cop
echo 'Copy extra cjs package.json ...'

cp ./src/cjs/package.json ./build/cjs/package.json

echo 'Building cjs bundle done!'
4 changes: 2 additions & 2 deletions packages/dnb-eufemia/scripts/postbuild/babel-es.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@ babel ./src \
--no-copy-ignored \
--ignore 'src/cjs,src/esm,src/umd,src/core,**/*.test.*,**/__tests__/**/*,**/*.stories.*,**/stories,**/*.d.ts'

echo 'Building es bundle done!'

echo 'Copy additional files to es ...'

OUT_DIR=./build/es babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/copyTypeScriptFiles.js
OUT_DIR=./build/es babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/copyStyles.js

echo 'Building es bundle done!'
4 changes: 2 additions & 2 deletions packages/dnb-eufemia/scripts/postbuild/babel-esm.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@ babel ./src \
--no-copy-ignored \
--ignore 'src/cjs,src/esm,src/umd,src/core,**/*.test.*,**/__tests__/**/*,**/*.stories.*,**/stories,**/*.d.ts'

echo 'Building esm bundle done!'

echo 'Copy additional files to esm ...'

OUT_DIR=./build/esm babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/copyTypeScriptFiles.js
OUT_DIR=./build/esm babel-node --extensions .js,.ts,.tsx ./scripts/postbuild/copyStyles.js

echo 'Building esm bundle done!'
2 changes: 1 addition & 1 deletion packages/dnb-eufemia/scripts/postbuild/postbuild.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ set -e # Exit immediately if a command exits with a non-zero status.

echo 'Postbuild started ...'

yarn build:types
yarn build:types:generate
yarn prettier:other
yarn build:cjs
yarn build:es
Expand Down
9 changes: 9 additions & 0 deletions packages/dnb-eufemia/scripts/prebuild/generate-types-docs.sh
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
#!/bin/bash

set -e # Exit immediately if a command exits with a non-zero status.

echo 'Generating type definitions ...'

babel-node --extensions .js,.ts,.tsx ./scripts/prebuild/generateTypes.js

echo 'Generating type definitions done!'
4 changes: 3 additions & 1 deletion ...ild/tasks/__tests__/makeLibStyles.test.js → ...ild/tasks/__tests__/makeLibStyles.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,5 +63,7 @@ if (isCI) {
})
})
} else {
it('skipping local tests', () => {})
it('skipping local tests', () => {
return null
})
}
4 changes: 3 additions & 1 deletion ...ild/tasks/__tests__/makeMainStyle.test.js → ...ild/tasks/__tests__/makeMainStyle.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -125,5 +125,7 @@ if (isCI) {
})
})
} else {
it('skipping local tests', () => {})
it('skipping local tests', () => {
return null
})
}
0 ...asks/__tests__/makePropertiesFile.test.js → ...asks/__tests__/makePropertiesFile.test.ts
View file
File renamed without changes.
4 changes: 2 additions & 2 deletions ...asks/__tests__/makeReleaseVersion.test.js → ...asks/__tests__/makeReleaseVersion.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,14 @@ import * as getNextReleaseVersion from '../../../postbuild/getNextReleaseVersion
jest.mock('../../../postbuild/getNextReleaseVersion', () => {
return {
...jest.requireActual('../../../postbuild/getNextReleaseVersion'),
getNextReleaseVersion: jest.fn().mockResolvedValue(),
getNextReleaseVersion: jest.fn().mockResolvedValue(false),
}
})

jest.mock('fs-extra', () => {
return {
...jest.requireActual('fs-extra'),
writeFile: jest.fn().mockResolvedValue(),
writeFile: jest.fn().mockResolvedValue(false),
}
})

Expand Down
0 ...asks/__tests__/postTypeGeneration.test.js → ...asks/__tests__/postTypeGeneration.test.ts
View file
File renamed without changes.
Loading

0 comments on commit 4669a4d

Please sign in to comment.