- Prop
value- Type
string | undefined- Default
- —
- Requirement
- optional
Docs Components Assistant
DirectiveText
React example follows below.
Vue example follows below.
Angular example follows below.
Svelte example follows below.
Solid example follows below.
- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
import { DirectiveText } from "@grassroot/ui-react/assistant"; export default function DirectiveTextDemo() { return <DirectiveText type="theme" label="Midnight" name="midnight" />;}- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
<script setup lang="ts">import { DirectiveText } from "@grassroot/ui-vue/assistant";</script> <template> <DirectiveText type="theme" label="Midnight" name="midnight" /></template>- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
import "./ensure-compiler";import { ChangeDetectionStrategy, Component } from "@angular/core";import { GrassrootDirectiveText } from "@grassroot/ui-angular/assistant"; @Component({ selector: "app-directive-text-demo", standalone: true, imports: [GrassrootDirectiveText], changeDetection: ChangeDetectionStrategy.OnPush, template: `<grassroot-directive-text type="theme" label="Midnight" name="midnight" />`,})export class DirectiveTextDemoComponent { } export default DirectiveTextDemoComponent;- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
<script lang="ts"> import { DirectiveText } from "@grassroot/ui-svelte/assistant"; </script> <DirectiveText type="theme" label="Midnight" name="midnight" />- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
/** @jsxImportSource solid-js */import { DirectiveText } from "@grassroot/ui-solid/assistant"; export default function DirectiveTextDemo() { return <DirectiveText type="theme" label="Midnight" name="midnight" />;}Installation
API Reference
Import
import { DirectiveText } from "@grassroot/ui-react/assistant";
Props
Prop
Type
Default
Requirement
valuestring | undefined—
optional
typestring | undefined—
optional
labelstring | undefined—
optional
namestring | undefined—
optional
- Prop
type- Type
string | undefined- Default
- —
- Requirement
- optional
- Prop
label- Type
string | undefined- Default
- —
- Requirement
- optional
- Prop
name- Type
string | undefined- Default
- —
- Requirement
- optional
Native attributes
Standard DOM and ARIA attributes not listed above spread onto the root element.
Import
import { DirectiveText } from "@grassroot/ui-vue/assistant";
Props
Prop
Type
Default
Requirement
valuestring—
optional
typestring"directive"optional
labelstring—
optional
namestring—
optional
- Prop
value- Type
string- Default
- —
- Requirement
- optional
- Prop
type- Type
string- Default
"directive"- Requirement
- optional
- Prop
label- Type
string- Default
- —
- Requirement
- optional
- Prop
name- Type
string- Default
- —
- Requirement
- optional
Import
import "./ensure-compiler";
import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootDirectiveText } from "@grassroot/ui-angular/assistant";
Props
Prop
Type
Default
Requirement
valuestring—
optional
typestring"directive"optional
labelstring—
optional
namestring—
optional
- Prop
value- Type
string- Default
- —
- Requirement
- optional
- Prop
type- Type
string- Default
"directive"- Requirement
- optional
- Prop
label- Type
string- Default
- —
- Requirement
- optional
- Prop
name- Type
string- Default
- —
- Requirement
- optional
Import
import { DirectiveText } from "@grassroot/ui-svelte/assistant";
Props
Prop
Type
Default
Requirement
valuestring—
optional
typestring"directive"optional
labelstring"Directive"optional
namestring—
optional
classstring—
optional
stylestring—
optional
- Prop
value- Type
string- Default
- —
- Requirement
- optional
- Prop
type- Type
string- Default
"directive"- Requirement
- optional
- Prop
label- Type
string- Default
"Directive"- Requirement
- optional
- Prop
name- Type
string- Default
- —
- Requirement
- optional
- Prop
class- Type
string- Default
- —
- Requirement
- optional
- Prop
style- Type
string- Default
- —
- Requirement
- optional
Import
import { DirectiveText } from "@grassroot/ui-solid/assistant";
Props
Prop
Type
Default
Requirement
valuestring—
optional
typestring—
optional
labelstring—
optional
namestring—
optional
- Prop
value- Type
string- Default
- —
- Requirement
- optional
- Prop
type- Type
string- Default
- —
- Requirement
- optional
- Prop
label- Type
string- Default
- —
- Requirement
- optional
- Prop
name- Type
string- Default
- —
- Requirement
- optional
Content regions
children
Native attributes
Standard DOM and ARIA attributes not listed above spread onto the root element.