-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
ec45977
commit 506f18b
Showing
5 changed files
with
55 additions
and
0 deletions.
There are no files selected for viewing
23 changes: 23 additions & 0 deletions
23
packages/module/patternfly-docs/content/examples/IndentSection/IndentSection.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
--- | ||
# Sidenav top-level section | ||
# should be the same for all markdown files | ||
section: AI-infra-ui-components | ||
# Sidenav secondary level section | ||
# should be the same for all markdown files | ||
id: IndentSection | ||
# Tab (react | react-demos | html | html-demos | design-guidelines | accessibility) | ||
source: react | ||
# If you use typescript, the name of the interface to display props for | ||
# These are found through the sourceProps function provided in patternfly-docs.source.js | ||
propComponents: ['IndentSection'] | ||
--- | ||
|
||
import { IndentSection } from "@patternfly/ai-infra-ui-components"; | ||
|
||
Note: this component documents the API and enhances the [existing IndentSection](https://github.com/opendatahub-io/odh-dashboard/blob/main/frontend/src/pages/projects/components/IndentSection.tsx) component from odh-dashboard. It can be imported from [@patternfly/ai-infra-ui-components](https://www.npmjs.com/package/@patternfly/AI-infra-ui-components). Alternatively, it can be used within the odh-dashboard via the import: `~/pages/projects/components/IndentSection` | ||
|
||
### Example | ||
|
||
```js file="./IndentSectionBasic.tsx" | ||
|
||
``` |
16 changes: 16 additions & 0 deletions
16
packages/module/patternfly-docs/content/examples/IndentSection/IndentSectionBasic.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
import React from 'react'; | ||
import { Stack, StackItem } from '@patternfly/react-core'; | ||
import { IndentSection } from '@patternfly/ai-infra-ui-components'; | ||
|
||
export const IndentSectionBasic: React.FunctionComponent = () => { | ||
Check failure on line 5 in packages/module/patternfly-docs/content/examples/IndentSection/IndentSectionBasic.tsx GitHub Actions / call-build-lint-test-workflow / lint
|
||
return ( | ||
<Stack hasGutter> | ||
<StackItem>This text is not indented</StackItem> | ||
<StackItem> | ||
<IndentSection> | ||
This text is wrapped in an IndentSection and thus it is indented | ||
</IndentSection> | ||
</StackItem> | ||
</Stack> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,14 @@ | ||
import * as React from 'react'; | ||
import { Flex, FlexItem } from '@patternfly/react-core'; | ||
|
||
export type IndentSectionProps = { | ||
/** Content rendered inside the IndentSection. */ | ||
children: React.ReactNode; | ||
}; | ||
|
||
export const IndentSection: React.FunctionComponent<IndentSectionProps> = ({ children }: IndentSectionProps) => ( | ||
<Flex> | ||
<FlexItem spacer={{ default: 'spacerLg' }} /> | ||
<FlexItem flex={{ default: 'flex_1' }}>{children}</FlexItem> | ||
</Flex> | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './IndentSection'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,2 @@ | ||
export * from './DeleteModal'; | ||
export * from './IndentSection'; |