Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,19 +4,19 @@ Repository for the web frontend engine

- UI components based on <a href="https://github.com/LifeSG/react-design-system" target="_blank" rel="noopener noreferrer">React design system</a>
- Form generation via JSON schema
- To see the schema and fields available, visit our <a href="https://designsystem.life.gov.sg/web-frontend-engine/index.html?path=/story/introduction-getting-started--page" target="_blank" rel="noopener noreferrer">Storybook documentation</a>.
- To see the schema and fields available, visit our <a href="https://designsystem.life.gov.sg/web-frontend-engine/index.html?path=/docs/introduction-getting-started--docs" target="_blank" rel="noopener noreferrer">Storybook documentation</a>.

The intention of frontend engine is to take out the heavy lifting of form development and offer a collection of common fields so engineers can develop forms quickly. The form will be defined through a JSON schema so non-engineers can customise the form as well.

## Dependencies

Developers are expected to have the following packages installed:

- @lifesg/react-design-system v3.4.0 or above
- @lifesg/react-icons 1.9.0
- react 17.0.2 or 18 or 19
- react-dom 17.0.2 or 18
- styled-components 6.1.19
- @lifesg/react-design-system `^v4.0.0-alpha.6`
- @lifesg/react-icons `^1.9.0`
- react `^17.0.2 || ^18.0.0 || ^19.0.0`
- react-dom `17.0.2 || ^18.0.0 || ^19.0.0`
- styled-components `^6.1.19`

## Installation

Expand Down
4 changes: 2 additions & 2 deletions src/stories/3-fields/button/button.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ const meta: Meta = {
},
startIcon: {
description:
"Add an icon based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a> before the button label",
"Add an icon based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a> before the button label",
table: {
type: {
summary: "Refer to React Icons",
Expand All @@ -77,7 +77,7 @@ const meta: Meta = {
},
endIcon: {
description:
"Add an icon based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a> after the button label",
"Add an icon based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a> after the button label",
table: {
type: {
summary: "Refer to React Icons",
Expand Down
4 changes: 2 additions & 2 deletions src/stories/3-fields/masked-field/masked-field.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ const meta: Meta = {
},
iconMask: {
description:
"The icon to mask the field, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a>",
"The icon to mask the field, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a>",
table: {
type: {
summary: "Refer to React Icons",
Expand All @@ -138,7 +138,7 @@ const meta: Meta = {
},
iconUnmask: {
description:
"The icon to unmask the field, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a>",
"The icon to unmask the field, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a>",
table: {
type: {
summary: "Refer to React Icons",
Expand Down
2 changes: 1 addition & 1 deletion src/stories/4-elements/alert/alert.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const meta: Meta = {
<p>
Please refer to the{" "}
<a
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/modules-alert--alert"
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/feedback-indicators-alert--docs"
target="_blank"
rel="noopener noreferrer"
>
Expand Down
2 changes: 1 addition & 1 deletion src/stories/4-elements/list/list.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const meta: Meta = {
<p>
Please refer to the{" "}
<a
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/general-textlist--docs"
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/core-textlist--docs"
target="_blank"
rel="noopener noreferrer"
>
Expand Down
2 changes: 1 addition & 1 deletion src/stories/4-elements/popover/popover.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ const meta: Meta = {
<p>
Please refer to the{" "}
<a
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/modules-popoverv2-popoverinline--docs"
href="https://designsystem.life.gov.sg/react/index.html?path=/docs/overlays-popoverinline--docs"
target="_blank"
rel="noopener noreferrer"
>
Expand Down
2 changes: 1 addition & 1 deletion src/stories/4-elements/section/section.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const meta: Meta = {
},
layoutType: {
description:
"<div>Determines how the presentation of the children is structured and displayed.<ul><li><strong>default:</strong> Does not modify the layout.</li><li><strong>grid</strong>: Render children in <a href='https://designsystem.life.gov.sg/react/index.html?path=/story/getting-started-layout--grid-layout' target='_blank' rel='noopener noreferrer'>grid layout</a>.</li><li><strong>contain</strong>: Render children within <a href='https://designsystem.life.gov.sg/react/index.html?path=/docs/getting-started-layout--general-usage' target='_blank' rel='noopener noreferrer' >Layout.Content</a> within 1320px in block display.</li></ul></div>",
"<div>Determines how the presentation of the children is structured and displayed.<ul><li><strong>default:</strong> Does not modify the layout.</li><li><strong>grid</strong>: Render children in <a href='https://designsystem.life.gov.sg/react/index.html?path=/docs/core-layout--docs#grid-layout' target='_blank' rel='noopener noreferrer'>grid layout</a>.</li><li><strong>contain</strong>: Render children within <a href='https://designsystem.life.gov.sg/react/index.html?path=/docs/core-layout--docs#anatomy' target='_blank' rel='noopener noreferrer' >Layout.Content</a>.</li></ul></div>",
table: {
type: {
summary: "default | grid | contain",
Expand Down
4 changes: 2 additions & 2 deletions src/stories/5-custom/array-field/array-field.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,7 @@ const meta: Meta = {

<ul>
<li>\`label\` prop overrides the text</li>
<li>\`icon\` prop overrides the icon, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a></li>
<li>\`icon\` prop overrides the icon, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a></li>
<li>\`styleType\` prop sets the button style (\`default\`, \`secondary\`, \`light\`, \`link\`)</li>
</ul>
`,
Expand All @@ -101,7 +101,7 @@ const meta: Meta = {

<ul>
<li>\`label\` prop overrides the text</li>
<li>\`icon\` prop sets the icon, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/story/collection--page' target='_blank' rel='noopener noreferrer'>React Icons</a></li>
<li>\`icon\` prop sets the icon, based on <a href='https://designsystem.life.gov.sg/reacticons/index.html?path=/docs/collection--docs' target='_blank' rel='noopener noreferrer'>React Icons</a></li>
<li>\`styleType\` prop sets the button style (\`default\`, \`secondary\`, \`light\`, \`link\`)</li>
<li>\`position\` prop sets button position: \`top\` (default) or \`bottom\`</li>
<li>\`alignment\` prop sets button alignment: \`left\` or \`right\` (default)</li>
Expand Down