Format fixes

pull/5880/head
tugcekucukoglu 2024-06-12 18:05:12 +03:00
parent 411d002834
commit 3b20ef5ea6
84 changed files with 14378 additions and 15101 deletions

View File

@ -1,4 +1,3 @@
/**
*
* Accordion Design Tokens
@ -12,251 +11,242 @@
import { ColorSchemeDesignToken } from '..';
export interface AccordionDesignTokens extends ColorSchemeDesignToken<AccordionDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken accordion.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken accordion.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the panel section
*/
* Used to pass tokens of the panel section
*/
panel?: {
/**
* Border width of panel
*
* @designToken accordion.panel.border.width
*/
borderWidth?: string;
/**
* Border color of panel
*
* @designToken accordion.panel.border.color
*/
borderColor?: string;
};
/**
* Border width of panel
*
* @designToken accordion.panel.border.width
*/
borderWidth?: string;
/**
* Border color of panel
*
* @designToken accordion.panel.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the header section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Color of header
*
* @designToken accordion.header.color
*/
color?: string;
/**
* Hover color of header
*
* @designToken accordion.header.hover.color
*/
hoverColor?: string;
/**
* Active color of header
*
* @designToken accordion.header.active.color
*/
activeColor?: string;
/**
* Padding of header
*
* @designToken accordion.header.padding
*/
padding?: string;
/**
* Font weight of header
*
* @designToken accordion.header.font.weight
*/
fontWeight?: string;
/**
* Border radius of header
*
* @designToken accordion.header.border.radius
*/
borderRadius?: string;
/**
* Border width of header
*
* @designToken accordion.header.border.width
*/
borderWidth?: string;
/**
* Border color of header
*
* @designToken accordion.header.border.color
*/
borderColor?: string;
/**
* Background of header
*
* @designToken accordion.header.background
*/
background?: string;
/**
* Hover background of header
*
* @designToken accordion.header.hover.background
*/
hoverBackground?: string;
/**
* Active background of header
*
* @designToken accordion.header.active.background
*/
activeBackground?: string;
/**
* Active hover background of header
*
* @designToken accordion.header.active.hover.background
*/
activeHoverBackground?: string;
/**
* Focus ring of header
*/
focusRing?: {
/**
* Focus ring width of header
*
* @designToken accordion.header.focus.ring.width
*/
width?: string;
/**
* Focus ring style of header
*
* @designToken accordion.header.focus.ring.style
*/
style?: string;
/**
* Focus ring color of header
*
* @designToken accordion.header.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of header
*
* @designToken accordion.header.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of header
*
* @designToken accordion.header.focus.ring.shadow
*/
shadow?: string;
/**
* Color of header
*
* @designToken accordion.header.color
*/
color?: string;
/**
* Hover color of header
*
* @designToken accordion.header.hover.color
*/
hoverColor?: string;
/**
* Active color of header
*
* @designToken accordion.header.active.color
*/
activeColor?: string;
/**
* Padding of header
*
* @designToken accordion.header.padding
*/
padding?: string;
/**
* Font weight of header
*
* @designToken accordion.header.font.weight
*/
fontWeight?: string;
/**
* Border radius of header
*
* @designToken accordion.header.border.radius
*/
borderRadius?: string;
/**
* Border width of header
*
* @designToken accordion.header.border.width
*/
borderWidth?: string;
/**
* Border color of header
*
* @designToken accordion.header.border.color
*/
borderColor?: string;
/**
* Background of header
*
* @designToken accordion.header.background
*/
background?: string;
/**
* Hover background of header
*
* @designToken accordion.header.hover.background
*/
hoverBackground?: string;
/**
* Active background of header
*
* @designToken accordion.header.active.background
*/
activeBackground?: string;
/**
* Active hover background of header
*
* @designToken accordion.header.active.hover.background
*/
activeHoverBackground?: string;
/**
* Focus ring of header
*/
focusRing?: {
/**
* Focus ring width of header
*
* @designToken accordion.header.focus.ring.width
*/
width?: string;
/**
* Focus ring style of header
*
* @designToken accordion.header.focus.ring.style
*/
style?: string;
/**
* Focus ring color of header
*
* @designToken accordion.header.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of header
*
* @designToken accordion.header.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of header
*
* @designToken accordion.header.focus.ring.shadow
*/
shadow?: string;
};
/**
* Toggle icon of header
*/
toggleIcon?: {
/**
* Toggle icon color of header
*
* @designToken accordion.header.toggle.icon.color
*/
color?: string;
/**
* Toggle icon hover color of header
*
* @designToken accordion.header.toggle.icon.hover.color
*/
hoverColor?: string;
/**
* Toggle icon active color of header
*
* @designToken accordion.header.toggle.icon.active.color
*/
activeColor?: string;
/**
* Toggle icon active hover color of header
*
* @designToken accordion.header.toggle.icon.active.hover.color
*/
activeHoverColor?: string;
};
/**
* First of header
*/
first?: {
/**
* First top border radius of header
*
* @designToken accordion.header.first.top.border.radius
*/
topBorderRadius?: string;
/**
* First border width of header
*
* @designToken accordion.header.first.border.width
*/
borderWidth?: string;
};
/**
* Last of header
*/
last?: {
/**
* Last bottom border radius of header
*
* @designToken accordion.header.last.bottom.border.radius
*/
bottomBorderRadius?: string;
/**
* Last active bottom border radius of header
*
* @designToken accordion.header.last.active.bottom.border.radius
*/
activeBottomBorderRadius?: string;
};
};
/**
* Toggle icon of header
*/
toggleIcon?: {
/**
* Toggle icon color of header
*
* @designToken accordion.header.toggle.icon.color
*/
color?: string;
/**
* Toggle icon hover color of header
*
* @designToken accordion.header.toggle.icon.hover.color
*/
hoverColor?: string;
/**
* Toggle icon active color of header
*
* @designToken accordion.header.toggle.icon.active.color
*/
activeColor?: string;
/**
* Toggle icon active hover color of header
*
* @designToken accordion.header.toggle.icon.active.hover.color
*/
activeHoverColor?: string;
};
/**
* First of header
*/
first?: {
/**
* First top border radius of header
*
* @designToken accordion.header.first.top.border.radius
*/
topBorderRadius?: string;
/**
* First border width of header
*
* @designToken accordion.header.first.border.width
*/
borderWidth?: string;
};
/**
* Last of header
*/
last?: {
/**
* Last bottom border radius of header
*
* @designToken accordion.header.last.bottom.border.radius
*/
bottomBorderRadius?: string;
/**
* Last active bottom border radius of header
*
* @designToken accordion.header.last.active.bottom.border.radius
*/
activeBottomBorderRadius?: string;
};
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Border width of content
*
* @designToken accordion.content.border.width
*/
borderWidth?: string;
/**
* Border color of content
*
* @designToken accordion.content.border.color
*/
borderColor?: string;
/**
* Background of content
*
* @designToken accordion.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken accordion.content.color
*/
color?: string;
/**
* Padding of content
*
* @designToken accordion.content.padding
*/
padding?: string;
}
/**
* Border width of content
*
* @designToken accordion.content.border.width
*/
borderWidth?: string;
/**
* Border color of content
*
* @designToken accordion.content.border.color
*/
borderColor?: string;
/**
* Background of content
*
* @designToken accordion.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken accordion.content.color
*/
color?: string;
/**
* Padding of content
*
* @designToken accordion.content.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* AutoComplete Design Tokens
@ -12,419 +11,408 @@
import { ColorSchemeDesignToken } from '..';
export interface AutoCompleteDesignTokens extends ColorSchemeDesignToken<AutoCompleteDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken autocomplete.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken autocomplete.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken autocomplete.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken autocomplete.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken autocomplete.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken autocomplete.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken autocomplete.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken autocomplete.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken autocomplete.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken autocomplete.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken autocomplete.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken autocomplete.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken autocomplete.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken autocomplete.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken autocomplete.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken autocomplete.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken autocomplete.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken autocomplete.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken autocomplete.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken autocomplete.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken autocomplete.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken autocomplete.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken autocomplete.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken autocomplete.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken autocomplete.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken autocomplete.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken autocomplete.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken autocomplete.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken autocomplete.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken autocomplete.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken autocomplete.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken autocomplete.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken autocomplete.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken autocomplete.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken autocomplete.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken autocomplete.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken autocomplete.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken autocomplete.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken autocomplete.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken autocomplete.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken autocomplete.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken autocomplete.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the overlay section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken autocomplete.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken autocomplete.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken autocomplete.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken autocomplete.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken autocomplete.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken autocomplete.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken autocomplete.list.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken autocomplete.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken autocomplete.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken autocomplete.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken autocomplete.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken autocomplete.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken autocomplete.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken autocomplete.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken autocomplete.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken autocomplete.option.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the option group section
*/
optionGroup?: {
/**
* Background of option group
*
* @designToken autocomplete.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken autocomplete.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken autocomplete.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken autocomplete.option.group.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken autocomplete.dropdown.width
*/
width?: string;
/**
* Border color of dropdown
*
* @designToken autocomplete.dropdown.border.color
*/
borderColor?: string;
/**
* Hover border color of dropdown
*
* @designToken autocomplete.dropdown.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of dropdown
*
* @designToken autocomplete.dropdown.active.border.color
*/
activeBorderColor?: string;
/**
* Border radius of dropdown
*
* @designToken autocomplete.dropdown.border.radius
*/
borderRadius?: string;
/**
* Focus ring of dropdown
*/
focusRing?: {
/**
* Focus ring width of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.width
*/
width?: string;
/**
* Focus ring style of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.style
*/
style?: string;
/**
* Focus ring color of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.shadow
*/
shadow?: string;
/**
* Background of overlay
*
* @designToken autocomplete.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken autocomplete.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken autocomplete.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken autocomplete.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken autocomplete.overlay.shadow
*/
shadow?: string;
};
/**
* Background of dropdown
*
* @designToken autocomplete.dropdown.background
*/
background?: string;
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken autocomplete.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken autocomplete.list.gap
*/
gap?: string;
};
/**
* Hover background of dropdown
*
* @designToken autocomplete.dropdown.hover.background
*/
hoverBackground?: string;
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken autocomplete.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken autocomplete.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken autocomplete.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken autocomplete.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken autocomplete.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken autocomplete.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken autocomplete.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken autocomplete.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken autocomplete.option.border.radius
*/
borderRadius?: string;
};
/**
* Active background of dropdown
*
* @designToken autocomplete.dropdown.active.background
*/
activeBackground?: string;
* Used to pass tokens of the option group section
*/
optionGroup?: {
/**
* Background of option group
*
* @designToken autocomplete.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken autocomplete.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken autocomplete.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken autocomplete.option.group.padding
*/
padding?: string;
};
/**
* Color of dropdown
*
* @designToken autocomplete.dropdown.color
*/
color?: string;
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken autocomplete.dropdown.width
*/
width?: string;
/**
* Border color of dropdown
*
* @designToken autocomplete.dropdown.border.color
*/
borderColor?: string;
/**
* Hover border color of dropdown
*
* @designToken autocomplete.dropdown.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of dropdown
*
* @designToken autocomplete.dropdown.active.border.color
*/
activeBorderColor?: string;
/**
* Border radius of dropdown
*
* @designToken autocomplete.dropdown.border.radius
*/
borderRadius?: string;
/**
* Focus ring of dropdown
*/
focusRing?: {
/**
* Focus ring width of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.width
*/
width?: string;
/**
* Focus ring style of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.style
*/
style?: string;
/**
* Focus ring color of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of dropdown
*
* @designToken autocomplete.dropdown.focus.ring.shadow
*/
shadow?: string;
};
/**
* Background of dropdown
*
* @designToken autocomplete.dropdown.background
*/
background?: string;
/**
* Hover background of dropdown
*
* @designToken autocomplete.dropdown.hover.background
*/
hoverBackground?: string;
/**
* Active background of dropdown
*
* @designToken autocomplete.dropdown.active.background
*/
activeBackground?: string;
/**
* Color of dropdown
*
* @designToken autocomplete.dropdown.color
*/
color?: string;
/**
* Hover color of dropdown
*
* @designToken autocomplete.dropdown.hover.color
*/
hoverColor?: string;
/**
* Active color of dropdown
*
* @designToken autocomplete.dropdown.active.color
*/
activeColor?: string;
};
/**
* Hover color of dropdown
*
* @designToken autocomplete.dropdown.hover.color
*/
hoverColor?: string;
/**
* Active color of dropdown
*
* @designToken autocomplete.dropdown.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the chip section
*/
* Used to pass tokens of the chip section
*/
chip?: {
/**
* Border radius of chip
*
* @designToken autocomplete.chip.border.radius
*/
borderRadius?: string;
};
/**
* Border radius of chip
*
* @designToken autocomplete.chip.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the empty message section
*/
* Used to pass tokens of the empty message section
*/
emptyMessage?: {
/**
* Padding of empty message
*
* @designToken autocomplete.empty.message.padding
*/
padding?: string;
}
/**
* Padding of empty message
*
* @designToken autocomplete.empty.message.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Avatar Design Tokens
@ -12,107 +11,102 @@
import { ColorSchemeDesignToken } from '..';
export interface AvatarDesignTokens extends ColorSchemeDesignToken<AvatarDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Width of root
*
* @designToken avatar.width
*/
width?: string;
/**
* Height of root
*
* @designToken avatar.height
*/
height?: string;
/**
* Font size of root
*
* @designToken avatar.font.size
*/
fontSize?: string;
/**
* Background of root
*
* @designToken avatar.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken avatar.border.radius
*/
borderRadius?: string;
};
/**
* Width of root
*
* @designToken avatar.width
*/
width?: string;
/**
* Height of root
*
* @designToken avatar.height
*/
height?: string;
/**
* Font size of root
*
* @designToken avatar.font.size
*/
fontSize?: string;
/**
* Background of root
*
* @designToken avatar.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken avatar.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the group section
*/
* Used to pass tokens of the group section
*/
group?: {
/**
* Border color of group
*
* @designToken avatar.group.border.color
*/
borderColor?: string;
/**
* Offset of group
*
* @designToken avatar.group.offset
*/
offset?: string;
};
/**
* Border color of group
*
* @designToken avatar.group.border.color
*/
borderColor?: string;
/**
* Offset of group
*
* @designToken avatar.group.offset
*/
offset?: string;
}
/**
* Used to pass tokens of the lg section
*/
* Used to pass tokens of the lg section
*/
lg?: {
/**
* Width of lg
*
* @designToken avatar.lg.width
*/
width?: string;
/**
* Height of lg
*
* @designToken avatar.lg.height
*/
height?: string;
/**
* Font size of lg
*
* @designToken avatar.lg.font.size
*/
fontSize?: string;
};
/**
* Width of lg
*
* @designToken avatar.lg.width
*/
width?: string;
/**
* Height of lg
*
* @designToken avatar.lg.height
*/
height?: string;
/**
* Font size of lg
*
* @designToken avatar.lg.font.size
*/
fontSize?: string;
}
/**
* Used to pass tokens of the xl section
*/
* Used to pass tokens of the xl section
*/
xl?: {
/**
* Width of xl
*
* @designToken avatar.xl.width
*/
width?: string;
/**
* Height of xl
*
* @designToken avatar.xl.height
*/
height?: string;
/**
* Font size of xl
*
* @designToken avatar.xl.font.size
*/
fontSize?: string;
}
/**
* Width of xl
*
* @designToken avatar.xl.width
*/
width?: string;
/**
* Height of xl
*
* @designToken avatar.xl.height
*/
height?: string;
/**
* Font size of xl
*
* @designToken avatar.xl.font.size
*/
fontSize?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Badge Design Tokens
@ -12,257 +11,244 @@
import { ColorSchemeDesignToken } from '..';
export interface BadgeDesignTokens extends ColorSchemeDesignToken<BadgeDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken badge.border.radius
*/
borderRadius?: string;
/**
* Padding of root
*
* @designToken badge.padding
*/
padding?: string;
/**
* Font size of root
*
* @designToken badge.font.size
*/
fontSize?: string;
/**
* Font weight of root
*
* @designToken badge.font.weight
*/
fontWeight?: string;
/**
* Min width of root
*
* @designToken badge.min.width
*/
minWidth?: string;
/**
* Height of root
*
* @designToken badge.height
*/
height?: string;
};
/**
* Border radius of root
*
* @designToken badge.border.radius
*/
borderRadius?: string;
/**
* Padding of root
*
* @designToken badge.padding
*/
padding?: string;
/**
* Font size of root
*
* @designToken badge.font.size
*/
fontSize?: string;
/**
* Font weight of root
*
* @designToken badge.font.weight
*/
fontWeight?: string;
/**
* Min width of root
*
* @designToken badge.min.width
*/
minWidth?: string;
/**
* Height of root
*
* @designToken badge.height
*/
height?: string;
}
/**
* Used to pass tokens of the dot section
*/
* Used to pass tokens of the dot section
*/
dot?: {
/**
* Size of dot
*
* @designToken badge.dot.size
*/
size?: string;
};
/**
* Size of dot
*
* @designToken badge.dot.size
*/
size?: string;
}
/**
* Used to pass tokens of the sm section
*/
* Used to pass tokens of the sm section
*/
sm?: {
/**
* Font size of sm
*
* @designToken badge.sm.font.size
*/
fontSize?: string;
/**
* Min width of sm
*
* @designToken badge.sm.min.width
*/
minWidth?: string;
/**
* Height of sm
*
* @designToken badge.sm.height
*/
height?: string;
};
/**
* Font size of sm
*
* @designToken badge.sm.font.size
*/
fontSize?: string;
/**
* Min width of sm
*
* @designToken badge.sm.min.width
*/
minWidth?: string;
/**
* Height of sm
*
* @designToken badge.sm.height
*/
height?: string;
}
/**
* Used to pass tokens of the lg section
*/
* Used to pass tokens of the lg section
*/
lg?: {
/**
* Font size of lg
*
* @designToken badge.lg.font.size
*/
fontSize?: string;
/**
* Min width of lg
*
* @designToken badge.lg.min.width
*/
minWidth?: string;
/**
* Height of lg
*
* @designToken badge.lg.height
*/
height?: string;
};
/**
* Font size of lg
*
* @designToken badge.lg.font.size
*/
fontSize?: string;
/**
* Min width of lg
*
* @designToken badge.lg.min.width
*/
minWidth?: string;
/**
* Height of lg
*
* @designToken badge.lg.height
*/
height?: string;
}
/**
* Used to pass tokens of the xl section
*/
* Used to pass tokens of the xl section
*/
xl?: {
/**
* Font size of xl
*
* @designToken badge.xl.font.size
*/
fontSize?: string;
/**
* Min width of xl
*
* @designToken badge.xl.min.width
*/
minWidth?: string;
/**
* Height of xl
*
* @designToken badge.xl.height
*/
height?: string;
};
/**
* Font size of xl
*
* @designToken badge.xl.font.size
*/
fontSize?: string;
/**
* Min width of xl
*
* @designToken badge.xl.min.width
*/
minWidth?: string;
/**
* Height of xl
*
* @designToken badge.xl.height
*/
height?: string;
}
/**
* Used to pass tokens of the primary section
*/
* Used to pass tokens of the primary section
*/
primary?: {
/**
* Background of primary
*
* @designToken badge.primary.background
*/
background?: string;
/**
* Color of primary
*
* @designToken badge.primary.color
*/
color?: string;
};
/**
* Background of primary
*
* @designToken badge.primary.background
*/
background?: string;
/**
* Color of primary
*
* @designToken badge.primary.color
*/
color?: string;
}
/**
* Used to pass tokens of the secondary section
*/
* Used to pass tokens of the secondary section
*/
secondary?: {
/**
* Background of secondary
*
* @designToken badge.secondary.background
*/
background?: string;
/**
* Color of secondary
*
* @designToken badge.secondary.color
*/
color?: string;
};
/**
* Background of secondary
*
* @designToken badge.secondary.background
*/
background?: string;
/**
* Color of secondary
*
* @designToken badge.secondary.color
*/
color?: string;
}
/**
* Used to pass tokens of the success section
*/
* Used to pass tokens of the success section
*/
success?: {
/**
* Background of success
*
* @designToken badge.success.background
*/
background?: string;
/**
* Color of success
*
* @designToken badge.success.color
*/
color?: string;
};
/**
* Background of success
*
* @designToken badge.success.background
*/
background?: string;
/**
* Color of success
*
* @designToken badge.success.color
*/
color?: string;
}
/**
* Used to pass tokens of the info section
*/
* Used to pass tokens of the info section
*/
info?: {
/**
* Background of info
*
* @designToken badge.info.background
*/
background?: string;
/**
* Color of info
*
* @designToken badge.info.color
*/
color?: string;
};
/**
* Background of info
*
* @designToken badge.info.background
*/
background?: string;
/**
* Color of info
*
* @designToken badge.info.color
*/
color?: string;
}
/**
* Used to pass tokens of the warn section
*/
* Used to pass tokens of the warn section
*/
warn?: {
/**
* Background of warn
*
* @designToken badge.warn.background
*/
background?: string;
/**
* Color of warn
*
* @designToken badge.warn.color
*/
color?: string;
};
/**
* Background of warn
*
* @designToken badge.warn.background
*/
background?: string;
/**
* Color of warn
*
* @designToken badge.warn.color
*/
color?: string;
}
/**
* Used to pass tokens of the danger section
*/
* Used to pass tokens of the danger section
*/
danger?: {
/**
* Background of danger
*
* @designToken badge.danger.background
*/
background?: string;
/**
* Color of danger
*
* @designToken badge.danger.color
*/
color?: string;
};
/**
* Background of danger
*
* @designToken badge.danger.background
*/
background?: string;
/**
* Color of danger
*
* @designToken badge.danger.color
*/
color?: string;
}
/**
* Used to pass tokens of the contrast section
*/
* Used to pass tokens of the contrast section
*/
contrast?: {
/**
* Background of contrast
*
* @designToken badge.contrast.background
*/
background?: string;
/**
* Color of contrast
*
* @designToken badge.contrast.color
*/
color?: string;
}
/**
* Background of contrast
*
* @designToken badge.contrast.background
*/
background?: string;
/**
* Color of contrast
*
* @designToken badge.contrast.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* BlockUI Design Tokens
@ -12,17 +11,15 @@
import { ColorSchemeDesignToken } from '..';
export interface BlockUIDesignTokens extends ColorSchemeDesignToken<BlockUIDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken blockui.border.radius
*/
borderRadius?: string;
}
/**
* Border radius of root
*
* @designToken blockui.border.radius
*/
borderRadius?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Breadcrumb Design Tokens
@ -12,113 +11,108 @@
import { ColorSchemeDesignToken } from '..';
export interface BreadcrumbDesignTokens extends ColorSchemeDesignToken<BreadcrumbDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Padding of root
*
* @designToken breadcrumb.padding
*/
padding?: string;
/**
* Background of root
*
* @designToken breadcrumb.background
*/
background?: string;
/**
* Gap of root
*
* @designToken breadcrumb.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken breadcrumb.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Color of item
*
* @designToken breadcrumb.item.color
*/
color?: string;
/**
* Hover color of item
*
* @designToken breadcrumb.item.hover.color
*/
hoverColor?: string;
/**
* Icon color of item
*
* @designToken breadcrumb.item.icon.color
*/
iconColor?: string;
/**
* Border radius of item
*
* @designToken breadcrumb.item.border.radius
*/
borderRadius?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken breadcrumb.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken breadcrumb.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken breadcrumb.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken breadcrumb.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken breadcrumb.item.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken breadcrumb.padding
*/
padding?: string;
/**
* Background of root
*
* @designToken breadcrumb.background
*/
background?: string;
/**
* Gap of root
*
* @designToken breadcrumb.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken breadcrumb.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the separator section
*/
* Used to pass tokens of the item section
*/
item?: {
/**
* Color of item
*
* @designToken breadcrumb.item.color
*/
color?: string;
/**
* Hover color of item
*
* @designToken breadcrumb.item.hover.color
*/
hoverColor?: string;
/**
* Icon color of item
*
* @designToken breadcrumb.item.icon.color
*/
iconColor?: string;
/**
* Border radius of item
*
* @designToken breadcrumb.item.border.radius
*/
borderRadius?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken breadcrumb.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken breadcrumb.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken breadcrumb.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken breadcrumb.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken breadcrumb.item.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Color of separator
*
* @designToken breadcrumb.separator.color
*/
color?: string;
}
/**
* Color of separator
*
* @designToken breadcrumb.separator.color
*/
color?: string;
};
}

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,3 @@
/**
*
* Card Design Tokens
@ -12,95 +11,89 @@
import { ColorSchemeDesignToken } from '..';
export interface CardDesignTokens extends ColorSchemeDesignToken<CardDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken card.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken card.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken card.color
*/
color?: string;
/**
* Shadow of root
*
* @designToken card.shadow
*/
shadow?: string;
};
/**
* Background of root
*
* @designToken card.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken card.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken card.color
*/
color?: string;
/**
* Shadow of root
*
* @designToken card.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the body section
*/
* Used to pass tokens of the body section
*/
body?: {
/**
* Padding of body
*
* @designToken card.body.padding
*/
padding?: string;
/**
* Gap of body
*
* @designToken card.body.gap
*/
gap?: string;
};
/**
* Padding of body
*
* @designToken card.body.padding
*/
padding?: string;
/**
* Gap of body
*
* @designToken card.body.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the caption section
*/
* Used to pass tokens of the caption section
*/
caption?: {
/**
* Gap of caption
*
* @designToken card.caption.gap
*/
gap?: string;
};
/**
* Gap of caption
*
* @designToken card.caption.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the title section
*/
* Used to pass tokens of the title section
*/
title?: {
/**
* Font size of title
*
* @designToken card.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken card.title.font.weight
*/
fontWeight?: string;
};
/**
* Font size of title
*
* @designToken card.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken card.title.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the subtitle section
*/
* Used to pass tokens of the subtitle section
*/
subtitle?: {
/**
* Color of subtitle
*
* @designToken card.subtitle.color
*/
color?: string;
}
/**
* Color of subtitle
*
* @designToken card.subtitle.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Carousel Design Tokens
@ -12,119 +11,113 @@
import { ColorSchemeDesignToken } from '..';
export interface CarouselDesignTokens extends ColorSchemeDesignToken<CarouselDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Indicator list of root
*/
indicatorList?: {
/**
* Indicator list padding of root
*
* @designToken carousel.indicator.list.padding
*/
padding?: string;
/**
* Indicator list gap of root
*
* @designToken carousel.indicator.list.gap
*/
gap?: string;
/**
* Indicator list of root
*/
indicatorList?: {
/**
* Indicator list padding of root
*
* @designToken carousel.indicator.list.padding
*/
padding?: string;
/**
* Indicator list gap of root
*
* @designToken carousel.indicator.list.gap
*/
gap?: string;
};
/**
* Indicator of root
*/
indicator?: {
/**
* Indicator width of root
*
* @designToken carousel.indicator.width
*/
width?: string;
/**
* Indicator height of root
*
* @designToken carousel.indicator.height
*/
height?: string;
/**
* Indicator border radius of root
*
* @designToken carousel.indicator.border.radius
*/
borderRadius?: string;
/**
* Indicator focus ring of root
*/
focusRing?: {
/**
* Indicator focus ring width of root
*
* @designToken carousel.indicator.focus.ring.width
*/
width?: string;
/**
* Indicator focus ring style of root
*
* @designToken carousel.indicator.focus.ring.style
*/
style?: string;
/**
* Indicator focus ring color of root
*
* @designToken carousel.indicator.focus.ring.color
*/
color?: string;
/**
* Indicator focus ring offset of root
*
* @designToken carousel.indicator.focus.ring.offset
*/
offset?: string;
/**
* Indicator focus ring shadow of root
*
* @designToken carousel.indicator.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Transition duration of root
*
* @designToken carousel.transition.duration
*/
transitionDuration?: string;
};
/**
* Indicator of root
*/
* Used to pass tokens of the indicator section
*/
indicator?: {
/**
* Indicator width of root
*
* @designToken carousel.indicator.width
*/
width?: string;
/**
* Indicator height of root
*
* @designToken carousel.indicator.height
*/
height?: string;
/**
* Indicator border radius of root
*
* @designToken carousel.indicator.border.radius
*/
borderRadius?: string;
/**
* Indicator focus ring of root
*/
focusRing?: {
/**
* Indicator focus ring width of root
*
* @designToken carousel.indicator.focus.ring.width
*/
width?: string;
/**
* Indicator focus ring style of root
*
* @designToken carousel.indicator.focus.ring.style
*/
style?: string;
/**
* Indicator focus ring color of root
*
* @designToken carousel.indicator.focus.ring.color
*/
color?: string;
/**
* Indicator focus ring offset of root
*
* @designToken carousel.indicator.focus.ring.offset
*/
offset?: string;
/**
* Indicator focus ring shadow of root
*
* @designToken carousel.indicator.focus.ring.shadow
*/
shadow?: string;
/**
* Background of indicator
*
* @designToken carousel.indicator.background
*/
background?: string;
/**
* Hover background of indicator
*
* @designToken carousel.indicator.hover.background
*/
hoverBackground?: string;
/**
* Active background of indicator
*
* @designToken carousel.indicator.active.background
*/
activeBackground?: string;
};
};
/**
* Transition duration of root
*
* @designToken carousel.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the indicator section
*/
indicator?: {
/**
* Background of indicator
*
* @designToken carousel.indicator.background
*/
background?: string;
/**
* Hover background of indicator
*
* @designToken carousel.indicator.hover.background
*/
hoverBackground?: string;
/**
* Active background of indicator
*
* @designToken carousel.indicator.active.background
*/
activeBackground?: string;
}
}

View File

@ -1,4 +1,3 @@
/**
*
* CascadeSelect Design Tokens
@ -12,299 +11,291 @@
import { ColorSchemeDesignToken } from '..';
export interface CascadeSelectDesignTokens extends ColorSchemeDesignToken<CascadeSelectDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken cascadeselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken cascadeselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken cascadeselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken cascadeselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken cascadeselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken cascadeselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken cascadeselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken cascadeselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken cascadeselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken cascadeselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken cascadeselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken cascadeselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken cascadeselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken cascadeselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken cascadeselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken cascadeselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken cascadeselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken cascadeselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken cascadeselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken cascadeselect.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken cascadeselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken cascadeselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken cascadeselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken cascadeselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken cascadeselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken cascadeselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken cascadeselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken cascadeselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken cascadeselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken cascadeselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken cascadeselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken cascadeselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken cascadeselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken cascadeselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken cascadeselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken cascadeselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken cascadeselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken cascadeselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken cascadeselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken cascadeselect.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken cascadeselect.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken cascadeselect.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the dropdown section
*/
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken cascadeselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken cascadeselect.dropdown.color
*/
color?: string;
}
/**
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken cascadeselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken cascadeselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken cascadeselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken cascadeselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken cascadeselect.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken cascadeselect.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken cascadeselect.list.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken cascadeselect.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken cascadeselect.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken cascadeselect.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken cascadeselect.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken cascadeselect.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken cascadeselect.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken cascadeselect.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken cascadeselect.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken cascadeselect.option.border.radius
*/
borderRadius?: string;
/**
* Icon of option
*/
icon?: {
/**
* Icon color of option
*
* @designToken cascadeselect.option.icon.color
*/
color?: string;
/**
* Icon focus color of option
*
* @designToken cascadeselect.option.icon.focus.color
*/
focusColor?: string;
/**
* Icon size of option
*
* @designToken cascadeselect.option.icon.size
*/
size?: string;
/**
* Width of dropdown
*
* @designToken cascadeselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken cascadeselect.dropdown.color
*/
color?: string;
};
/**
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken cascadeselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken cascadeselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken cascadeselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken cascadeselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken cascadeselect.overlay.shadow
*/
shadow?: string;
};
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken cascadeselect.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken cascadeselect.list.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken cascadeselect.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken cascadeselect.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken cascadeselect.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken cascadeselect.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken cascadeselect.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken cascadeselect.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken cascadeselect.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken cascadeselect.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken cascadeselect.option.border.radius
*/
borderRadius?: string;
/**
* Icon of option
*/
icon?: {
/**
* Icon color of option
*
* @designToken cascadeselect.option.icon.color
*/
color?: string;
/**
* Icon focus color of option
*
* @designToken cascadeselect.option.icon.focus.color
*/
focusColor?: string;
/**
* Icon size of option
*
* @designToken cascadeselect.option.icon.size
*/
size?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Checkbox Design Tokens
@ -12,185 +11,181 @@
import { ColorSchemeDesignToken } from '..';
export interface CheckboxDesignTokens extends ColorSchemeDesignToken<CheckboxDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken checkbox.border.radius
*/
borderRadius?: string;
/**
* Width of root
*
* @designToken checkbox.width
*/
width?: string;
/**
* Height of root
*
* @designToken checkbox.height
*/
height?: string;
/**
* Background of root
*
* @designToken checkbox.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken checkbox.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken checkbox.checked.hover.background
*/
checkedHoverBackground?: string;
/**
* Disabled background of root
*
* @designToken checkbox.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken checkbox.filled.background
*/
filledBackground?: string;
/**
* Border color of root
*
* @designToken checkbox.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken checkbox.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken checkbox.focus.border.color
*/
focusBorderColor?: string;
/**
* Checked border color of root
*
* @designToken checkbox.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken checkbox.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Checked focus border color of root
*
* @designToken checkbox.checked.focus.border.color
*/
checkedFocusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken checkbox.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Shadow of root
*
* @designToken checkbox.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken checkbox.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken checkbox.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken checkbox.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken checkbox.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken checkbox.focus.ring.shadow
*/
shadow?: string;
/**
* Border radius of root
*
* @designToken checkbox.border.radius
*/
borderRadius?: string;
/**
* Width of root
*
* @designToken checkbox.width
*/
width?: string;
/**
* Height of root
*
* @designToken checkbox.height
*/
height?: string;
/**
* Background of root
*
* @designToken checkbox.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken checkbox.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken checkbox.checked.hover.background
*/
checkedHoverBackground?: string;
/**
* Disabled background of root
*
* @designToken checkbox.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken checkbox.filled.background
*/
filledBackground?: string;
/**
* Border color of root
*
* @designToken checkbox.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken checkbox.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken checkbox.focus.border.color
*/
focusBorderColor?: string;
/**
* Checked border color of root
*
* @designToken checkbox.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken checkbox.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Checked focus border color of root
*
* @designToken checkbox.checked.focus.border.color
*/
checkedFocusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken checkbox.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Shadow of root
*
* @designToken checkbox.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken checkbox.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken checkbox.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken checkbox.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken checkbox.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken checkbox.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken checkbox.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken checkbox.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken checkbox.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken checkbox.icon.color
*/
color?: string;
/**
* Checked color of icon
*
* @designToken checkbox.icon.checked.color
*/
checkedColor?: string;
/**
* Checked hover color of icon
*
* @designToken checkbox.icon.checked.hover.color
*/
checkedHoverColor?: string;
/**
* Disabled color of icon
*
* @designToken checkbox.icon.disabled.color
*/
disabledColor?: string;
}
/**
* Size of icon
*
* @designToken checkbox.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken checkbox.icon.color
*/
color?: string;
/**
* Checked color of icon
*
* @designToken checkbox.icon.checked.color
*/
checkedColor?: string;
/**
* Checked hover color of icon
*
* @designToken checkbox.icon.checked.hover.color
*/
checkedHoverColor?: string;
/**
* Disabled color of icon
*
* @designToken checkbox.icon.disabled.color
*/
disabledColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Chip Design Tokens
@ -12,137 +11,131 @@
import { ColorSchemeDesignToken } from '..';
export interface ChipDesignTokens extends ColorSchemeDesignToken<ChipDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken chip.border.radius
*/
borderRadius?: string;
/**
* Padding x of root
*
* @designToken chip.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken chip.padding.y
*/
paddingY?: string;
/**
* Gap of root
*
* @designToken chip.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken chip.transition.duration
*/
transitionDuration?: string;
/**
* Background of root
*
* @designToken chip.background
*/
background?: string;
/**
* Color of root
*
* @designToken chip.color
*/
color?: string;
}
/**
* Used to pass tokens of the image section
*/
image?: {
/**
* Width of image
*
* @designToken chip.image.width
*/
width?: string;
/**
* Height of image
*
* @designToken chip.image.height
*/
height?: string;
}
/**
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken chip.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken chip.icon.color
*/
color?: string;
}
/**
* Used to pass tokens of the remove icon section
*/
removeIcon?: {
/**
* Focus ring of remove icon
*/
focusRing?: {
/**
* Focus ring width of remove icon
*
* @designToken chip.remove.icon.focus.ring.width
*/
width?: string;
/**
* Focus ring style of remove icon
*
* @designToken chip.remove.icon.focus.ring.style
*/
style?: string;
/**
* Focus ring color of remove icon
*
* @designToken chip.remove.icon.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of remove icon
*
* @designToken chip.remove.icon.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of remove icon
*
* @designToken chip.remove.icon.focus.ring.shadow
*/
shadow?: string;
/**
* Border radius of root
*
* @designToken chip.border.radius
*/
borderRadius?: string;
/**
* Padding x of root
*
* @designToken chip.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken chip.padding.y
*/
paddingY?: string;
/**
* Gap of root
*
* @designToken chip.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken chip.transition.duration
*/
transitionDuration?: string;
/**
* Background of root
*
* @designToken chip.background
*/
background?: string;
/**
* Color of root
*
* @designToken chip.color
*/
color?: string;
};
/**
* Color of remove icon
*
* @designToken chip.remove.icon.color
*/
color?: string;
}
* Used to pass tokens of the image section
*/
image?: {
/**
* Width of image
*
* @designToken chip.image.width
*/
width?: string;
/**
* Height of image
*
* @designToken chip.image.height
*/
height?: string;
};
/**
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken chip.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken chip.icon.color
*/
color?: string;
};
/**
* Used to pass tokens of the remove icon section
*/
removeIcon?: {
/**
* Focus ring of remove icon
*/
focusRing?: {
/**
* Focus ring width of remove icon
*
* @designToken chip.remove.icon.focus.ring.width
*/
width?: string;
/**
* Focus ring style of remove icon
*
* @designToken chip.remove.icon.focus.ring.style
*/
style?: string;
/**
* Focus ring color of remove icon
*
* @designToken chip.remove.icon.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of remove icon
*
* @designToken chip.remove.icon.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of remove icon
*
* @designToken chip.remove.icon.focus.ring.shadow
*/
shadow?: string;
};
/**
* Color of remove icon
*
* @designToken chip.remove.icon.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ColorPicker Design Tokens
@ -12,119 +11,113 @@
import { ColorSchemeDesignToken } from '..';
export interface ColorPickerDesignTokens extends ColorSchemeDesignToken<ColorPickerDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken colorpicker.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the preview section
*/
preview?: {
/**
* Width of preview
*
* @designToken colorpicker.preview.width
*/
width?: string;
/**
* Height of preview
*
* @designToken colorpicker.preview.height
*/
height?: string;
/**
* Border radius of preview
*
* @designToken colorpicker.preview.border.radius
*/
borderRadius?: string;
/**
* Focus ring of preview
*/
focusRing?: {
/**
* Focus ring width of preview
*
* @designToken colorpicker.preview.focus.ring.width
*/
width?: string;
/**
* Focus ring style of preview
*
* @designToken colorpicker.preview.focus.ring.style
*/
style?: string;
/**
* Focus ring color of preview
*
* @designToken colorpicker.preview.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of preview
*
* @designToken colorpicker.preview.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of preview
*
* @designToken colorpicker.preview.focus.ring.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken colorpicker.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the panel section
*/
* Used to pass tokens of the preview section
*/
preview?: {
/**
* Width of preview
*
* @designToken colorpicker.preview.width
*/
width?: string;
/**
* Height of preview
*
* @designToken colorpicker.preview.height
*/
height?: string;
/**
* Border radius of preview
*
* @designToken colorpicker.preview.border.radius
*/
borderRadius?: string;
/**
* Focus ring of preview
*/
focusRing?: {
/**
* Focus ring width of preview
*
* @designToken colorpicker.preview.focus.ring.width
*/
width?: string;
/**
* Focus ring style of preview
*
* @designToken colorpicker.preview.focus.ring.style
*/
style?: string;
/**
* Focus ring color of preview
*
* @designToken colorpicker.preview.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of preview
*
* @designToken colorpicker.preview.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of preview
*
* @designToken colorpicker.preview.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the panel section
*/
panel?: {
/**
* Shadow of panel
*
* @designToken colorpicker.panel.shadow
*/
shadow?: string;
/**
* Border radius of panel
*
* @designToken colorpicker.panel.border.radius
*/
borderRadius?: string;
/**
* Background of panel
*
* @designToken colorpicker.panel.background
*/
background?: string;
/**
* Border color of panel
*
* @designToken colorpicker.panel.border.color
*/
borderColor?: string;
};
/**
* Shadow of panel
*
* @designToken colorpicker.panel.shadow
*/
shadow?: string;
/**
* Border radius of panel
*
* @designToken colorpicker.panel.border.radius
*/
borderRadius?: string;
/**
* Background of panel
*
* @designToken colorpicker.panel.background
*/
background?: string;
/**
* Border color of panel
*
* @designToken colorpicker.panel.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the handle section
*/
* Used to pass tokens of the handle section
*/
handle?: {
/**
* Color of handle
*
* @designToken colorpicker.handle.color
*/
color?: string;
}
/**
* Color of handle
*
* @designToken colorpicker.handle.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ConfirmDialog Design Tokens
@ -12,35 +11,32 @@
import { ColorSchemeDesignToken } from '..';
export interface ConfirmDialogDesignTokens extends ColorSchemeDesignToken<ConfirmDialogDesignTokens> {
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken confirmdialog.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken confirmdialog.icon.color
*/
color?: string;
};
/**
* Size of icon
*
* @designToken confirmdialog.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken confirmdialog.icon.color
*/
color?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Gap of content
*
* @designToken confirmdialog.content.gap
*/
gap?: string;
}
/**
* Gap of content
*
* @designToken confirmdialog.content.gap
*/
gap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ConfirmPopup Design Tokens
@ -12,107 +11,102 @@
import { ColorSchemeDesignToken } from '..';
export interface ConfirmPopupDesignTokens extends ColorSchemeDesignToken<ConfirmPopupDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken confirmpopup.background
*/
background?: string;
/**
* Border color of root
*
* @designToken confirmpopup.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken confirmpopup.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken confirmpopup.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken confirmpopup.shadow
*/
shadow?: string;
/**
* Gutter of root
*
* @designToken confirmpopup.gutter
*/
gutter?: string;
/**
* Arrow offset of root
*
* @designToken confirmpopup.arrow.offset
*/
arrowOffset?: string;
};
/**
* Background of root
*
* @designToken confirmpopup.background
*/
background?: string;
/**
* Border color of root
*
* @designToken confirmpopup.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken confirmpopup.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken confirmpopup.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken confirmpopup.shadow
*/
shadow?: string;
/**
* Gutter of root
*
* @designToken confirmpopup.gutter
*/
gutter?: string;
/**
* Arrow offset of root
*
* @designToken confirmpopup.arrow.offset
*/
arrowOffset?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken confirmpopup.content.padding
*/
padding?: string;
/**
* Gap of content
*
* @designToken confirmpopup.content.gap
*/
gap?: string;
};
/**
* Padding of content
*
* @designToken confirmpopup.content.padding
*/
padding?: string;
/**
* Gap of content
*
* @designToken confirmpopup.content.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken confirmpopup.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken confirmpopup.icon.color
*/
color?: string;
};
/**
* Size of icon
*
* @designToken confirmpopup.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken confirmpopup.icon.color
*/
color?: string;
}
/**
* Used to pass tokens of the footer section
*/
* Used to pass tokens of the footer section
*/
footer?: {
/**
* Gap of footer
*
* @designToken confirmpopup.footer.gap
*/
gap?: string;
/**
* Padding of footer
*
* @designToken confirmpopup.footer.padding
*/
padding?: string;
}
/**
* Gap of footer
*
* @designToken confirmpopup.footer.gap
*/
gap?: string;
/**
* Padding of footer
*
* @designToken confirmpopup.footer.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ContextMenu Design Tokens
@ -12,185 +11,178 @@
import { ColorSchemeDesignToken } from '..';
export interface ContextMenuDesignTokens extends ColorSchemeDesignToken<ContextMenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken contextmenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken contextmenu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken contextmenu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken contextmenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken contextmenu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken contextmenu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken contextmenu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken contextmenu.list.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken contextmenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken contextmenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken contextmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken contextmenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken contextmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken contextmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken contextmenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken contextmenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken contextmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken contextmenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken contextmenu.item.icon.active.color
*/
activeColor?: string;
/**
* Background of root
*
* @designToken contextmenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken contextmenu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken contextmenu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken contextmenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken contextmenu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken contextmenu.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the submenu icon section
*/
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken contextmenu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken contextmenu.list.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken contextmenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken contextmenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken contextmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken contextmenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken contextmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken contextmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken contextmenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken contextmenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken contextmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken contextmenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken contextmenu.item.icon.active.color
*/
activeColor?: string;
};
};
/**
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken contextmenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken contextmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken contextmenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken contextmenu.submenu.icon.active.color
*/
activeColor?: string;
};
/**
* Size of submenu icon
*
* @designToken contextmenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken contextmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken contextmenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken contextmenu.submenu.icon.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the separator section
*/
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken contextmenu.separator.border.color
*/
borderColor?: string;
}
/**
* Border color of separator
*
* @designToken contextmenu.separator.border.color
*/
borderColor?: string;
};
}

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,3 @@
/**
*
* DataView Design Tokens
@ -12,197 +11,190 @@
import { ColorSchemeDesignToken } from '..';
export interface DataViewDesignTokens extends ColorSchemeDesignToken<DataViewDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border color of root
*
* @designToken dataview.border.color
*/
borderColor?: string;
/**
* Border width of root
*
* @designToken dataview.border.width
*/
borderWidth?: string;
/**
* Border radius of root
*
* @designToken dataview.border.radius
*/
borderRadius?: string;
/**
* Padding of root
*
* @designToken dataview.padding
*/
padding?: string;
};
/**
* Border color of root
*
* @designToken dataview.border.color
*/
borderColor?: string;
/**
* Border width of root
*
* @designToken dataview.border.width
*/
borderWidth?: string;
/**
* Border radius of root
*
* @designToken dataview.border.radius
*/
borderRadius?: string;
/**
* Padding of root
*
* @designToken dataview.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the header section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Background of header
*
* @designToken dataview.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken dataview.header.color
*/
color?: string;
/**
* Border color of header
*
* @designToken dataview.header.border.color
*/
borderColor?: string;
/**
* Border width of header
*
* @designToken dataview.header.border.width
*/
borderWidth?: string;
/**
* Padding of header
*
* @designToken dataview.header.padding
*/
padding?: string;
/**
* Border radius of header
*
* @designToken dataview.header.border.radius
*/
borderRadius?: string;
};
/**
* Background of header
*
* @designToken dataview.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken dataview.header.color
*/
color?: string;
/**
* Border color of header
*
* @designToken dataview.header.border.color
*/
borderColor?: string;
/**
* Border width of header
*
* @designToken dataview.header.border.width
*/
borderWidth?: string;
/**
* Padding of header
*
* @designToken dataview.header.padding
*/
padding?: string;
/**
* Border radius of header
*
* @designToken dataview.header.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Background of content
*
* @designToken dataview.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken dataview.content.color
*/
color?: string;
/**
* Border color of content
*
* @designToken dataview.content.border.color
*/
borderColor?: string;
/**
* Border width of content
*
* @designToken dataview.content.border.width
*/
borderWidth?: string;
/**
* Padding of content
*
* @designToken dataview.content.padding
*/
padding?: string;
/**
* Border radius of content
*
* @designToken dataview.content.border.radius
*/
borderRadius?: string;
};
/**
* Background of content
*
* @designToken dataview.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken dataview.content.color
*/
color?: string;
/**
* Border color of content
*
* @designToken dataview.content.border.color
*/
borderColor?: string;
/**
* Border width of content
*
* @designToken dataview.content.border.width
*/
borderWidth?: string;
/**
* Padding of content
*
* @designToken dataview.content.padding
*/
padding?: string;
/**
* Border radius of content
*
* @designToken dataview.content.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the footer section
*/
* Used to pass tokens of the footer section
*/
footer?: {
/**
* Background of footer
*
* @designToken dataview.footer.background
*/
background?: string;
/**
* Color of footer
*
* @designToken dataview.footer.color
*/
color?: string;
/**
* Border color of footer
*
* @designToken dataview.footer.border.color
*/
borderColor?: string;
/**
* Border width of footer
*
* @designToken dataview.footer.border.width
*/
borderWidth?: string;
/**
* Padding of footer
*
* @designToken dataview.footer.padding
*/
padding?: string;
/**
* Border radius of footer
*
* @designToken dataview.footer.border.radius
*/
borderRadius?: string;
};
/**
* Background of footer
*
* @designToken dataview.footer.background
*/
background?: string;
/**
* Color of footer
*
* @designToken dataview.footer.color
*/
color?: string;
/**
* Border color of footer
*
* @designToken dataview.footer.border.color
*/
borderColor?: string;
/**
* Border width of footer
*
* @designToken dataview.footer.border.width
*/
borderWidth?: string;
/**
* Padding of footer
*
* @designToken dataview.footer.padding
*/
padding?: string;
/**
* Border radius of footer
*
* @designToken dataview.footer.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the paginator top section
*/
* Used to pass tokens of the paginator top section
*/
paginatorTop?: {
/**
* Border color of paginator top
*
* @designToken dataview.paginator.top.border.color
*/
borderColor?: string;
/**
* Border width of paginator top
*
* @designToken dataview.paginator.top.border.width
*/
borderWidth?: string;
};
/**
* Border color of paginator top
*
* @designToken dataview.paginator.top.border.color
*/
borderColor?: string;
/**
* Border width of paginator top
*
* @designToken dataview.paginator.top.border.width
*/
borderWidth?: string;
}
/**
* Used to pass tokens of the paginator bottom section
*/
* Used to pass tokens of the paginator bottom section
*/
paginatorBottom?: {
/**
* Border color of paginator bottom
*
* @designToken dataview.paginator.bottom.border.color
*/
borderColor?: string;
/**
* Border width of paginator bottom
*
* @designToken dataview.paginator.bottom.border.width
*/
borderWidth?: string;
}
/**
* Border color of paginator bottom
*
* @designToken dataview.paginator.bottom.border.color
*/
borderColor?: string;
/**
* Border width of paginator bottom
*
* @designToken dataview.paginator.bottom.border.width
*/
borderWidth?: string;
};
}

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,3 @@
/**
*
* Dialog Design Tokens
@ -12,107 +11,101 @@
import { ColorSchemeDesignToken } from '..';
export interface DialogDesignTokens extends ColorSchemeDesignToken<DialogDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken dialog.background
*/
background?: string;
/**
* Border color of root
*
* @designToken dialog.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken dialog.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken dialog.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken dialog.shadow
*/
shadow?: string;
};
/**
* Background of root
*
* @designToken dialog.background
*/
background?: string;
/**
* Border color of root
*
* @designToken dialog.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken dialog.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken dialog.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken dialog.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the header section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Padding of header
*
* @designToken dialog.header.padding
*/
padding?: string;
/**
* Gap of header
*
* @designToken dialog.header.gap
*/
gap?: string;
};
/**
* Padding of header
*
* @designToken dialog.header.padding
*/
padding?: string;
/**
* Gap of header
*
* @designToken dialog.header.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the title section
*/
* Used to pass tokens of the title section
*/
title?: {
/**
* Font size of title
*
* @designToken dialog.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken dialog.title.font.weight
*/
fontWeight?: string;
};
/**
* Font size of title
*
* @designToken dialog.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken dialog.title.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken dialog.content.padding
*/
padding?: string;
};
/**
* Padding of content
*
* @designToken dialog.content.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the footer section
*/
* Used to pass tokens of the footer section
*/
footer?: {
/**
* Padding of footer
*
* @designToken dialog.footer.padding
*/
padding?: string;
/**
* Gap of footer
*
* @designToken dialog.footer.gap
*/
gap?: string;
}
/**
* Padding of footer
*
* @designToken dialog.footer.padding
*/
padding?: string;
/**
* Gap of footer
*
* @designToken dialog.footer.gap
*/
gap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Divider Design Tokens
@ -12,95 +11,88 @@
import { ColorSchemeDesignToken } from '..';
export interface DividerDesignTokens extends ColorSchemeDesignToken<DividerDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border color of root
*
* @designToken divider.border.color
*/
borderColor?: string;
};
/**
* Border color of root
*
* @designToken divider.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Background of content
*
* @designToken divider.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken divider.content.color
*/
color?: string;
};
/**
* Background of content
*
* @designToken divider.content.background
*/
background?: string;
/**
* Color of content
*
* @designToken divider.content.color
*/
color?: string;
}
/**
* Used to pass tokens of the horizontal section
*/
* Used to pass tokens of the horizontal section
*/
horizontal?: {
/**
* Margin of horizontal
*
* @designToken divider.horizontal.margin
*/
margin?: string;
/**
* Padding of horizontal
*
* @designToken divider.horizontal.padding
*/
padding?: string;
/**
* Content of horizontal
*/
content?: {
/**
* Content padding of horizontal
*
* @designToken divider.horizontal.content.padding
*/
padding?: string;
/**
* Margin of horizontal
*
* @designToken divider.horizontal.margin
*/
margin?: string;
/**
* Padding of horizontal
*
* @designToken divider.horizontal.padding
*/
padding?: string;
/**
* Content of horizontal
*/
content?: {
/**
* Content padding of horizontal
*
* @designToken divider.horizontal.content.padding
*/
padding?: string;
};
};
}
/**
* Used to pass tokens of the vertical section
*/
* Used to pass tokens of the vertical section
*/
vertical?: {
/**
* Margin of vertical
*
* @designToken divider.vertical.margin
*/
margin?: string;
/**
* Padding of vertical
*
* @designToken divider.vertical.padding
*/
padding?: string;
/**
* Content of vertical
*/
content?: {
/**
* Content padding of vertical
*
* @designToken divider.vertical.content.padding
*/
padding?: string;
/**
* Margin of vertical
*
* @designToken divider.vertical.margin
*/
margin?: string;
/**
* Padding of vertical
*
* @designToken divider.vertical.padding
*/
padding?: string;
/**
* Content of vertical
*/
content?: {
/**
* Content padding of vertical
*
* @designToken divider.vertical.content.padding
*/
padding?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Dock Design Tokens
@ -12,95 +11,91 @@
import { ColorSchemeDesignToken } from '..';
export interface DockDesignTokens extends ColorSchemeDesignToken<DockDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken dock.background
*/
background?: string;
/**
* Border color of root
*
* @designToken dock.border.color
*/
borderColor?: string;
/**
* Padding of root
*
* @designToken dock.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken dock.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Border radius of item
*
* @designToken dock.item.border.radius
*/
borderRadius?: string;
/**
* Padding of item
*
* @designToken dock.item.padding
*/
padding?: string;
/**
* Size of item
*
* @designToken dock.item.size
*/
size?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken dock.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken dock.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken dock.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken dock.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken dock.item.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken dock.background
*/
background?: string;
/**
* Border color of root
*
* @designToken dock.border.color
*/
borderColor?: string;
/**
* Padding of root
*
* @designToken dock.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken dock.border.radius
*/
borderRadius?: string;
};
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Border radius of item
*
* @designToken dock.item.border.radius
*/
borderRadius?: string;
/**
* Padding of item
*
* @designToken dock.item.padding
*/
padding?: string;
/**
* Size of item
*
* @designToken dock.item.size
*/
size?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken dock.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken dock.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken dock.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken dock.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken dock.item.focus.ring.shadow
*/
shadow?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Drawer Design Tokens
@ -12,83 +11,78 @@
import { ColorSchemeDesignToken } from '..';
export interface DrawerDesignTokens extends ColorSchemeDesignToken<DrawerDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken drawer.background
*/
background?: string;
/**
* Border color of root
*
* @designToken drawer.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken drawer.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken drawer.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken drawer.shadow
*/
shadow?: string;
};
/**
* Background of root
*
* @designToken drawer.background
*/
background?: string;
/**
* Border color of root
*
* @designToken drawer.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken drawer.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken drawer.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken drawer.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the header section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Padding of header
*
* @designToken drawer.header.padding
*/
padding?: string;
};
/**
* Padding of header
*
* @designToken drawer.header.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the title section
*/
* Used to pass tokens of the title section
*/
title?: {
/**
* Font size of title
*
* @designToken drawer.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken drawer.title.font.weight
*/
fontWeight?: string;
};
/**
* Font size of title
*
* @designToken drawer.title.font.size
*/
fontSize?: string;
/**
* Font weight of title
*
* @designToken drawer.title.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken drawer.content.padding
*/
padding?: string;
}
/**
* Padding of content
*
* @designToken drawer.content.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Editor Design Tokens
@ -12,161 +11,155 @@
import { ColorSchemeDesignToken } from '..';
export interface EditorDesignTokens extends ColorSchemeDesignToken<EditorDesignTokens> {
/**
* Used to pass tokens of the toolbar section
*/
* Used to pass tokens of the toolbar section
*/
toolbar?: {
/**
* Background of toolbar
*
* @designToken editor.toolbar.background
*/
background?: string;
/**
* Border color of toolbar
*
* @designToken editor.toolbar.border.color
*/
borderColor?: string;
/**
* Border radius of toolbar
*
* @designToken editor.toolbar.border.radius
*/
borderRadius?: string;
};
/**
* Background of toolbar
*
* @designToken editor.toolbar.background
*/
background?: string;
/**
* Border color of toolbar
*
* @designToken editor.toolbar.border.color
*/
borderColor?: string;
/**
* Border radius of toolbar
*
* @designToken editor.toolbar.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the toolbar item section
*/
* Used to pass tokens of the toolbar item section
*/
toolbarItem?: {
/**
* Color of toolbar item
*
* @designToken editor.toolbar.item.color
*/
color?: string;
/**
* Hover color of toolbar item
*
* @designToken editor.toolbar.item.hover.color
*/
hoverColor?: string;
/**
* Active color of toolbar item
*
* @designToken editor.toolbar.item.active.color
*/
activeColor?: string;
};
/**
* Color of toolbar item
*
* @designToken editor.toolbar.item.color
*/
color?: string;
/**
* Hover color of toolbar item
*
* @designToken editor.toolbar.item.hover.color
*/
hoverColor?: string;
/**
* Active color of toolbar item
*
* @designToken editor.toolbar.item.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the overlay section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken editor.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken editor.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken editor.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken editor.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken editor.overlay.shadow
*/
shadow?: string;
/**
* Padding of overlay
*
* @designToken editor.overlay.padding
*/
padding?: string;
};
/**
* Background of overlay
*
* @designToken editor.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken editor.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken editor.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken editor.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken editor.overlay.shadow
*/
shadow?: string;
/**
* Padding of overlay
*
* @designToken editor.overlay.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the overlay option section
*/
* Used to pass tokens of the overlay option section
*/
overlayOption?: {
/**
* Focus background of overlay option
*
* @designToken editor.overlay.option.focus.background
*/
focusBackground?: string;
/**
* Color of overlay option
*
* @designToken editor.overlay.option.color
*/
color?: string;
/**
* Focus color of overlay option
*
* @designToken editor.overlay.option.focus.color
*/
focusColor?: string;
/**
* Padding of overlay option
*
* @designToken editor.overlay.option.padding
*/
padding?: string;
/**
* Border radius of overlay option
*
* @designToken editor.overlay.option.border.radius
*/
borderRadius?: string;
};
/**
* Focus background of overlay option
*
* @designToken editor.overlay.option.focus.background
*/
focusBackground?: string;
/**
* Color of overlay option
*
* @designToken editor.overlay.option.color
*/
color?: string;
/**
* Focus color of overlay option
*
* @designToken editor.overlay.option.focus.color
*/
focusColor?: string;
/**
* Padding of overlay option
*
* @designToken editor.overlay.option.padding
*/
padding?: string;
/**
* Border radius of overlay option
*
* @designToken editor.overlay.option.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Background of content
*
* @designToken editor.content.background
*/
background?: string;
/**
* Border color of content
*
* @designToken editor.content.border.color
*/
borderColor?: string;
/**
* Color of content
*
* @designToken editor.content.color
*/
color?: string;
/**
* Border radius of content
*
* @designToken editor.content.border.radius
*/
borderRadius?: string;
}
/**
* Background of content
*
* @designToken editor.content.background
*/
background?: string;
/**
* Border color of content
*
* @designToken editor.content.border.color
*/
borderColor?: string;
/**
* Color of content
*
* @designToken editor.content.color
*/
color?: string;
/**
* Border radius of content
*
* @designToken editor.content.border.radius
*/
borderRadius?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Fieldset Design Tokens
@ -12,179 +11,173 @@
import { ColorSchemeDesignToken } from '..';
export interface FieldsetDesignTokens extends ColorSchemeDesignToken<FieldsetDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken fieldset.background
*/
background?: string;
/**
* Border color of root
*
* @designToken fieldset.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken fieldset.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken fieldset.color
*/
color?: string;
/**
* Padding of root
*
* @designToken fieldset.padding
*/
padding?: string;
/**
* Transition duration of root
*
* @designToken fieldset.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the legend section
*/
legend?: {
/**
* Background of legend
*
* @designToken fieldset.legend.background
*/
background?: string;
/**
* Hover background of legend
*
* @designToken fieldset.legend.hover.background
*/
hoverBackground?: string;
/**
* Color of legend
*
* @designToken fieldset.legend.color
*/
color?: string;
/**
* Hover color of legend
*
* @designToken fieldset.legend.hover.color
*/
hoverColor?: string;
/**
* Border radius of legend
*
* @designToken fieldset.legend.border.radius
*/
borderRadius?: string;
/**
* Border width of legend
*
* @designToken fieldset.legend.border.width
*/
borderWidth?: string;
/**
* Border color of legend
*
* @designToken fieldset.legend.border.color
*/
borderColor?: string;
/**
* Padding of legend
*
* @designToken fieldset.legend.padding
*/
padding?: string;
/**
* Gap of legend
*
* @designToken fieldset.legend.gap
*/
gap?: string;
/**
* Font weight of legend
*
* @designToken fieldset.legend.font.weight
*/
fontWeight?: string;
/**
* Focus ring of legend
*/
focusRing?: {
/**
* Focus ring width of legend
*
* @designToken fieldset.legend.focus.ring.width
*/
width?: string;
/**
* Focus ring style of legend
*
* @designToken fieldset.legend.focus.ring.style
*/
style?: string;
/**
* Focus ring color of legend
*
* @designToken fieldset.legend.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of legend
*
* @designToken fieldset.legend.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of legend
*
* @designToken fieldset.legend.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken fieldset.background
*/
background?: string;
/**
* Border color of root
*
* @designToken fieldset.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken fieldset.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken fieldset.color
*/
color?: string;
/**
* Padding of root
*
* @designToken fieldset.padding
*/
padding?: string;
/**
* Transition duration of root
*
* @designToken fieldset.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the toggle icon section
*/
* Used to pass tokens of the legend section
*/
legend?: {
/**
* Background of legend
*
* @designToken fieldset.legend.background
*/
background?: string;
/**
* Hover background of legend
*
* @designToken fieldset.legend.hover.background
*/
hoverBackground?: string;
/**
* Color of legend
*
* @designToken fieldset.legend.color
*/
color?: string;
/**
* Hover color of legend
*
* @designToken fieldset.legend.hover.color
*/
hoverColor?: string;
/**
* Border radius of legend
*
* @designToken fieldset.legend.border.radius
*/
borderRadius?: string;
/**
* Border width of legend
*
* @designToken fieldset.legend.border.width
*/
borderWidth?: string;
/**
* Border color of legend
*
* @designToken fieldset.legend.border.color
*/
borderColor?: string;
/**
* Padding of legend
*
* @designToken fieldset.legend.padding
*/
padding?: string;
/**
* Gap of legend
*
* @designToken fieldset.legend.gap
*/
gap?: string;
/**
* Font weight of legend
*
* @designToken fieldset.legend.font.weight
*/
fontWeight?: string;
/**
* Focus ring of legend
*/
focusRing?: {
/**
* Focus ring width of legend
*
* @designToken fieldset.legend.focus.ring.width
*/
width?: string;
/**
* Focus ring style of legend
*
* @designToken fieldset.legend.focus.ring.style
*/
style?: string;
/**
* Focus ring color of legend
*
* @designToken fieldset.legend.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of legend
*
* @designToken fieldset.legend.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of legend
*
* @designToken fieldset.legend.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the toggle icon section
*/
toggleIcon?: {
/**
* Color of toggle icon
*
* @designToken fieldset.toggle.icon.color
*/
color?: string;
/**
* Hover color of toggle icon
*
* @designToken fieldset.toggle.icon.hover.color
*/
hoverColor?: string;
};
/**
* Color of toggle icon
*
* @designToken fieldset.toggle.icon.color
*/
color?: string;
/**
* Hover color of toggle icon
*
* @designToken fieldset.toggle.icon.hover.color
*/
hoverColor?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken fieldset.content.padding
*/
padding?: string;
}
/**
* Padding of content
*
* @designToken fieldset.content.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* FileUpload Design Tokens
@ -12,161 +11,153 @@
import { ColorSchemeDesignToken } from '..';
export interface FileUploadDesignTokens extends ColorSchemeDesignToken<FileUploadDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken fileupload.background
*/
background?: string;
/**
* Border color of root
*
* @designToken fileupload.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken fileupload.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken fileupload.border.radius
*/
borderRadius?: string;
/**
* Transition duration of root
*
* @designToken fileupload.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the header section
*/
header?: {
/**
* Background of header
*
* @designToken fileupload.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken fileupload.header.color
*/
color?: string;
/**
* Padding of header
*
* @designToken fileupload.header.padding
*/
padding?: string;
/**
* Border width of header
*
* @designToken fileupload.header.border.width
*/
borderWidth?: string;
/**
* Border radius of header
*
* @designToken fileupload.header.border.radius
*/
borderRadius?: string;
/**
* Gap of header
*
* @designToken fileupload.header.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the content section
*/
content?: {
/**
* Highlight border color of content
*
* @designToken fileupload.content.highlight.border.color
*/
highlightBorderColor?: string;
/**
* Padding of content
*
* @designToken fileupload.content.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the file section
*/
file?: {
/**
* Padding of file
*
* @designToken fileupload.file.padding
*/
padding?: string;
/**
* Gap of file
*
* @designToken fileupload.file.gap
*/
gap?: string;
/**
* Border color of file
*
* @designToken fileupload.file.border.color
*/
borderColor?: string;
/**
* Info of file
*/
info?: {
/**
* Info gap of file
*
* @designToken fileupload.file.info.gap
*/
gap?: string;
/**
* Background of root
*
* @designToken fileupload.background
*/
background?: string;
/**
* Border color of root
*
* @designToken fileupload.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken fileupload.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken fileupload.border.radius
*/
borderRadius?: string;
/**
* Transition duration of root
*
* @designToken fileupload.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the progressbar section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Background of header
*
* @designToken fileupload.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken fileupload.header.color
*/
color?: string;
/**
* Padding of header
*
* @designToken fileupload.header.padding
*/
padding?: string;
/**
* Border width of header
*
* @designToken fileupload.header.border.width
*/
borderWidth?: string;
/**
* Border radius of header
*
* @designToken fileupload.header.border.radius
*/
borderRadius?: string;
/**
* Gap of header
*
* @designToken fileupload.header.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the content section
*/
content?: {
/**
* Highlight border color of content
*
* @designToken fileupload.content.highlight.border.color
*/
highlightBorderColor?: string;
/**
* Padding of content
*
* @designToken fileupload.content.padding
*/
padding?: string;
};
/**
* Used to pass tokens of the file section
*/
file?: {
/**
* Padding of file
*
* @designToken fileupload.file.padding
*/
padding?: string;
/**
* Gap of file
*
* @designToken fileupload.file.gap
*/
gap?: string;
/**
* Border color of file
*
* @designToken fileupload.file.border.color
*/
borderColor?: string;
/**
* Info of file
*/
info?: {
/**
* Info gap of file
*
* @designToken fileupload.file.info.gap
*/
gap?: string;
};
};
/**
* Used to pass tokens of the progressbar section
*/
progressbar?: {
/**
* Height of progressbar
*
* @designToken fileupload.progressbar.height
*/
height?: string;
};
/**
* Height of progressbar
*
* @designToken fileupload.progressbar.height
*/
height?: string;
}
/**
* Used to pass tokens of the basic section
*/
* Used to pass tokens of the basic section
*/
basic?: {
/**
* Gap of basic
*
* @designToken fileupload.basic.gap
*/
gap?: string;
}
/**
* Gap of basic
*
* @designToken fileupload.basic.gap
*/
gap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* FloatLabel Design Tokens
@ -12,35 +11,33 @@
import { ColorSchemeDesignToken } from '..';
export interface FloatLabelDesignTokens extends ColorSchemeDesignToken<FloatLabelDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Color of root
*
* @designToken floatlabel.color
*/
color?: string;
/**
* Focus color of root
*
* @designToken floatlabel.focus.color
*/
focusColor?: string;
/**
* Invalid color of root
*
* @designToken floatlabel.invalid.color
*/
invalidColor?: string;
/**
* Transition duration of root
*
* @designToken floatlabel.transition.duration
*/
transitionDuration?: string;
}
/**
* Color of root
*
* @designToken floatlabel.color
*/
color?: string;
/**
* Focus color of root
*
* @designToken floatlabel.focus.color
*/
focusColor?: string;
/**
* Invalid color of root
*
* @designToken floatlabel.invalid.color
*/
invalidColor?: string;
/**
* Transition duration of root
*
* @designToken floatlabel.transition.duration
*/
transitionDuration?: string;
};
}

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,3 @@
/**
*
* IconField Design Tokens
@ -12,17 +11,15 @@
import { ColorSchemeDesignToken } from '..';
export interface IconFieldDesignTokens extends ColorSchemeDesignToken<IconFieldDesignTokens> {
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Color of icon
*
* @designToken iconfield.icon.color
*/
color?: string;
}
/**
* Color of icon
*
* @designToken iconfield.icon.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Image Design Tokens
@ -12,209 +11,200 @@
import { ColorSchemeDesignToken } from '..';
export interface ImageDesignTokens extends ColorSchemeDesignToken<ImageDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken image.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken image.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the preview section
*/
* Used to pass tokens of the preview section
*/
preview?: {
/**
* Icon of preview
*/
icon?: {
/**
* Icon size of preview
*
* @designToken image.preview.icon.size
*/
size?: string;
/**
* Icon of preview
*/
icon?: {
/**
* Icon size of preview
*
* @designToken image.preview.icon.size
*/
size?: string;
};
/**
* Mask of preview
*/
mask?: {
/**
* Mask background of preview
*
* @designToken image.preview.mask.background
*/
background?: string;
/**
* Mask color of preview
*
* @designToken image.preview.mask.color
*/
color?: string;
};
};
/**
* Mask of preview
*/
mask?: {
/**
* Mask background of preview
*
* @designToken image.preview.mask.background
*/
background?: string;
/**
* Mask color of preview
*
* @designToken image.preview.mask.color
*/
color?: string;
};
}
/**
* Used to pass tokens of the toolbar section
*/
* Used to pass tokens of the toolbar section
*/
toolbar?: {
/**
* Position of toolbar
*/
position?: {
/**
* Position left of toolbar
*
* @designToken image.toolbar.position.left
*/
left?: string;
/**
* Position right of toolbar
*
* @designToken image.toolbar.position.right
*/
right?: string;
/**
* Position top of toolbar
*
* @designToken image.toolbar.position.top
*/
top?: string;
/**
* Position bottom of toolbar
*
* @designToken image.toolbar.position.bottom
*/
bottom?: string;
/**
* Position of toolbar
*/
position?: {
/**
* Position left of toolbar
*
* @designToken image.toolbar.position.left
*/
left?: string;
/**
* Position right of toolbar
*
* @designToken image.toolbar.position.right
*/
right?: string;
/**
* Position top of toolbar
*
* @designToken image.toolbar.position.top
*/
top?: string;
/**
* Position bottom of toolbar
*
* @designToken image.toolbar.position.bottom
*/
bottom?: string;
};
/**
* Blur of toolbar
*
* @designToken image.toolbar.blur
*/
blur?: string;
/**
* Background of toolbar
*
* @designToken image.toolbar.background
*/
background?: string;
/**
* Border color of toolbar
*
* @designToken image.toolbar.border.color
*/
borderColor?: string;
/**
* Border width of toolbar
*
* @designToken image.toolbar.border.width
*/
borderWidth?: string;
/**
* Border radius of toolbar
*
* @designToken image.toolbar.border.radius
*/
borderRadius?: string;
/**
* Padding of toolbar
*
* @designToken image.toolbar.padding
*/
padding?: string;
/**
* Gap of toolbar
*
* @designToken image.toolbar.gap
*/
gap?: string;
};
/**
* Blur of toolbar
*
* @designToken image.toolbar.blur
*/
blur?: string;
/**
* Background of toolbar
*
* @designToken image.toolbar.background
*/
background?: string;
/**
* Border color of toolbar
*
* @designToken image.toolbar.border.color
*/
borderColor?: string;
/**
* Border width of toolbar
*
* @designToken image.toolbar.border.width
*/
borderWidth?: string;
/**
* Border radius of toolbar
*
* @designToken image.toolbar.border.radius
*/
borderRadius?: string;
/**
* Padding of toolbar
*
* @designToken image.toolbar.padding
*/
padding?: string;
/**
* Gap of toolbar
*
* @designToken image.toolbar.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the action section
*/
* Used to pass tokens of the action section
*/
action?: {
/**
* Hover background of action
*
* @designToken image.action.hover.background
*/
hoverBackground?: string;
/**
* Color of action
*
* @designToken image.action.color
*/
color?: string;
/**
* Hover color of action
*
* @designToken image.action.hover.color
*/
hoverColor?: string;
/**
* Size of action
*
* @designToken image.action.size
*/
size?: string;
/**
* Icon size of action
*
* @designToken image.action.icon.size
*/
iconSize?: string;
/**
* Border radius of action
*
* @designToken image.action.border.radius
*/
borderRadius?: string;
/**
* Focus ring of action
*/
focusRing?: {
/**
* Focus ring width of action
*
* @designToken image.action.focus.ring.width
*/
width?: string;
/**
* Focus ring style of action
*
* @designToken image.action.focus.ring.style
*/
style?: string;
/**
* Focus ring color of action
*
* @designToken image.action.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of action
*
* @designToken image.action.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of action
*
* @designToken image.action.focus.ring.shadow
*/
shadow?: string;
/**
* Hover background of action
*
* @designToken image.action.hover.background
*/
hoverBackground?: string;
/**
* Color of action
*
* @designToken image.action.color
*/
color?: string;
/**
* Hover color of action
*
* @designToken image.action.hover.color
*/
hoverColor?: string;
/**
* Size of action
*
* @designToken image.action.size
*/
size?: string;
/**
* Icon size of action
*
* @designToken image.action.icon.size
*/
iconSize?: string;
/**
* Border radius of action
*
* @designToken image.action.border.radius
*/
borderRadius?: string;
/**
* Focus ring of action
*/
focusRing?: {
/**
* Focus ring width of action
*
* @designToken image.action.focus.ring.width
*/
width?: string;
/**
* Focus ring style of action
*
* @designToken image.action.focus.ring.style
*/
style?: string;
/**
* Focus ring color of action
*
* @designToken image.action.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of action
*
* @designToken image.action.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of action
*
* @designToken image.action.focus.ring.shadow
*/
shadow?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* InlineMessage Design Tokens
@ -12,233 +11,223 @@
import { ColorSchemeDesignToken } from '..';
export interface InlineMessageDesignTokens extends ColorSchemeDesignToken<InlineMessageDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Padding of root
*
* @designToken inlinemessage.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken inlinemessage.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken inlinemessage.gap
*/
gap?: string;
};
/**
* Padding of root
*
* @designToken inlinemessage.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken inlinemessage.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken inlinemessage.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the text section
*/
* Used to pass tokens of the text section
*/
text?: {
/**
* Font weight of text
*
* @designToken inlinemessage.text.font.weight
*/
fontWeight?: string;
};
/**
* Font weight of text
*
* @designToken inlinemessage.text.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken inlinemessage.icon.size
*/
size?: string;
};
/**
* Size of icon
*
* @designToken inlinemessage.icon.size
*/
size?: string;
}
/**
* Used to pass tokens of the info section
*/
* Used to pass tokens of the info section
*/
info?: {
/**
* Background of info
*
* @designToken inlinemessage.info.background
*/
background?: string;
/**
* Border color of info
*
* @designToken inlinemessage.info.border.color
*/
borderColor?: string;
/**
* Color of info
*
* @designToken inlinemessage.info.color
*/
color?: string;
/**
* Shadow of info
*
* @designToken inlinemessage.info.shadow
*/
shadow?: string;
};
/**
* Background of info
*
* @designToken inlinemessage.info.background
*/
background?: string;
/**
* Border color of info
*
* @designToken inlinemessage.info.border.color
*/
borderColor?: string;
/**
* Color of info
*
* @designToken inlinemessage.info.color
*/
color?: string;
/**
* Shadow of info
*
* @designToken inlinemessage.info.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the success section
*/
* Used to pass tokens of the success section
*/
success?: {
/**
* Background of success
*
* @designToken inlinemessage.success.background
*/
background?: string;
/**
* Border color of success
*
* @designToken inlinemessage.success.border.color
*/
borderColor?: string;
/**
* Color of success
*
* @designToken inlinemessage.success.color
*/
color?: string;
/**
* Shadow of success
*
* @designToken inlinemessage.success.shadow
*/
shadow?: string;
};
/**
* Background of success
*
* @designToken inlinemessage.success.background
*/
background?: string;
/**
* Border color of success
*
* @designToken inlinemessage.success.border.color
*/
borderColor?: string;
/**
* Color of success
*
* @designToken inlinemessage.success.color
*/
color?: string;
/**
* Shadow of success
*
* @designToken inlinemessage.success.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the warn section
*/
* Used to pass tokens of the warn section
*/
warn?: {
/**
* Background of warn
*
* @designToken inlinemessage.warn.background
*/
background?: string;
/**
* Border color of warn
*
* @designToken inlinemessage.warn.border.color
*/
borderColor?: string;
/**
* Color of warn
*
* @designToken inlinemessage.warn.color
*/
color?: string;
/**
* Shadow of warn
*
* @designToken inlinemessage.warn.shadow
*/
shadow?: string;
};
/**
* Background of warn
*
* @designToken inlinemessage.warn.background
*/
background?: string;
/**
* Border color of warn
*
* @designToken inlinemessage.warn.border.color
*/
borderColor?: string;
/**
* Color of warn
*
* @designToken inlinemessage.warn.color
*/
color?: string;
/**
* Shadow of warn
*
* @designToken inlinemessage.warn.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the error section
*/
* Used to pass tokens of the error section
*/
error?: {
/**
* Background of error
*
* @designToken inlinemessage.error.background
*/
background?: string;
/**
* Border color of error
*
* @designToken inlinemessage.error.border.color
*/
borderColor?: string;
/**
* Color of error
*
* @designToken inlinemessage.error.color
*/
color?: string;
/**
* Shadow of error
*
* @designToken inlinemessage.error.shadow
*/
shadow?: string;
};
/**
* Background of error
*
* @designToken inlinemessage.error.background
*/
background?: string;
/**
* Border color of error
*
* @designToken inlinemessage.error.border.color
*/
borderColor?: string;
/**
* Color of error
*
* @designToken inlinemessage.error.color
*/
color?: string;
/**
* Shadow of error
*
* @designToken inlinemessage.error.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the secondary section
*/
* Used to pass tokens of the secondary section
*/
secondary?: {
/**
* Background of secondary
*
* @designToken inlinemessage.secondary.background
*/
background?: string;
/**
* Border color of secondary
*
* @designToken inlinemessage.secondary.border.color
*/
borderColor?: string;
/**
* Color of secondary
*
* @designToken inlinemessage.secondary.color
*/
color?: string;
/**
* Shadow of secondary
*
* @designToken inlinemessage.secondary.shadow
*/
shadow?: string;
};
/**
* Background of secondary
*
* @designToken inlinemessage.secondary.background
*/
background?: string;
/**
* Border color of secondary
*
* @designToken inlinemessage.secondary.border.color
*/
borderColor?: string;
/**
* Color of secondary
*
* @designToken inlinemessage.secondary.color
*/
color?: string;
/**
* Shadow of secondary
*
* @designToken inlinemessage.secondary.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the contrast section
*/
* Used to pass tokens of the contrast section
*/
contrast?: {
/**
* Background of contrast
*
* @designToken inlinemessage.contrast.background
*/
background?: string;
/**
* Border color of contrast
*
* @designToken inlinemessage.contrast.border.color
*/
borderColor?: string;
/**
* Color of contrast
*
* @designToken inlinemessage.contrast.color
*/
color?: string;
/**
* Shadow of contrast
*
* @designToken inlinemessage.contrast.shadow
*/
shadow?: string;
}
/**
* Background of contrast
*
* @designToken inlinemessage.contrast.background
*/
background?: string;
/**
* Border color of contrast
*
* @designToken inlinemessage.contrast.border.color
*/
borderColor?: string;
/**
* Color of contrast
*
* @designToken inlinemessage.contrast.color
*/
color?: string;
/**
* Shadow of contrast
*
* @designToken inlinemessage.contrast.shadow
*/
shadow?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Inplace Design Tokens
@ -12,83 +11,79 @@
import { ColorSchemeDesignToken } from '..';
export interface InplaceDesignTokens extends ColorSchemeDesignToken<InplaceDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Padding of root
*
* @designToken inplace.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken inplace.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inplace.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inplace.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inplace.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inplace.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inplace.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken inplace.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken inplace.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inplace.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inplace.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inplace.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inplace.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inplace.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken inplace.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken inplace.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the display section
*/
* Used to pass tokens of the display section
*/
display?: {
/**
* Hover background of display
*
* @designToken inplace.display.hover.background
*/
hoverBackground?: string;
/**
* Hover color of display
*
* @designToken inplace.display.hover.color
*/
hoverColor?: string;
}
/**
* Hover background of display
*
* @designToken inplace.display.hover.background
*/
hoverBackground?: string;
/**
* Hover color of display
*
* @designToken inplace.display.hover.color
*/
hoverColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* InputChips Design Tokens
@ -12,167 +11,163 @@
import { ColorSchemeDesignToken } from '..';
export interface InputChipsDesignTokens extends ColorSchemeDesignToken<InputChipsDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken inputchips.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken inputchips.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken inputchips.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken inputchips.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken inputchips.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken inputchips.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken inputchips.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken inputchips.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken inputchips.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken inputchips.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken inputchips.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken inputchips.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken inputchips.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken inputchips.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken inputchips.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inputchips.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inputchips.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inputchips.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inputchips.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inputchips.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken inputchips.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken inputchips.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken inputchips.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken inputchips.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken inputchips.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken inputchips.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken inputchips.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken inputchips.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken inputchips.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken inputchips.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken inputchips.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken inputchips.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken inputchips.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken inputchips.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken inputchips.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inputchips.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inputchips.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inputchips.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inputchips.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inputchips.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken inputchips.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken inputchips.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the chip section
*/
* Used to pass tokens of the chip section
*/
chip?: {
/**
* Border radius of chip
*
* @designToken inputchips.chip.border.radius
*/
borderRadius?: string;
/**
* Focus background of chip
*
* @designToken inputchips.chip.focus.background
*/
focusBackground?: string;
/**
* Color of chip
*
* @designToken inputchips.chip.color
*/
color?: string;
}
/**
* Border radius of chip
*
* @designToken inputchips.chip.border.radius
*/
borderRadius?: string;
/**
* Focus background of chip
*
* @designToken inputchips.chip.focus.background
*/
focusBackground?: string;
/**
* Color of chip
*
* @designToken inputchips.chip.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* InputGroup Design Tokens
@ -12,35 +11,33 @@
import { ColorSchemeDesignToken } from '..';
export interface InputGroupDesignTokens extends ColorSchemeDesignToken<InputGroupDesignTokens> {
/**
* Used to pass tokens of the addon section
*/
* Used to pass tokens of the addon section
*/
addon?: {
/**
* Background of addon
*
* @designToken inputgroup.addon.background
*/
background?: string;
/**
* Border color of addon
*
* @designToken inputgroup.addon.border.color
*/
borderColor?: string;
/**
* Color of addon
*
* @designToken inputgroup.addon.color
*/
color?: string;
/**
* Border radius of addon
*
* @designToken inputgroup.addon.border.radius
*/
borderRadius?: string;
}
/**
* Background of addon
*
* @designToken inputgroup.addon.background
*/
background?: string;
/**
* Border color of addon
*
* @designToken inputgroup.addon.border.color
*/
borderColor?: string;
/**
* Color of addon
*
* @designToken inputgroup.addon.color
*/
color?: string;
/**
* Border radius of addon
*
* @designToken inputgroup.addon.border.radius
*/
borderRadius?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* InputNumber Design Tokens
@ -12,95 +11,92 @@
import { ColorSchemeDesignToken } from '..';
export interface InputNumberDesignTokens extends ColorSchemeDesignToken<InputNumberDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken inputnumber.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken inputnumber.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the button section
*/
* Used to pass tokens of the button section
*/
button?: {
/**
* Width of button
*
* @designToken inputnumber.button.width
*/
width?: string;
/**
* Border radius of button
*
* @designToken inputnumber.button.border.radius
*/
borderRadius?: string;
/**
* Vertical padding of button
*
* @designToken inputnumber.button.vertical.padding
*/
verticalPadding?: string;
/**
* Background of button
*
* @designToken inputnumber.button.background
*/
background?: string;
/**
* Hover background of button
*
* @designToken inputnumber.button.hover.background
*/
hoverBackground?: string;
/**
* Active background of button
*
* @designToken inputnumber.button.active.background
*/
activeBackground?: string;
/**
* Border color of button
*
* @designToken inputnumber.button.border.color
*/
borderColor?: string;
/**
* Hover border color of button
*
* @designToken inputnumber.button.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of button
*
* @designToken inputnumber.button.active.border.color
*/
activeBorderColor?: string;
/**
* Color of button
*
* @designToken inputnumber.button.color
*/
color?: string;
/**
* Hover color of button
*
* @designToken inputnumber.button.hover.color
*/
hoverColor?: string;
/**
* Active color of button
*
* @designToken inputnumber.button.active.color
*/
activeColor?: string;
}
/**
* Width of button
*
* @designToken inputnumber.button.width
*/
width?: string;
/**
* Border radius of button
*
* @designToken inputnumber.button.border.radius
*/
borderRadius?: string;
/**
* Vertical padding of button
*
* @designToken inputnumber.button.vertical.padding
*/
verticalPadding?: string;
/**
* Background of button
*
* @designToken inputnumber.button.background
*/
background?: string;
/**
* Hover background of button
*
* @designToken inputnumber.button.hover.background
*/
hoverBackground?: string;
/**
* Active background of button
*
* @designToken inputnumber.button.active.background
*/
activeBackground?: string;
/**
* Border color of button
*
* @designToken inputnumber.button.border.color
*/
borderColor?: string;
/**
* Hover border color of button
*
* @designToken inputnumber.button.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of button
*
* @designToken inputnumber.button.active.border.color
*/
activeBorderColor?: string;
/**
* Color of button
*
* @designToken inputnumber.button.color
*/
color?: string;
/**
* Hover color of button
*
* @designToken inputnumber.button.hover.color
*/
hoverColor?: string;
/**
* Active color of button
*
* @designToken inputnumber.button.active.color
*/
activeColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* InputText Design Tokens
@ -12,191 +11,186 @@
import { ColorSchemeDesignToken } from '..';
export interface InputTextDesignTokens extends ColorSchemeDesignToken<InputTextDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken inputtext.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken inputtext.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken inputtext.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken inputtext.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken inputtext.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken inputtext.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken inputtext.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken inputtext.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken inputtext.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken inputtext.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken inputtext.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken inputtext.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken inputtext.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken inputtext.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken inputtext.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inputtext.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inputtext.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inputtext.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inputtext.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inputtext.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken inputtext.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken inputtext.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken inputtext.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken inputtext.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken inputtext.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken inputtext.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken inputtext.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken inputtext.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken inputtext.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken inputtext.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken inputtext.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken inputtext.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken inputtext.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken inputtext.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken inputtext.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken inputtext.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken inputtext.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken inputtext.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken inputtext.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken inputtext.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken inputtext.transition.duration
*/
transitionDuration?: string;
/**
* Sm of root
*/
sm?: {
/**
* Sm font size of root
*
* @designToken inputtext.sm.font.size
*/
fontSize?: string;
/**
* Sm padding x of root
*
* @designToken inputtext.sm.padding.x
*/
paddingX?: string;
/**
* Sm padding y of root
*
* @designToken inputtext.sm.padding.y
*/
paddingY?: string;
};
/**
* Lg of root
*/
lg?: {
/**
* Lg font size of root
*
* @designToken inputtext.lg.font.size
*/
fontSize?: string;
/**
* Lg padding x of root
*
* @designToken inputtext.lg.padding.x
*/
paddingX?: string;
/**
* Lg padding y of root
*
* @designToken inputtext.lg.padding.y
*/
paddingY?: string;
};
};
/**
* Transition duration of root
*
* @designToken inputtext.transition.duration
*/
transitionDuration?: string;
/**
* Sm of root
*/
sm?: {
/**
* Sm font size of root
*
* @designToken inputtext.sm.font.size
*/
fontSize?: string;
/**
* Sm padding x of root
*
* @designToken inputtext.sm.padding.x
*/
paddingX?: string;
/**
* Sm padding y of root
*
* @designToken inputtext.sm.padding.y
*/
paddingY?: string;
};
/**
* Lg of root
*/
lg?: {
/**
* Lg font size of root
*
* @designToken inputtext.lg.font.size
*/
fontSize?: string;
/**
* Lg padding x of root
*
* @designToken inputtext.lg.padding.x
*/
paddingX?: string;
/**
* Lg padding y of root
*
* @designToken inputtext.lg.padding.y
*/
paddingY?: string;
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Knob Design Tokens
@ -12,89 +11,83 @@
import { ColorSchemeDesignToken } from '..';
export interface KnobDesignTokens extends ColorSchemeDesignToken<KnobDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken knob.transition.duration
*/
transitionDuration?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken knob.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken knob.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken knob.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken knob.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken knob.focus.ring.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken knob.transition.duration
*/
transitionDuration?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken knob.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken knob.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken knob.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken knob.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken knob.focus.ring.shadow
*/
shadow?: string;
};
};
}
/**
* Used to pass tokens of the value section
*/
* Used to pass tokens of the value section
*/
value?: {
/**
* Background of value
*
* @designToken knob.value.background
*/
background?: string;
};
/**
* Background of value
*
* @designToken knob.value.background
*/
background?: string;
}
/**
* Used to pass tokens of the range section
*/
* Used to pass tokens of the range section
*/
range?: {
/**
* Background of range
*
* @designToken knob.range.background
*/
background?: string;
};
/**
* Background of range
*
* @designToken knob.range.background
*/
background?: string;
}
/**
* Used to pass tokens of the text section
*/
* Used to pass tokens of the text section
*/
text?: {
/**
* Color of text
*
* @designToken knob.text.color
*/
color?: string;
}
/**
* Color of text
*
* @designToken knob.text.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Listbox Design Tokens
@ -12,275 +11,266 @@
import { ColorSchemeDesignToken } from '..';
export interface ListboxDesignTokens extends ColorSchemeDesignToken<ListboxDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken listbox.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken listbox.disabled.background
*/
disabledBackground?: string;
/**
* Border color of root
*
* @designToken listbox.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken listbox.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken listbox.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken listbox.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken listbox.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken listbox.disabled.color
*/
disabledColor?: string;
/**
* Shadow of root
*
* @designToken listbox.shadow
*/
shadow?: string;
/**
* Border radius of root
*
* @designToken listbox.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken listbox.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken listbox.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken listbox.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken listbox.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken listbox.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken listbox.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken listbox.disabled.background
*/
disabledBackground?: string;
/**
* Border color of root
*
* @designToken listbox.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken listbox.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken listbox.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken listbox.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken listbox.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken listbox.disabled.color
*/
disabledColor?: string;
/**
* Shadow of root
*
* @designToken listbox.shadow
*/
shadow?: string;
/**
* Border radius of root
*
* @designToken listbox.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken listbox.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken listbox.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken listbox.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken listbox.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken listbox.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken listbox.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken listbox.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the list section
*/
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken listbox.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken listbox.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken listbox.list.header.padding
*/
padding?: string;
/**
* Padding of list
*
* @designToken listbox.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken listbox.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken listbox.list.header.padding
*/
padding?: string;
};
};
}
/**
* Used to pass tokens of the option section
*/
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken listbox.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken listbox.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken listbox.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken listbox.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken listbox.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken listbox.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken listbox.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken listbox.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken listbox.option.border.radius
*/
borderRadius?: string;
/**
* Striped background of option
*
* @designToken listbox.option.striped.background
*/
stripedBackground?: string;
};
/**
* Focus background of option
*
* @designToken listbox.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken listbox.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken listbox.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken listbox.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken listbox.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken listbox.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken listbox.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken listbox.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken listbox.option.border.radius
*/
borderRadius?: string;
/**
* Striped background of option
*
* @designToken listbox.option.striped.background
*/
stripedBackground?: string;
}
/**
* Used to pass tokens of the option group section
*/
* Used to pass tokens of the option group section
*/
optionGroup?: {
/**
* Background of option group
*
* @designToken listbox.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken listbox.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken listbox.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken listbox.option.group.padding
*/
padding?: string;
};
/**
* Background of option group
*
* @designToken listbox.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken listbox.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken listbox.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken listbox.option.group.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the checkmark section
*/
* Used to pass tokens of the checkmark section
*/
checkmark?: {
/**
* Color of checkmark
*
* @designToken listbox.checkmark.color
*/
color?: string;
/**
* Gutter start of checkmark
*
* @designToken listbox.checkmark.gutter.start
*/
gutterStart?: string;
/**
* Gutter end of checkmark
*
* @designToken listbox.checkmark.gutter.end
*/
gutterEnd?: string;
};
/**
* Color of checkmark
*
* @designToken listbox.checkmark.color
*/
color?: string;
/**
* Gutter start of checkmark
*
* @designToken listbox.checkmark.gutter.start
*/
gutterStart?: string;
/**
* Gutter end of checkmark
*
* @designToken listbox.checkmark.gutter.end
*/
gutterEnd?: string;
}
/**
* Used to pass tokens of the empty message section
*/
* Used to pass tokens of the empty message section
*/
emptyMessage?: {
/**
* Padding of empty message
*
* @designToken listbox.empty.message.padding
*/
padding?: string;
}
/**
* Padding of empty message
*
* @designToken listbox.empty.message.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* MegaMenu Design Tokens
@ -12,383 +11,369 @@
import { ColorSchemeDesignToken } from '..';
export interface MegaMenuDesignTokens extends ColorSchemeDesignToken<MegaMenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken megamenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken megamenu.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken megamenu.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken megamenu.color
*/
color?: string;
/**
* Gap of root
*
* @designToken megamenu.gap
*/
gap?: string;
/**
* Vertical orientation of root
*/
verticalOrientation?: {
/**
* Vertical orientation padding of root
*
* @designToken megamenu.vertical.orientation.padding
*/
padding?: string;
/**
* Vertical orientation gap of root
*
* @designToken megamenu.vertical.orientation.gap
*/
gap?: string;
/**
* Background of root
*
* @designToken megamenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken megamenu.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken megamenu.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken megamenu.color
*/
color?: string;
/**
* Gap of root
*
* @designToken megamenu.gap
*/
gap?: string;
/**
* Vertical orientation of root
*/
verticalOrientation?: {
/**
* Vertical orientation padding of root
*
* @designToken megamenu.vertical.orientation.padding
*/
padding?: string;
/**
* Vertical orientation gap of root
*
* @designToken megamenu.vertical.orientation.gap
*/
gap?: string;
};
/**
* Horizontal orientation of root
*/
horizontalOrientation?: {
/**
* Horizontal orientation padding of root
*
* @designToken megamenu.horizontal.orientation.padding
*/
padding?: string;
};
/**
* Transition duration of root
*
* @designToken megamenu.transition.duration
*/
transitionDuration?: string;
};
/**
* Horizontal orientation of root
*/
horizontalOrientation?: {
/**
* Horizontal orientation padding of root
*
* @designToken megamenu.horizontal.orientation.padding
*/
padding?: string;
};
/**
* Transition duration of root
*
* @designToken megamenu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the base item section
*/
* Used to pass tokens of the base item section
*/
baseItem?: {
/**
* Border radius of base item
*
* @designToken megamenu.base.item.border.radius
*/
borderRadius?: string;
/**
* Padding of base item
*
* @designToken megamenu.base.item.padding
*/
padding?: string;
};
/**
* Border radius of base item
*
* @designToken megamenu.base.item.border.radius
*/
borderRadius?: string;
/**
* Padding of base item
*
* @designToken megamenu.base.item.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the item section
*/
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken megamenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken megamenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken megamenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken megamenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken megamenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken megamenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken megamenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken megamenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken megamenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken megamenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken megamenu.item.icon.active.color
*/
activeColor?: string;
/**
* Focus background of item
*
* @designToken megamenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken megamenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken megamenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken megamenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken megamenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken megamenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken megamenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken megamenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken megamenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken megamenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken megamenu.item.icon.active.color
*/
activeColor?: string;
};
};
}
/**
* Used to pass tokens of the overlay section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Padding of overlay
*
* @designToken megamenu.overlay.padding
*/
padding?: string;
/**
* Background of overlay
*
* @designToken megamenu.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken megamenu.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken megamenu.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken megamenu.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken megamenu.overlay.shadow
*/
shadow?: string;
/**
* Gap of overlay
*
* @designToken megamenu.overlay.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the submenu section
*/
submenu?: {
/**
* Padding of submenu
*
* @designToken megamenu.submenu.padding
*/
padding?: string;
/**
* Gap of submenu
*
* @designToken megamenu.submenu.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the submenu label section
*/
submenuLabel?: {
/**
* Padding of submenu label
*
* @designToken megamenu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken megamenu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken megamenu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken megamenu.submenu.label.color
*/
color?: string;
}
/**
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken megamenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken megamenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken megamenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken megamenu.submenu.icon.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken megamenu.separator.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the mobile button section
*/
mobileButton?: {
/**
* Border radius of mobile button
*
* @designToken megamenu.mobile.button.border.radius
*/
borderRadius?: string;
/**
* Size of mobile button
*
* @designToken megamenu.mobile.button.size
*/
size?: string;
/**
* Color of mobile button
*
* @designToken megamenu.mobile.button.color
*/
color?: string;
/**
* Hover color of mobile button
*
* @designToken megamenu.mobile.button.hover.color
*/
hoverColor?: string;
/**
* Hover background of mobile button
*
* @designToken megamenu.mobile.button.hover.background
*/
hoverBackground?: string;
/**
* Focus ring of mobile button
*/
focusRing?: {
/**
* Focus ring width of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of overlay
*
* @designToken megamenu.overlay.padding
*/
padding?: string;
/**
* Background of overlay
*
* @designToken megamenu.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken megamenu.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken megamenu.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken megamenu.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken megamenu.overlay.shadow
*/
shadow?: string;
/**
* Gap of overlay
*
* @designToken megamenu.overlay.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the submenu section
*/
submenu?: {
/**
* Padding of submenu
*
* @designToken megamenu.submenu.padding
*/
padding?: string;
/**
* Gap of submenu
*
* @designToken megamenu.submenu.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the submenu label section
*/
submenuLabel?: {
/**
* Padding of submenu label
*
* @designToken megamenu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken megamenu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken megamenu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken megamenu.submenu.label.color
*/
color?: string;
};
/**
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken megamenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken megamenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken megamenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken megamenu.submenu.icon.active.color
*/
activeColor?: string;
};
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken megamenu.separator.border.color
*/
borderColor?: string;
};
/**
* Used to pass tokens of the mobile button section
*/
mobileButton?: {
/**
* Border radius of mobile button
*
* @designToken megamenu.mobile.button.border.radius
*/
borderRadius?: string;
/**
* Size of mobile button
*
* @designToken megamenu.mobile.button.size
*/
size?: string;
/**
* Color of mobile button
*
* @designToken megamenu.mobile.button.color
*/
color?: string;
/**
* Hover color of mobile button
*
* @designToken megamenu.mobile.button.hover.color
*/
hoverColor?: string;
/**
* Hover background of mobile button
*
* @designToken megamenu.mobile.button.hover.background
*/
hoverBackground?: string;
/**
* Focus ring of mobile button
*/
focusRing?: {
/**
* Focus ring width of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of mobile button
*
* @designToken megamenu.mobile.button.focus.ring.shadow
*/
shadow?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Menu Design Tokens
@ -12,167 +11,160 @@
import { ColorSchemeDesignToken } from '..';
export interface MenuDesignTokens extends ColorSchemeDesignToken<MenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken menu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken menu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken menu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken menu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken menu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken menu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken menu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken menu.list.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken menu.item.focus.background
*/
focusBackground?: string;
/**
* Color of item
*
* @designToken menu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken menu.item.focus.color
*/
focusColor?: string;
/**
* Padding of item
*
* @designToken menu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken menu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken menu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken menu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken menu.item.icon.focus.color
*/
focusColor?: string;
/**
* Background of root
*
* @designToken menu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken menu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken menu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken menu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken menu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken menu.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the submenu label section
*/
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken menu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken menu.list.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken menu.item.focus.background
*/
focusBackground?: string;
/**
* Color of item
*
* @designToken menu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken menu.item.focus.color
*/
focusColor?: string;
/**
* Padding of item
*
* @designToken menu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken menu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken menu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken menu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken menu.item.icon.focus.color
*/
focusColor?: string;
};
};
/**
* Used to pass tokens of the submenu label section
*/
submenuLabel?: {
/**
* Padding of submenu label
*
* @designToken menu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken menu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken menu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken menu.submenu.label.color
*/
color?: string;
};
/**
* Padding of submenu label
*
* @designToken menu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken menu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken menu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken menu.submenu.label.color
*/
color?: string;
}
/**
* Used to pass tokens of the separator section
*/
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken menu.separator.border.color
*/
borderColor?: string;
}
/**
* Border color of separator
*
* @designToken menu.separator.border.color
*/
borderColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Menubar Design Tokens
@ -12,311 +11,301 @@
import { ColorSchemeDesignToken } from '..';
export interface MenubarDesignTokens extends ColorSchemeDesignToken<MenubarDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken menubar.background
*/
background?: string;
/**
* Border color of root
*
* @designToken menubar.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken menubar.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken menubar.color
*/
color?: string;
/**
* Gap of root
*
* @designToken menubar.gap
*/
gap?: string;
/**
* Padding of root
*
* @designToken menubar.padding
*/
padding?: string;
/**
* Transition duration of root
*
* @designToken menubar.transition.duration
*/
transitionDuration?: string;
};
/**
* Background of root
*
* @designToken menubar.background
*/
background?: string;
/**
* Border color of root
*
* @designToken menubar.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken menubar.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken menubar.color
*/
color?: string;
/**
* Gap of root
*
* @designToken menubar.gap
*/
gap?: string;
/**
* Padding of root
*
* @designToken menubar.padding
*/
padding?: string;
/**
* Transition duration of root
*
* @designToken menubar.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the base item section
*/
* Used to pass tokens of the base item section
*/
baseItem?: {
/**
* Border radius of base item
*
* @designToken menubar.base.item.border.radius
*/
borderRadius?: string;
/**
* Padding of base item
*
* @designToken menubar.base.item.padding
*/
padding?: string;
};
/**
* Border radius of base item
*
* @designToken menubar.base.item.border.radius
*/
borderRadius?: string;
/**
* Padding of base item
*
* @designToken menubar.base.item.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the item section
*/
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken menubar.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken menubar.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken menubar.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken menubar.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken menubar.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken menubar.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken menubar.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken menubar.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken menubar.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken menubar.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken menubar.item.icon.active.color
*/
activeColor?: string;
/**
* Focus background of item
*
* @designToken menubar.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken menubar.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken menubar.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken menubar.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken menubar.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken menubar.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken menubar.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken menubar.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken menubar.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken menubar.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken menubar.item.icon.active.color
*/
activeColor?: string;
};
};
}
/**
* Used to pass tokens of the submenu section
*/
* Used to pass tokens of the submenu section
*/
submenu?: {
/**
* Padding of submenu
*
* @designToken menubar.submenu.padding
*/
padding?: string;
/**
* Gap of submenu
*
* @designToken menubar.submenu.gap
*/
gap?: string;
/**
* Background of submenu
*
* @designToken menubar.submenu.background
*/
background?: string;
/**
* Border color of submenu
*
* @designToken menubar.submenu.border.color
*/
borderColor?: string;
/**
* Border radius of submenu
*
* @designToken menubar.submenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of submenu
*
* @designToken menubar.submenu.shadow
*/
shadow?: string;
/**
* Mobile indent of submenu
*
* @designToken menubar.submenu.mobile.indent
*/
mobileIndent?: string;
}
/**
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken menubar.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken menubar.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken menubar.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken menubar.submenu.icon.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken menubar.separator.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the mobile button section
*/
mobileButton?: {
/**
* Border radius of mobile button
*
* @designToken menubar.mobile.button.border.radius
*/
borderRadius?: string;
/**
* Size of mobile button
*
* @designToken menubar.mobile.button.size
*/
size?: string;
/**
* Color of mobile button
*
* @designToken menubar.mobile.button.color
*/
color?: string;
/**
* Hover color of mobile button
*
* @designToken menubar.mobile.button.hover.color
*/
hoverColor?: string;
/**
* Hover background of mobile button
*
* @designToken menubar.mobile.button.hover.background
*/
hoverBackground?: string;
/**
* Focus ring of mobile button
*/
focusRing?: {
/**
* Focus ring width of mobile button
*
* @designToken menubar.mobile.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of mobile button
*
* @designToken menubar.mobile.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of mobile button
*
* @designToken menubar.mobile.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of mobile button
*
* @designToken menubar.mobile.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of mobile button
*
* @designToken menubar.mobile.button.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of submenu
*
* @designToken menubar.submenu.padding
*/
padding?: string;
/**
* Gap of submenu
*
* @designToken menubar.submenu.gap
*/
gap?: string;
/**
* Background of submenu
*
* @designToken menubar.submenu.background
*/
background?: string;
/**
* Border color of submenu
*
* @designToken menubar.submenu.border.color
*/
borderColor?: string;
/**
* Border radius of submenu
*
* @designToken menubar.submenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of submenu
*
* @designToken menubar.submenu.shadow
*/
shadow?: string;
/**
* Mobile indent of submenu
*
* @designToken menubar.submenu.mobile.indent
*/
mobileIndent?: string;
};
/**
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken menubar.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken menubar.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken menubar.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken menubar.submenu.icon.active.color
*/
activeColor?: string;
};
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken menubar.separator.border.color
*/
borderColor?: string;
};
/**
* Used to pass tokens of the mobile button section
*/
mobileButton?: {
/**
* Border radius of mobile button
*
* @designToken menubar.mobile.button.border.radius
*/
borderRadius?: string;
/**
* Size of mobile button
*
* @designToken menubar.mobile.button.size
*/
size?: string;
/**
* Color of mobile button
*
* @designToken menubar.mobile.button.color
*/
color?: string;
/**
* Hover color of mobile button
*
* @designToken menubar.mobile.button.hover.color
*/
hoverColor?: string;
/**
* Hover background of mobile button
*
* @designToken menubar.mobile.button.hover.background
*/
hoverBackground?: string;
/**
* Focus ring of mobile button
*/
focusRing?: {
/**
* Focus ring width of mobile button
*
* @designToken menubar.mobile.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of mobile button
*
* @designToken menubar.mobile.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of mobile button
*
* @designToken menubar.mobile.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of mobile button
*
* @designToken menubar.mobile.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of mobile button
*
* @designToken menubar.mobile.button.focus.ring.shadow
*/
shadow?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Message Design Tokens
@ -12,503 +11,477 @@
import { ColorSchemeDesignToken } from '..';
export interface MessageDesignTokens extends ColorSchemeDesignToken<MessageDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Margin of root
*
* @designToken message.margin
*/
margin?: string;
/**
* Border radius of root
*
* @designToken message.border.radius
*/
borderRadius?: string;
/**
* Border width of root
*
* @designToken message.border.width
*/
borderWidth?: string;
/**
* Transition duration of root
*
* @designToken message.transition.duration
*/
transitionDuration?: string;
};
/**
* Margin of root
*
* @designToken message.margin
*/
margin?: string;
/**
* Border radius of root
*
* @designToken message.border.radius
*/
borderRadius?: string;
/**
* Border width of root
*
* @designToken message.border.width
*/
borderWidth?: string;
/**
* Transition duration of root
*
* @designToken message.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken message.content.padding
*/
padding?: string;
/**
* Gap of content
*
* @designToken message.content.gap
*/
gap?: string;
};
/**
* Padding of content
*
* @designToken message.content.padding
*/
padding?: string;
/**
* Gap of content
*
* @designToken message.content.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the text section
*/
* Used to pass tokens of the text section
*/
text?: {
/**
* Font size of text
*
* @designToken message.text.font.size
*/
fontSize?: string;
/**
* Font weight of text
*
* @designToken message.text.font.weight
*/
fontWeight?: string;
};
/**
* Font size of text
*
* @designToken message.text.font.size
*/
fontSize?: string;
/**
* Font weight of text
*
* @designToken message.text.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken message.icon.size
*/
size?: string;
}
/**
* Used to pass tokens of the close button section
*/
closeButton?: {
/**
* Width of close button
*
* @designToken message.close.button.width
*/
width?: string;
/**
* Height of close button
*
* @designToken message.close.button.height
*/
height?: string;
/**
* Border radius of close button
*
* @designToken message.close.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of close button
*/
focusRing?: {
/**
* Focus ring width of close button
*
* @designToken message.close.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of close button
*
* @designToken message.close.button.focus.ring.style
*/
style?: string;
/**
* Focus ring offset of close button
*
* @designToken message.close.button.focus.ring.offset
*/
offset?: string;
/**
* Size of icon
*
* @designToken message.icon.size
*/
size?: string;
};
}
/**
* Used to pass tokens of the close icon section
*/
* Used to pass tokens of the close button section
*/
closeButton?: {
/**
* Width of close button
*
* @designToken message.close.button.width
*/
width?: string;
/**
* Height of close button
*
* @designToken message.close.button.height
*/
height?: string;
/**
* Border radius of close button
*
* @designToken message.close.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of close button
*/
focusRing?: {
/**
* Focus ring width of close button
*
* @designToken message.close.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of close button
*
* @designToken message.close.button.focus.ring.style
*/
style?: string;
/**
* Focus ring offset of close button
*
* @designToken message.close.button.focus.ring.offset
*/
offset?: string;
};
};
/**
* Used to pass tokens of the close icon section
*/
closeIcon?: {
/**
* Size of close icon
*
* @designToken message.close.icon.size
*/
size?: string;
};
/**
* Size of close icon
*
* @designToken message.close.icon.size
*/
size?: string;
}
/**
* Used to pass tokens of the info section
*/
* Used to pass tokens of the info section
*/
info?: {
/**
* Background of info
*
* @designToken message.info.background
*/
background?: string;
/**
* Border color of info
*
* @designToken message.info.border.color
*/
borderColor?: string;
/**
* Color of info
*
* @designToken message.info.color
*/
color?: string;
/**
* Shadow of info
*
* @designToken message.info.shadow
*/
shadow?: string;
/**
* Close button of info
*/
closeButton?: {
/**
* Close button hover background of info
*
* @designToken message.info.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of info
*/
focusRing?: {
/**
* Close button focus ring color of info
*
* @designToken message.info.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of info
*
* @designToken message.info.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of info
*
* @designToken message.info.background
*/
background?: string;
/**
* Border color of info
*
* @designToken message.info.border.color
*/
borderColor?: string;
/**
* Color of info
*
* @designToken message.info.color
*/
color?: string;
/**
* Shadow of info
*
* @designToken message.info.shadow
*/
shadow?: string;
/**
* Close button of info
*/
closeButton?: {
/**
* Close button hover background of info
*
* @designToken message.info.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of info
*/
focusRing?: {
/**
* Close button focus ring color of info
*
* @designToken message.info.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of info
*
* @designToken message.info.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
/**
* Used to pass tokens of the success section
*/
* Used to pass tokens of the success section
*/
success?: {
/**
* Background of success
*
* @designToken message.success.background
*/
background?: string;
/**
* Border color of success
*
* @designToken message.success.border.color
*/
borderColor?: string;
/**
* Color of success
*
* @designToken message.success.color
*/
color?: string;
/**
* Shadow of success
*
* @designToken message.success.shadow
*/
shadow?: string;
/**
* Close button of success
*/
closeButton?: {
/**
* Close button hover background of success
*
* @designToken message.success.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of success
*/
focusRing?: {
/**
* Close button focus ring color of success
*
* @designToken message.success.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of success
*
* @designToken message.success.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of success
*
* @designToken message.success.background
*/
background?: string;
/**
* Border color of success
*
* @designToken message.success.border.color
*/
borderColor?: string;
/**
* Color of success
*
* @designToken message.success.color
*/
color?: string;
/**
* Shadow of success
*
* @designToken message.success.shadow
*/
shadow?: string;
/**
* Close button of success
*/
closeButton?: {
/**
* Close button hover background of success
*
* @designToken message.success.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of success
*/
focusRing?: {
/**
* Close button focus ring color of success
*
* @designToken message.success.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of success
*
* @designToken message.success.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
/**
* Used to pass tokens of the warn section
*/
* Used to pass tokens of the warn section
*/
warn?: {
/**
* Background of warn
*
* @designToken message.warn.background
*/
background?: string;
/**
* Border color of warn
*
* @designToken message.warn.border.color
*/
borderColor?: string;
/**
* Color of warn
*
* @designToken message.warn.color
*/
color?: string;
/**
* Shadow of warn
*
* @designToken message.warn.shadow
*/
shadow?: string;
/**
* Close button of warn
*/
closeButton?: {
/**
* Close button hover background of warn
*
* @designToken message.warn.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of warn
*/
focusRing?: {
/**
* Close button focus ring color of warn
*
* @designToken message.warn.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of warn
*
* @designToken message.warn.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of warn
*
* @designToken message.warn.background
*/
background?: string;
/**
* Border color of warn
*
* @designToken message.warn.border.color
*/
borderColor?: string;
/**
* Color of warn
*
* @designToken message.warn.color
*/
color?: string;
/**
* Shadow of warn
*
* @designToken message.warn.shadow
*/
shadow?: string;
/**
* Close button of warn
*/
closeButton?: {
/**
* Close button hover background of warn
*
* @designToken message.warn.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of warn
*/
focusRing?: {
/**
* Close button focus ring color of warn
*
* @designToken message.warn.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of warn
*
* @designToken message.warn.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
/**
* Used to pass tokens of the error section
*/
* Used to pass tokens of the error section
*/
error?: {
/**
* Background of error
*
* @designToken message.error.background
*/
background?: string;
/**
* Border color of error
*
* @designToken message.error.border.color
*/
borderColor?: string;
/**
* Color of error
*
* @designToken message.error.color
*/
color?: string;
/**
* Shadow of error
*
* @designToken message.error.shadow
*/
shadow?: string;
/**
* Close button of error
*/
closeButton?: {
/**
* Close button hover background of error
*
* @designToken message.error.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of error
*/
focusRing?: {
/**
* Close button focus ring color of error
*
* @designToken message.error.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of error
*
* @designToken message.error.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of error
*
* @designToken message.error.background
*/
background?: string;
/**
* Border color of error
*
* @designToken message.error.border.color
*/
borderColor?: string;
/**
* Color of error
*
* @designToken message.error.color
*/
color?: string;
/**
* Shadow of error
*
* @designToken message.error.shadow
*/
shadow?: string;
/**
* Close button of error
*/
closeButton?: {
/**
* Close button hover background of error
*
* @designToken message.error.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of error
*/
focusRing?: {
/**
* Close button focus ring color of error
*
* @designToken message.error.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of error
*
* @designToken message.error.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
/**
* Used to pass tokens of the secondary section
*/
* Used to pass tokens of the secondary section
*/
secondary?: {
/**
* Background of secondary
*
* @designToken message.secondary.background
*/
background?: string;
/**
* Border color of secondary
*
* @designToken message.secondary.border.color
*/
borderColor?: string;
/**
* Color of secondary
*
* @designToken message.secondary.color
*/
color?: string;
/**
* Shadow of secondary
*
* @designToken message.secondary.shadow
*/
shadow?: string;
/**
* Close button of secondary
*/
closeButton?: {
/**
* Close button hover background of secondary
*
* @designToken message.secondary.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of secondary
*/
focusRing?: {
/**
* Close button focus ring color of secondary
*
* @designToken message.secondary.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of secondary
*
* @designToken message.secondary.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of secondary
*
* @designToken message.secondary.background
*/
background?: string;
/**
* Border color of secondary
*
* @designToken message.secondary.border.color
*/
borderColor?: string;
/**
* Color of secondary
*
* @designToken message.secondary.color
*/
color?: string;
/**
* Shadow of secondary
*
* @designToken message.secondary.shadow
*/
shadow?: string;
/**
* Close button of secondary
*/
closeButton?: {
/**
* Close button hover background of secondary
*
* @designToken message.secondary.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of secondary
*/
focusRing?: {
/**
* Close button focus ring color of secondary
*
* @designToken message.secondary.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of secondary
*
* @designToken message.secondary.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
/**
* Used to pass tokens of the contrast section
*/
* Used to pass tokens of the contrast section
*/
contrast?: {
/**
* Background of contrast
*
* @designToken message.contrast.background
*/
background?: string;
/**
* Border color of contrast
*
* @designToken message.contrast.border.color
*/
borderColor?: string;
/**
* Color of contrast
*
* @designToken message.contrast.color
*/
color?: string;
/**
* Shadow of contrast
*
* @designToken message.contrast.shadow
*/
shadow?: string;
/**
* Close button of contrast
*/
closeButton?: {
/**
* Close button hover background of contrast
*
* @designToken message.contrast.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of contrast
*/
focusRing?: {
/**
* Close button focus ring color of contrast
*
* @designToken message.contrast.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of contrast
*
* @designToken message.contrast.close.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of contrast
*
* @designToken message.contrast.background
*/
background?: string;
/**
* Border color of contrast
*
* @designToken message.contrast.border.color
*/
borderColor?: string;
/**
* Color of contrast
*
* @designToken message.contrast.color
*/
color?: string;
/**
* Shadow of contrast
*
* @designToken message.contrast.shadow
*/
shadow?: string;
/**
* Close button of contrast
*/
closeButton?: {
/**
* Close button hover background of contrast
*
* @designToken message.contrast.close.button.hover.background
*/
hoverBackground?: string;
/**
* Close button focus ring of contrast
*/
focusRing?: {
/**
* Close button focus ring color of contrast
*
* @designToken message.contrast.close.button.focus.ring.color
*/
color?: string;
/**
* Close button focus ring shadow of contrast
*
* @designToken message.contrast.close.button.focus.ring.shadow
*/
shadow?: string;
};
};
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* MeterGroup Design Tokens
@ -12,95 +11,88 @@
import { ColorSchemeDesignToken } from '..';
export interface MeterGroupDesignTokens extends ColorSchemeDesignToken<MeterGroupDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken metergroup.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken metergroup.gap
*/
gap?: string;
};
/**
* Border radius of root
*
* @designToken metergroup.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken metergroup.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the meters section
*/
* Used to pass tokens of the meters section
*/
meters?: {
/**
* Background of meters
*
* @designToken metergroup.meters.background
*/
background?: string;
/**
* Size of meters
*
* @designToken metergroup.meters.size
*/
size?: string;
};
/**
* Background of meters
*
* @designToken metergroup.meters.background
*/
background?: string;
/**
* Size of meters
*
* @designToken metergroup.meters.size
*/
size?: string;
}
/**
* Used to pass tokens of the label section
*/
* Used to pass tokens of the label section
*/
label?: {
/**
* Gap of label
*
* @designToken metergroup.label.gap
*/
gap?: string;
};
/**
* Gap of label
*
* @designToken metergroup.label.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the label marker section
*/
* Used to pass tokens of the label marker section
*/
labelMarker?: {
/**
* Size of label marker
*
* @designToken metergroup.label.marker.size
*/
size?: string;
};
/**
* Size of label marker
*
* @designToken metergroup.label.marker.size
*/
size?: string;
}
/**
* Used to pass tokens of the label icon section
*/
* Used to pass tokens of the label icon section
*/
labelIcon?: {
/**
* Size of label icon
*
* @designToken metergroup.label.icon.size
*/
size?: string;
};
/**
* Size of label icon
*
* @designToken metergroup.label.icon.size
*/
size?: string;
}
/**
* Used to pass tokens of the label list section
*/
* Used to pass tokens of the label list section
*/
labelList?: {
/**
* Vertical gap of label list
*
* @designToken metergroup.label.list.vertical.gap
*/
verticalGap?: string;
/**
* Horizontal gap of label list
*
* @designToken metergroup.label.list.horizontal.gap
*/
horizontalGap?: string;
}
/**
* Vertical gap of label list
*
* @designToken metergroup.label.list.vertical.gap
*/
verticalGap?: string;
/**
* Horizontal gap of label list
*
* @designToken metergroup.label.list.horizontal.gap
*/
horizontalGap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* MultiSelect Design Tokens
@ -12,347 +11,336 @@
import { ColorSchemeDesignToken } from '..';
export interface MultiSelectDesignTokens extends ColorSchemeDesignToken<MultiSelectDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken multiselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken multiselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken multiselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken multiselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken multiselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken multiselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken multiselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken multiselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken multiselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken multiselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken multiselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken multiselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken multiselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken multiselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken multiselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken multiselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken multiselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken multiselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken multiselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken multiselect.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken multiselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken multiselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken multiselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken multiselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken multiselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken multiselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken multiselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken multiselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken multiselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken multiselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken multiselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken multiselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken multiselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken multiselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken multiselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken multiselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken multiselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken multiselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken multiselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken multiselect.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken multiselect.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken multiselect.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the dropdown section
*/
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken multiselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken multiselect.dropdown.color
*/
color?: string;
}
/**
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken multiselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken multiselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken multiselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken multiselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken multiselect.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken multiselect.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken multiselect.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken multiselect.list.header.padding
*/
padding?: string;
/**
* Width of dropdown
*
* @designToken multiselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken multiselect.dropdown.color
*/
color?: string;
};
}
/**
* Used to pass tokens of the option section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken multiselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken multiselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken multiselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken multiselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken multiselect.overlay.shadow
*/
shadow?: string;
};
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken multiselect.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken multiselect.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken multiselect.list.header.padding
*/
padding?: string;
};
};
/**
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken multiselect.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken multiselect.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken multiselect.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken multiselect.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken multiselect.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken multiselect.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken multiselect.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken multiselect.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken multiselect.option.border.radius
*/
borderRadius?: string;
/**
* Gap of option
*
* @designToken multiselect.option.gap
*/
gap?: string;
};
/**
* Focus background of option
*
* @designToken multiselect.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken multiselect.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken multiselect.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken multiselect.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken multiselect.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken multiselect.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken multiselect.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken multiselect.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken multiselect.option.border.radius
*/
borderRadius?: string;
/**
* Gap of option
*
* @designToken multiselect.option.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the option group section
*/
* Used to pass tokens of the option group section
*/
optionGroup?: {
/**
* Background of option group
*
* @designToken multiselect.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken multiselect.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken multiselect.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken multiselect.option.group.padding
*/
padding?: string;
};
/**
* Background of option group
*
* @designToken multiselect.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken multiselect.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken multiselect.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken multiselect.option.group.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the chip section
*/
* Used to pass tokens of the chip section
*/
chip?: {
/**
* Border radius of chip
*
* @designToken multiselect.chip.border.radius
*/
borderRadius?: string;
};
/**
* Border radius of chip
*
* @designToken multiselect.chip.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the empty message section
*/
* Used to pass tokens of the empty message section
*/
emptyMessage?: {
/**
* Padding of empty message
*
* @designToken multiselect.empty.message.padding
*/
padding?: string;
}
/**
* Padding of empty message
*
* @designToken multiselect.empty.message.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* OrderList Design Tokens
@ -12,29 +11,26 @@
import { ColorSchemeDesignToken } from '..';
export interface OrderListDesignTokens extends ColorSchemeDesignToken<OrderListDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gap of root
*
* @designToken orderlist.gap
*/
gap?: string;
};
/**
* Gap of root
*
* @designToken orderlist.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the controls section
*/
* Used to pass tokens of the controls section
*/
controls?: {
/**
* Gap of controls
*
* @designToken orderlist.controls.gap
*/
gap?: string;
}
/**
* Gap of controls
*
* @designToken orderlist.controls.gap
*/
gap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* OrganizationChart Design Tokens
@ -12,197 +11,191 @@
import { ColorSchemeDesignToken } from '..';
export interface OrganizationChartDesignTokens extends ColorSchemeDesignToken<OrganizationChartDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gutter of root
*
* @designToken organizationchart.gutter
*/
gutter?: string;
/**
* Transition duration of root
*
* @designToken organizationchart.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the node section
*/
node?: {
/**
* Background of node
*
* @designToken organizationchart.node.background
*/
background?: string;
/**
* Hover background of node
*
* @designToken organizationchart.node.hover.background
*/
hoverBackground?: string;
/**
* Selected background of node
*
* @designToken organizationchart.node.selected.background
*/
selectedBackground?: string;
/**
* Border color of node
*
* @designToken organizationchart.node.border.color
*/
borderColor?: string;
/**
* Color of node
*
* @designToken organizationchart.node.color
*/
color?: string;
/**
* Selected color of node
*
* @designToken organizationchart.node.selected.color
*/
selectedColor?: string;
/**
* Hover color of node
*
* @designToken organizationchart.node.hover.color
*/
hoverColor?: string;
/**
* Padding of node
*
* @designToken organizationchart.node.padding
*/
padding?: string;
/**
* Toggleable padding of node
*
* @designToken organizationchart.node.toggleable.padding
*/
toggleablePadding?: string;
/**
* Border radius of node
*
* @designToken organizationchart.node.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the node toggle button section
*/
nodeToggleButton?: {
/**
* Background of node toggle button
*
* @designToken organizationchart.node.toggle.button.background
*/
background?: string;
/**
* Hover background of node toggle button
*
* @designToken organizationchart.node.toggle.button.hover.background
*/
hoverBackground?: string;
/**
* Border color of node toggle button
*
* @designToken organizationchart.node.toggle.button.border.color
*/
borderColor?: string;
/**
* Color of node toggle button
*
* @designToken organizationchart.node.toggle.button.color
*/
color?: string;
/**
* Hover color of node toggle button
*
* @designToken organizationchart.node.toggle.button.hover.color
*/
hoverColor?: string;
/**
* Size of node toggle button
*
* @designToken organizationchart.node.toggle.button.size
*/
size?: string;
/**
* Border radius of node toggle button
*
* @designToken organizationchart.node.toggle.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of node toggle button
*/
focusRing?: {
/**
* Focus ring width of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.shadow
*/
shadow?: string;
/**
* Gutter of root
*
* @designToken organizationchart.gutter
*/
gutter?: string;
/**
* Transition duration of root
*
* @designToken organizationchart.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the connector section
*/
* Used to pass tokens of the node section
*/
node?: {
/**
* Background of node
*
* @designToken organizationchart.node.background
*/
background?: string;
/**
* Hover background of node
*
* @designToken organizationchart.node.hover.background
*/
hoverBackground?: string;
/**
* Selected background of node
*
* @designToken organizationchart.node.selected.background
*/
selectedBackground?: string;
/**
* Border color of node
*
* @designToken organizationchart.node.border.color
*/
borderColor?: string;
/**
* Color of node
*
* @designToken organizationchart.node.color
*/
color?: string;
/**
* Selected color of node
*
* @designToken organizationchart.node.selected.color
*/
selectedColor?: string;
/**
* Hover color of node
*
* @designToken organizationchart.node.hover.color
*/
hoverColor?: string;
/**
* Padding of node
*
* @designToken organizationchart.node.padding
*/
padding?: string;
/**
* Toggleable padding of node
*
* @designToken organizationchart.node.toggleable.padding
*/
toggleablePadding?: string;
/**
* Border radius of node
*
* @designToken organizationchart.node.border.radius
*/
borderRadius?: string;
};
/**
* Used to pass tokens of the node toggle button section
*/
nodeToggleButton?: {
/**
* Background of node toggle button
*
* @designToken organizationchart.node.toggle.button.background
*/
background?: string;
/**
* Hover background of node toggle button
*
* @designToken organizationchart.node.toggle.button.hover.background
*/
hoverBackground?: string;
/**
* Border color of node toggle button
*
* @designToken organizationchart.node.toggle.button.border.color
*/
borderColor?: string;
/**
* Color of node toggle button
*
* @designToken organizationchart.node.toggle.button.color
*/
color?: string;
/**
* Hover color of node toggle button
*
* @designToken organizationchart.node.toggle.button.hover.color
*/
hoverColor?: string;
/**
* Size of node toggle button
*
* @designToken organizationchart.node.toggle.button.size
*/
size?: string;
/**
* Border radius of node toggle button
*
* @designToken organizationchart.node.toggle.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of node toggle button
*/
focusRing?: {
/**
* Focus ring width of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node toggle button
*
* @designToken organizationchart.node.toggle.button.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the connector section
*/
connector?: {
/**
* Color of connector
*
* @designToken organizationchart.connector.color
*/
color?: string;
/**
* Border radius of connector
*
* @designToken organizationchart.connector.border.radius
*/
borderRadius?: string;
/**
* Height of connector
*
* @designToken organizationchart.connector.height
*/
height?: string;
}
/**
* Color of connector
*
* @designToken organizationchart.connector.color
*/
color?: string;
/**
* Border radius of connector
*
* @designToken organizationchart.connector.border.radius
*/
borderRadius?: string;
/**
* Height of connector
*
* @designToken organizationchart.connector.height
*/
height?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* OverlayBadge Design Tokens
@ -12,29 +11,26 @@
import { ColorSchemeDesignToken } from '..';
export interface OverlayBadgeDesignTokens extends ColorSchemeDesignToken<OverlayBadgeDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Outline of root
*/
outline?: {
/**
* Outline width of root
*
* @designToken overlaybadge.outline.width
*/
width?: string;
/**
* Outline color of root
*
* @designToken overlaybadge.outline.color
*/
color?: string;
/**
* Outline of root
*/
outline?: {
/**
* Outline width of root
*
* @designToken overlaybadge.outline.width
*/
width?: string;
/**
* Outline color of root
*
* @designToken overlaybadge.outline.color
*/
color?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Paginator Design Tokens
@ -12,167 +11,161 @@
import { ColorSchemeDesignToken } from '..';
export interface PaginatorDesignTokens extends ColorSchemeDesignToken<PaginatorDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Padding of root
*
* @designToken paginator.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken paginator.gap
*/
gap?: string;
/**
* Border radius of root
*
* @designToken paginator.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken paginator.background
*/
background?: string;
/**
* Color of root
*
* @designToken paginator.color
*/
color?: string;
/**
* Transition duration of root
*
* @designToken paginator.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the nav button section
*/
navButton?: {
/**
* Background of nav button
*
* @designToken paginator.nav.button.background
*/
background?: string;
/**
* Hover background of nav button
*
* @designToken paginator.nav.button.hover.background
*/
hoverBackground?: string;
/**
* Selected background of nav button
*
* @designToken paginator.nav.button.selected.background
*/
selectedBackground?: string;
/**
* Color of nav button
*
* @designToken paginator.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken paginator.nav.button.hover.color
*/
hoverColor?: string;
/**
* Selected color of nav button
*
* @designToken paginator.nav.button.selected.color
*/
selectedColor?: string;
/**
* Width of nav button
*
* @designToken paginator.nav.button.width
*/
width?: string;
/**
* Height of nav button
*
* @designToken paginator.nav.button.height
*/
height?: string;
/**
* Border radius of nav button
*
* @designToken paginator.nav.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of nav button
*/
focusRing?: {
/**
* Focus ring width of nav button
*
* @designToken paginator.nav.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of nav button
*
* @designToken paginator.nav.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of nav button
*
* @designToken paginator.nav.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of nav button
*
* @designToken paginator.nav.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of nav button
*
* @designToken paginator.nav.button.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken paginator.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken paginator.gap
*/
gap?: string;
/**
* Border radius of root
*
* @designToken paginator.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken paginator.background
*/
background?: string;
/**
* Color of root
*
* @designToken paginator.color
*/
color?: string;
/**
* Transition duration of root
*
* @designToken paginator.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the current page report section
*/
* Used to pass tokens of the nav button section
*/
navButton?: {
/**
* Background of nav button
*
* @designToken paginator.nav.button.background
*/
background?: string;
/**
* Hover background of nav button
*
* @designToken paginator.nav.button.hover.background
*/
hoverBackground?: string;
/**
* Selected background of nav button
*
* @designToken paginator.nav.button.selected.background
*/
selectedBackground?: string;
/**
* Color of nav button
*
* @designToken paginator.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken paginator.nav.button.hover.color
*/
hoverColor?: string;
/**
* Selected color of nav button
*
* @designToken paginator.nav.button.selected.color
*/
selectedColor?: string;
/**
* Width of nav button
*
* @designToken paginator.nav.button.width
*/
width?: string;
/**
* Height of nav button
*
* @designToken paginator.nav.button.height
*/
height?: string;
/**
* Border radius of nav button
*
* @designToken paginator.nav.button.border.radius
*/
borderRadius?: string;
/**
* Focus ring of nav button
*/
focusRing?: {
/**
* Focus ring width of nav button
*
* @designToken paginator.nav.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of nav button
*
* @designToken paginator.nav.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of nav button
*
* @designToken paginator.nav.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of nav button
*
* @designToken paginator.nav.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of nav button
*
* @designToken paginator.nav.button.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the current page report section
*/
currentPageReport?: {
/**
* Color of current page report
*
* @designToken paginator.current.page.report.color
*/
color?: string;
};
/**
* Color of current page report
*
* @designToken paginator.current.page.report.color
*/
color?: string;
}
/**
* Used to pass tokens of the jump to page input section
*/
* Used to pass tokens of the jump to page input section
*/
jumpToPageInput?: {
/**
* Max width of jump to page input
*
* @designToken paginator.jump.to.page.input.max.width
*/
maxWidth?: string;
}
/**
* Max width of jump to page input
*
* @designToken paginator.jump.to.page.input.max.width
*/
maxWidth?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Panel Design Tokens
@ -12,125 +11,118 @@
import { ColorSchemeDesignToken } from '..';
export interface PanelDesignTokens extends ColorSchemeDesignToken<PanelDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken panel.background
*/
background?: string;
/**
* Border color of root
*
* @designToken panel.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken panel.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken panel.border.radius
*/
borderRadius?: string;
};
/**
* Background of root
*
* @designToken panel.background
*/
background?: string;
/**
* Border color of root
*
* @designToken panel.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken panel.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken panel.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the header section
*/
* Used to pass tokens of the header section
*/
header?: {
/**
* Background of header
*
* @designToken panel.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken panel.header.color
*/
color?: string;
/**
* Padding of header
*
* @designToken panel.header.padding
*/
padding?: string;
/**
* Border color of header
*
* @designToken panel.header.border.color
*/
borderColor?: string;
/**
* Border width of header
*
* @designToken panel.header.border.width
*/
borderWidth?: string;
/**
* Border radius of header
*
* @designToken panel.header.border.radius
*/
borderRadius?: string;
};
/**
* Background of header
*
* @designToken panel.header.background
*/
background?: string;
/**
* Color of header
*
* @designToken panel.header.color
*/
color?: string;
/**
* Padding of header
*
* @designToken panel.header.padding
*/
padding?: string;
/**
* Border color of header
*
* @designToken panel.header.border.color
*/
borderColor?: string;
/**
* Border width of header
*
* @designToken panel.header.border.width
*/
borderWidth?: string;
/**
* Border radius of header
*
* @designToken panel.header.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the toggleable header section
*/
* Used to pass tokens of the toggleable header section
*/
toggleableHeader?: {
/**
* Padding of toggleable header
*
* @designToken panel.toggleable.header.padding
*/
padding?: string;
};
/**
* Padding of toggleable header
*
* @designToken panel.toggleable.header.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the title section
*/
* Used to pass tokens of the title section
*/
title?: {
/**
* Font weight of title
*
* @designToken panel.title.font.weight
*/
fontWeight?: string;
};
/**
* Font weight of title
*
* @designToken panel.title.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken panel.content.padding
*/
padding?: string;
};
/**
* Padding of content
*
* @designToken panel.content.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the footer section
*/
* Used to pass tokens of the footer section
*/
footer?: {
/**
* Padding of footer
*
* @designToken panel.footer.padding
*/
padding?: string;
}
/**
* Padding of footer
*
* @designToken panel.footer.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* PanelMenu Design Tokens
@ -12,191 +11,182 @@
import { ColorSchemeDesignToken } from '..';
export interface PanelMenuDesignTokens extends ColorSchemeDesignToken<PanelMenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gap of root
*
* @designToken panelmenu.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken panelmenu.transition.duration
*/
transitionDuration?: string;
};
/**
* Gap of root
*
* @designToken panelmenu.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken panelmenu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the panel section
*/
* Used to pass tokens of the panel section
*/
panel?: {
/**
* Background of panel
*
* @designToken panelmenu.panel.background
*/
background?: string;
/**
* Border color of panel
*
* @designToken panelmenu.panel.border.color
*/
borderColor?: string;
/**
* Border width of panel
*
* @designToken panelmenu.panel.border.width
*/
borderWidth?: string;
/**
* Color of panel
*
* @designToken panelmenu.panel.color
*/
color?: string;
/**
* Padding of panel
*
* @designToken panelmenu.panel.padding
*/
padding?: string;
/**
* Border radius of panel
*
* @designToken panelmenu.panel.border.radius
*/
borderRadius?: string;
/**
* First of panel
*/
first?: {
/**
* First border width of panel
*
* @designToken panelmenu.panel.first.border.width
*/
borderWidth?: string;
/**
* First top border radius of panel
*
* @designToken panelmenu.panel.first.top.border.radius
*/
topBorderRadius?: string;
/**
* Background of panel
*
* @designToken panelmenu.panel.background
*/
background?: string;
/**
* Border color of panel
*
* @designToken panelmenu.panel.border.color
*/
borderColor?: string;
/**
* Border width of panel
*
* @designToken panelmenu.panel.border.width
*/
borderWidth?: string;
/**
* Color of panel
*
* @designToken panelmenu.panel.color
*/
color?: string;
/**
* Padding of panel
*
* @designToken panelmenu.panel.padding
*/
padding?: string;
/**
* Border radius of panel
*
* @designToken panelmenu.panel.border.radius
*/
borderRadius?: string;
/**
* First of panel
*/
first?: {
/**
* First border width of panel
*
* @designToken panelmenu.panel.first.border.width
*/
borderWidth?: string;
/**
* First top border radius of panel
*
* @designToken panelmenu.panel.first.top.border.radius
*/
topBorderRadius?: string;
};
/**
* Last of panel
*/
last?: {
/**
* Last border width of panel
*
* @designToken panelmenu.panel.last.border.width
*/
borderWidth?: string;
/**
* Last bottom border radius of panel
*
* @designToken panelmenu.panel.last.bottom.border.radius
*/
bottomBorderRadius?: string;
};
};
/**
* Last of panel
*/
last?: {
/**
* Last border width of panel
*
* @designToken panelmenu.panel.last.border.width
*/
borderWidth?: string;
/**
* Last bottom border radius of panel
*
* @designToken panelmenu.panel.last.bottom.border.radius
*/
bottomBorderRadius?: string;
};
}
/**
* Used to pass tokens of the item section
*/
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken panelmenu.item.focus.background
*/
focusBackground?: string;
/**
* Color of item
*
* @designToken panelmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken panelmenu.item.focus.color
*/
focusColor?: string;
/**
* Gap of item
*
* @designToken panelmenu.item.gap
*/
gap?: string;
/**
* Padding of item
*
* @designToken panelmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken panelmenu.item.border.radius
*/
borderRadius?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken panelmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken panelmenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Focus background of item
*
* @designToken panelmenu.item.focus.background
*/
focusBackground?: string;
/**
* Color of item
*
* @designToken panelmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken panelmenu.item.focus.color
*/
focusColor?: string;
/**
* Gap of item
*
* @designToken panelmenu.item.gap
*/
gap?: string;
/**
* Padding of item
*
* @designToken panelmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken panelmenu.item.border.radius
*/
borderRadius?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken panelmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken panelmenu.item.icon.focus.color
*/
focusColor?: string;
};
};
}
/**
* Used to pass tokens of the submenu section
*/
* Used to pass tokens of the submenu section
*/
submenu?: {
/**
* Indent of submenu
*
* @designToken panelmenu.submenu.indent
*/
indent?: string;
};
/**
* Indent of submenu
*
* @designToken panelmenu.submenu.indent
*/
indent?: string;
}
/**
* Used to pass tokens of the submenu icon section
*/
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Color of submenu icon
*
* @designToken panelmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken panelmenu.submenu.icon.focus.color
*/
focusColor?: string;
}
/**
* Color of submenu icon
*
* @designToken panelmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken panelmenu.submenu.icon.focus.color
*/
focusColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Password Design Tokens
@ -12,119 +11,113 @@
import { ColorSchemeDesignToken } from '..';
export interface PasswordDesignTokens extends ColorSchemeDesignToken<PasswordDesignTokens> {
/**
* Used to pass tokens of the meter section
*/
* Used to pass tokens of the meter section
*/
meter?: {
/**
* Background of meter
*
* @designToken password.meter.background
*/
background?: string;
/**
* Border radius of meter
*
* @designToken password.meter.border.radius
*/
borderRadius?: string;
/**
* Height of meter
*
* @designToken password.meter.height
*/
height?: string;
};
/**
* Background of meter
*
* @designToken password.meter.background
*/
background?: string;
/**
* Border radius of meter
*
* @designToken password.meter.border.radius
*/
borderRadius?: string;
/**
* Height of meter
*
* @designToken password.meter.height
*/
height?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Color of icon
*
* @designToken password.icon.color
*/
color?: string;
};
/**
* Color of icon
*
* @designToken password.icon.color
*/
color?: string;
}
/**
* Used to pass tokens of the overlay section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken password.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken password.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken password.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken password.overlay.color
*/
color?: string;
/**
* Padding of overlay
*
* @designToken password.overlay.padding
*/
padding?: string;
/**
* Shadow of overlay
*
* @designToken password.overlay.shadow
*/
shadow?: string;
};
/**
* Background of overlay
*
* @designToken password.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken password.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken password.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken password.overlay.color
*/
color?: string;
/**
* Padding of overlay
*
* @designToken password.overlay.padding
*/
padding?: string;
/**
* Shadow of overlay
*
* @designToken password.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Gap of content
*
* @designToken password.content.gap
*/
gap?: string;
};
/**
* Gap of content
*
* @designToken password.content.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the strength section
*/
* Used to pass tokens of the strength section
*/
strength?: {
/**
* Weak background of strength
*
* @designToken password.strength.weak.background
*/
weakBackground?: string;
/**
* Medium background of strength
*
* @designToken password.strength.medium.background
*/
mediumBackground?: string;
/**
* Strong background of strength
*
* @designToken password.strength.strong.background
*/
strongBackground?: string;
}
/**
* Weak background of strength
*
* @designToken password.strength.weak.background
*/
weakBackground?: string;
/**
* Medium background of strength
*
* @designToken password.strength.medium.background
*/
mediumBackground?: string;
/**
* Strong background of strength
*
* @designToken password.strength.strong.background
*/
strongBackground?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* PickList Design Tokens
@ -12,29 +11,26 @@
import { ColorSchemeDesignToken } from '..';
export interface PickListDesignTokens extends ColorSchemeDesignToken<PickListDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gap of root
*
* @designToken picklist.gap
*/
gap?: string;
};
/**
* Gap of root
*
* @designToken picklist.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the controls section
*/
* Used to pass tokens of the controls section
*/
controls?: {
/**
* Gap of controls
*
* @designToken picklist.controls.gap
*/
gap?: string;
}
/**
* Gap of controls
*
* @designToken picklist.controls.gap
*/
gap?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Popover Design Tokens
@ -12,65 +11,62 @@
import { ColorSchemeDesignToken } from '..';
export interface PopoverDesignTokens extends ColorSchemeDesignToken<PopoverDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken popover.background
*/
background?: string;
/**
* Border color of root
*
* @designToken popover.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken popover.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken popover.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken popover.shadow
*/
shadow?: string;
/**
* Gutter of root
*
* @designToken popover.gutter
*/
gutter?: string;
/**
* Arrow offset of root
*
* @designToken popover.arrow.offset
*/
arrowOffset?: string;
};
/**
* Background of root
*
* @designToken popover.background
*/
background?: string;
/**
* Border color of root
*
* @designToken popover.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken popover.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken popover.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken popover.shadow
*/
shadow?: string;
/**
* Gutter of root
*
* @designToken popover.gutter
*/
gutter?: string;
/**
* Arrow offset of root
*
* @designToken popover.arrow.offset
*/
arrowOffset?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Padding of content
*
* @designToken popover.content.padding
*/
padding?: string;
}
/**
* Padding of content
*
* @designToken popover.content.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ProgressBar Design Tokens
@ -12,65 +11,61 @@
import { ColorSchemeDesignToken } from '..';
export interface ProgressBarDesignTokens extends ColorSchemeDesignToken<ProgressBarDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken progressbar.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken progressbar.border.radius
*/
borderRadius?: string;
/**
* Height of root
*
* @designToken progressbar.height
*/
height?: string;
};
/**
* Background of root
*
* @designToken progressbar.background
*/
background?: string;
/**
* Border radius of root
*
* @designToken progressbar.border.radius
*/
borderRadius?: string;
/**
* Height of root
*
* @designToken progressbar.height
*/
height?: string;
}
/**
* Used to pass tokens of the value section
*/
* Used to pass tokens of the value section
*/
value?: {
/**
* Background of value
*
* @designToken progressbar.value.background
*/
background?: string;
};
/**
* Background of value
*
* @designToken progressbar.value.background
*/
background?: string;
}
/**
* Used to pass tokens of the label section
*/
* Used to pass tokens of the label section
*/
label?: {
/**
* Color of label
*
* @designToken progressbar.label.color
*/
color?: string;
/**
* Font size of label
*
* @designToken progressbar.label.font.size
*/
fontSize?: string;
/**
* Font weight of label
*
* @designToken progressbar.label.font.weight
*/
fontWeight?: string;
}
/**
* Color of label
*
* @designToken progressbar.label.color
*/
color?: string;
/**
* Font size of label
*
* @designToken progressbar.label.font.size
*/
fontSize?: string;
/**
* Font weight of label
*
* @designToken progressbar.label.font.weight
*/
fontWeight?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ProgressSpinner Design Tokens
@ -12,35 +11,33 @@
import { ColorSchemeDesignToken } from '..';
export interface ProgressSpinnerDesignTokens extends ColorSchemeDesignToken<ProgressSpinnerDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Color.1 of root
*
* @designToken progressspinner.color.1
*/
'color.1'?: string;
/**
* Color.2 of root
*
* @designToken progressspinner.color.2
*/
'color.2'?: string;
/**
* Color.3 of root
*
* @designToken progressspinner.color.3
*/
'color.3'?: string;
/**
* Color.4 of root
*
* @designToken progressspinner.color.4
*/
'color.4'?: string;
}
/**
* Color.1 of root
*
* @designToken progressspinner.color.1
*/
'color.1'?: string;
/**
* Color.2 of root
*
* @designToken progressspinner.color.2
*/
'color.2'?: string;
/**
* Color.3 of root
*
* @designToken progressspinner.color.3
*/
'color.3'?: string;
/**
* Color.4 of root
*
* @designToken progressspinner.color.4
*/
'color.4'?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* RadioButton Design Tokens
@ -12,173 +11,169 @@
import { ColorSchemeDesignToken } from '..';
export interface RadioButtonDesignTokens extends ColorSchemeDesignToken<RadioButtonDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Width of root
*
* @designToken radiobutton.width
*/
width?: string;
/**
* Height of root
*
* @designToken radiobutton.height
*/
height?: string;
/**
* Background of root
*
* @designToken radiobutton.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken radiobutton.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken radiobutton.checked.hover.background
*/
checkedHoverBackground?: string;
/**
* Disabled background of root
*
* @designToken radiobutton.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken radiobutton.filled.background
*/
filledBackground?: string;
/**
* Border color of root
*
* @designToken radiobutton.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken radiobutton.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken radiobutton.focus.border.color
*/
focusBorderColor?: string;
/**
* Checked border color of root
*
* @designToken radiobutton.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken radiobutton.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Checked focus border color of root
*
* @designToken radiobutton.checked.focus.border.color
*/
checkedFocusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken radiobutton.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Shadow of root
*
* @designToken radiobutton.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken radiobutton.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken radiobutton.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken radiobutton.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken radiobutton.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken radiobutton.focus.ring.shadow
*/
shadow?: string;
/**
* Width of root
*
* @designToken radiobutton.width
*/
width?: string;
/**
* Height of root
*
* @designToken radiobutton.height
*/
height?: string;
/**
* Background of root
*
* @designToken radiobutton.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken radiobutton.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken radiobutton.checked.hover.background
*/
checkedHoverBackground?: string;
/**
* Disabled background of root
*
* @designToken radiobutton.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken radiobutton.filled.background
*/
filledBackground?: string;
/**
* Border color of root
*
* @designToken radiobutton.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken radiobutton.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken radiobutton.focus.border.color
*/
focusBorderColor?: string;
/**
* Checked border color of root
*
* @designToken radiobutton.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken radiobutton.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Checked focus border color of root
*
* @designToken radiobutton.checked.focus.border.color
*/
checkedFocusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken radiobutton.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Shadow of root
*
* @designToken radiobutton.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken radiobutton.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken radiobutton.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken radiobutton.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken radiobutton.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken radiobutton.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken radiobutton.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken radiobutton.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken radiobutton.icon.size
*/
size?: string;
/**
* Checked color of icon
*
* @designToken radiobutton.icon.checked.color
*/
checkedColor?: string;
/**
* Checked hover color of icon
*
* @designToken radiobutton.icon.checked.hover.color
*/
checkedHoverColor?: string;
/**
* Disabled color of icon
*
* @designToken radiobutton.icon.disabled.color
*/
disabledColor?: string;
}
/**
* Size of icon
*
* @designToken radiobutton.icon.size
*/
size?: string;
/**
* Checked color of icon
*
* @designToken radiobutton.icon.checked.color
*/
checkedColor?: string;
/**
* Checked hover color of icon
*
* @designToken radiobutton.icon.checked.hover.color
*/
checkedHoverColor?: string;
/**
* Disabled color of icon
*
* @designToken radiobutton.icon.disabled.color
*/
disabledColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Rating Design Tokens
@ -12,53 +11,50 @@
import { ColorSchemeDesignToken } from '..';
export interface RatingDesignTokens extends ColorSchemeDesignToken<RatingDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gap of root
*
* @designToken rating.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken rating.transition.duration
*/
transitionDuration?: string;
};
/**
* Gap of root
*
* @designToken rating.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken rating.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken rating.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken rating.icon.color
*/
color?: string;
/**
* Hover color of icon
*
* @designToken rating.icon.hover.color
*/
hoverColor?: string;
/**
* Active color of icon
*
* @designToken rating.icon.active.color
*/
activeColor?: string;
}
/**
* Size of icon
*
* @designToken rating.icon.size
*/
size?: string;
/**
* Color of icon
*
* @designToken rating.icon.color
*/
color?: string;
/**
* Hover color of icon
*
* @designToken rating.icon.hover.color
*/
hoverColor?: string;
/**
* Active color of icon
*
* @designToken rating.icon.active.color
*/
activeColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Ripple Design Tokens
@ -12,17 +11,15 @@
import { ColorSchemeDesignToken } from '..';
export interface RippleDesignTokens extends ColorSchemeDesignToken<RippleDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken ripple.background
*/
background?: string;
}
/**
* Background of root
*
* @designToken ripple.background
*/
background?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ScrollPanel Design Tokens
@ -12,77 +11,73 @@
import { ColorSchemeDesignToken } from '..';
export interface ScrollPanelDesignTokens extends ColorSchemeDesignToken<ScrollPanelDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken scrollpanel.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the bar section
*/
bar?: {
/**
* Size of bar
*
* @designToken scrollpanel.bar.size
*/
size?: string;
/**
* Border radius of bar
*
* @designToken scrollpanel.bar.border.radius
*/
borderRadius?: string;
/**
* Focus ring of bar
*/
focusRing?: {
/**
* Focus ring width of bar
*
* @designToken scrollpanel.bar.focus.ring.width
*/
width?: string;
/**
* Focus ring style of bar
*
* @designToken scrollpanel.bar.focus.ring.style
*/
style?: string;
/**
* Focus ring color of bar
*
* @designToken scrollpanel.bar.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of bar
*
* @designToken scrollpanel.bar.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of bar
*
* @designToken scrollpanel.bar.focus.ring.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken scrollpanel.transition.duration
*/
transitionDuration?: string;
};
/**
* Background of bar
*
* @designToken scrollpanel.bar.background
*/
background?: string;
}
* Used to pass tokens of the bar section
*/
bar?: {
/**
* Size of bar
*
* @designToken scrollpanel.bar.size
*/
size?: string;
/**
* Border radius of bar
*
* @designToken scrollpanel.bar.border.radius
*/
borderRadius?: string;
/**
* Focus ring of bar
*/
focusRing?: {
/**
* Focus ring width of bar
*
* @designToken scrollpanel.bar.focus.ring.width
*/
width?: string;
/**
* Focus ring style of bar
*
* @designToken scrollpanel.bar.focus.ring.style
*/
style?: string;
/**
* Focus ring color of bar
*
* @designToken scrollpanel.bar.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of bar
*
* @designToken scrollpanel.bar.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of bar
*
* @designToken scrollpanel.bar.focus.ring.shadow
*/
shadow?: string;
};
/**
* Background of bar
*
* @designToken scrollpanel.bar.background
*/
background?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Select Design Tokens
@ -12,365 +11,353 @@
import { ColorSchemeDesignToken } from '..';
export interface SelectDesignTokens extends ColorSchemeDesignToken<SelectDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken select.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken select.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken select.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken select.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken select.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken select.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken select.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken select.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken select.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken select.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken select.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken select.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken select.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken select.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken select.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken select.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken select.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken select.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken select.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken select.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken select.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken select.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken select.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken select.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken select.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken select.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken select.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken select.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken select.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken select.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken select.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken select.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken select.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken select.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken select.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken select.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken select.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken select.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken select.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken select.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken select.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken select.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the dropdown section
*/
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken select.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken select.dropdown.color
*/
color?: string;
}
/**
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken select.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken select.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken select.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken select.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken select.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken select.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken select.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken select.list.header.padding
*/
padding?: string;
/**
* Width of dropdown
*
* @designToken select.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken select.dropdown.color
*/
color?: string;
};
}
/**
* Used to pass tokens of the option section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken select.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken select.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken select.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken select.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken select.overlay.shadow
*/
shadow?: string;
};
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken select.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken select.list.gap
*/
gap?: string;
/**
* Header of list
*/
header?: {
/**
* Header padding of list
*
* @designToken select.list.header.padding
*/
padding?: string;
};
};
/**
* Used to pass tokens of the option section
*/
option?: {
/**
* Focus background of option
*
* @designToken select.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken select.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken select.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken select.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken select.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken select.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken select.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken select.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken select.option.border.radius
*/
borderRadius?: string;
};
/**
* Focus background of option
*
* @designToken select.option.focus.background
*/
focusBackground?: string;
/**
* Selected background of option
*
* @designToken select.option.selected.background
*/
selectedBackground?: string;
/**
* Selected focus background of option
*
* @designToken select.option.selected.focus.background
*/
selectedFocusBackground?: string;
/**
* Color of option
*
* @designToken select.option.color
*/
color?: string;
/**
* Focus color of option
*
* @designToken select.option.focus.color
*/
focusColor?: string;
/**
* Selected color of option
*
* @designToken select.option.selected.color
*/
selectedColor?: string;
/**
* Selected focus color of option
*
* @designToken select.option.selected.focus.color
*/
selectedFocusColor?: string;
/**
* Padding of option
*
* @designToken select.option.padding
*/
padding?: string;
/**
* Border radius of option
*
* @designToken select.option.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the option group section
*/
* Used to pass tokens of the option group section
*/
optionGroup?: {
/**
* Background of option group
*
* @designToken select.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken select.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken select.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken select.option.group.padding
*/
padding?: string;
};
/**
* Background of option group
*
* @designToken select.option.group.background
*/
background?: string;
/**
* Color of option group
*
* @designToken select.option.group.color
*/
color?: string;
/**
* Font weight of option group
*
* @designToken select.option.group.font.weight
*/
fontWeight?: string;
/**
* Padding of option group
*
* @designToken select.option.group.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the clear icon section
*/
* Used to pass tokens of the clear icon section
*/
clearIcon?: {
/**
* Color of clear icon
*
* @designToken select.clear.icon.color
*/
color?: string;
};
/**
* Color of clear icon
*
* @designToken select.clear.icon.color
*/
color?: string;
}
/**
* Used to pass tokens of the checkmark section
*/
* Used to pass tokens of the checkmark section
*/
checkmark?: {
/**
* Color of checkmark
*
* @designToken select.checkmark.color
*/
color?: string;
/**
* Gutter start of checkmark
*
* @designToken select.checkmark.gutter.start
*/
gutterStart?: string;
/**
* Gutter end of checkmark
*
* @designToken select.checkmark.gutter.end
*/
gutterEnd?: string;
};
/**
* Color of checkmark
*
* @designToken select.checkmark.color
*/
color?: string;
/**
* Gutter start of checkmark
*
* @designToken select.checkmark.gutter.start
*/
gutterStart?: string;
/**
* Gutter end of checkmark
*
* @designToken select.checkmark.gutter.end
*/
gutterEnd?: string;
}
/**
* Used to pass tokens of the empty message section
*/
* Used to pass tokens of the empty message section
*/
emptyMessage?: {
/**
* Padding of empty message
*
* @designToken select.empty.message.padding
*/
padding?: string;
}
/**
* Padding of empty message
*
* @designToken select.empty.message.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* SelectButton Design Tokens
@ -12,23 +11,21 @@
import { ColorSchemeDesignToken } from '..';
export interface SelectButtonDesignTokens extends ColorSchemeDesignToken<SelectButtonDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken selectbutton.border.radius
*/
borderRadius?: string;
/**
* Invalid border color of root
*
* @designToken selectbutton.invalid.border.color
*/
invalidBorderColor?: string;
}
/**
* Border radius of root
*
* @designToken selectbutton.border.radius
*/
borderRadius?: string;
/**
* Invalid border color of root
*
* @designToken selectbutton.invalid.border.color
*/
invalidBorderColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Skeleton Design Tokens
@ -12,29 +11,27 @@
import { ColorSchemeDesignToken } from '..';
export interface SkeletonDesignTokens extends ColorSchemeDesignToken<SkeletonDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken skeleton.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken skeleton.background
*/
background?: string;
/**
* Animation background of root
*
* @designToken skeleton.animation.background
*/
animationBackground?: string;
}
/**
* Border radius of root
*
* @designToken skeleton.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken skeleton.background
*/
background?: string;
/**
* Animation background of root
*
* @designToken skeleton.animation.background
*/
animationBackground?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Slider Design Tokens
@ -12,167 +11,160 @@
import { ColorSchemeDesignToken } from '..';
export interface SliderDesignTokens extends ColorSchemeDesignToken<SliderDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken slider.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken slider.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the track section
*/
* Used to pass tokens of the track section
*/
track?: {
/**
* Background of track
*
* @designToken slider.track.background
*/
background?: string;
/**
* Border radius of track
*
* @designToken slider.track.border.radius
*/
borderRadius?: string;
/**
* Size of track
*
* @designToken slider.track.size
*/
size?: string;
};
/**
* Background of track
*
* @designToken slider.track.background
*/
background?: string;
/**
* Border radius of track
*
* @designToken slider.track.border.radius
*/
borderRadius?: string;
/**
* Size of track
*
* @designToken slider.track.size
*/
size?: string;
}
/**
* Used to pass tokens of the range section
*/
* Used to pass tokens of the range section
*/
range?: {
/**
* Background of range
*
* @designToken slider.range.background
*/
background?: string;
};
/**
* Background of range
*
* @designToken slider.range.background
*/
background?: string;
}
/**
* Used to pass tokens of the handle section
*/
* Used to pass tokens of the handle section
*/
handle?: {
/**
* Width of handle
*
* @designToken slider.handle.width
*/
width?: string;
/**
* Height of handle
*
* @designToken slider.handle.height
*/
height?: string;
/**
* Border radius of handle
*
* @designToken slider.handle.border.radius
*/
borderRadius?: string;
/**
* Background of handle
*
* @designToken slider.handle.background
*/
background?: string;
/**
* Hover background of handle
*
* @designToken slider.handle.hover.background
*/
hoverBackground?: string;
/**
* Content of handle
*/
content?: {
/**
* Content border radius of handle
*
* @designToken slider.handle.content.border.radius
*/
borderRadius?: string;
/**
* Content hover background of handle
*
* @designToken slider.handle.content.hover.background
*/
hoverBackground?: string;
/**
* Content width of handle
*
* @designToken slider.handle.content.width
*/
width?: string;
/**
* Content height of handle
*
* @designToken slider.handle.content.height
*/
height?: string;
/**
* Content shadow of handle
*
* @designToken slider.handle.content.shadow
*/
shadow?: string;
/**
* Width of handle
*
* @designToken slider.handle.width
*/
width?: string;
/**
* Height of handle
*
* @designToken slider.handle.height
*/
height?: string;
/**
* Border radius of handle
*
* @designToken slider.handle.border.radius
*/
borderRadius?: string;
/**
* Background of handle
*
* @designToken slider.handle.background
*/
background?: string;
/**
* Hover background of handle
*
* @designToken slider.handle.hover.background
*/
hoverBackground?: string;
/**
* Content of handle
*/
content?: {
/**
* Content border radius of handle
*
* @designToken slider.handle.content.border.radius
*/
borderRadius?: string;
/**
* Content hover background of handle
*
* @designToken slider.handle.content.hover.background
*/
hoverBackground?: string;
/**
* Content width of handle
*
* @designToken slider.handle.content.width
*/
width?: string;
/**
* Content height of handle
*
* @designToken slider.handle.content.height
*/
height?: string;
/**
* Content shadow of handle
*
* @designToken slider.handle.content.shadow
*/
shadow?: string;
};
/**
* Focus ring of handle
*/
focusRing?: {
/**
* Focus ring width of handle
*
* @designToken slider.handle.focus.ring.width
*/
width?: string;
/**
* Focus ring style of handle
*
* @designToken slider.handle.focus.ring.style
*/
style?: string;
/**
* Focus ring color of handle
*
* @designToken slider.handle.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of handle
*
* @designToken slider.handle.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of handle
*
* @designToken slider.handle.focus.ring.shadow
*/
shadow?: string;
};
/**
* Content background of handle
*
* @designToken slider.handle.content.background
*/
contentBackground?: string;
};
/**
* Focus ring of handle
*/
focusRing?: {
/**
* Focus ring width of handle
*
* @designToken slider.handle.focus.ring.width
*/
width?: string;
/**
* Focus ring style of handle
*
* @designToken slider.handle.focus.ring.style
*/
style?: string;
/**
* Focus ring color of handle
*
* @designToken slider.handle.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of handle
*
* @designToken slider.handle.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of handle
*
* @designToken slider.handle.focus.ring.shadow
*/
shadow?: string;
};
/**
* Content background of handle
*
* @designToken slider.handle.content.background
*/
contentBackground?: string;
}
}

View File

@ -1,4 +1,3 @@
/**
*
* SpeedDial Design Tokens
@ -12,23 +11,21 @@
import { ColorSchemeDesignToken } from '..';
export interface SpeedDialDesignTokens extends ColorSchemeDesignToken<SpeedDialDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Gap of root
*
* @designToken speeddial.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken speeddial.transition.duration
*/
transitionDuration?: string;
}
/**
* Gap of root
*
* @designToken speeddial.gap
*/
gap?: string;
/**
* Transition duration of root
*
* @designToken speeddial.transition.duration
*/
transitionDuration?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* SplitButton Design Tokens
@ -12,29 +11,27 @@
import { ColorSchemeDesignToken } from '..';
export interface SplitButtonDesignTokens extends ColorSchemeDesignToken<SplitButtonDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Border radius of root
*
* @designToken splitbutton.border.radius
*/
borderRadius?: string;
/**
* Rounded border radius of root
*
* @designToken splitbutton.rounded.border.radius
*/
roundedBorderRadius?: string;
/**
* Raised shadow of root
*
* @designToken splitbutton.raised.shadow
*/
raisedShadow?: string;
}
/**
* Border radius of root
*
* @designToken splitbutton.border.radius
*/
borderRadius?: string;
/**
* Rounded border radius of root
*
* @designToken splitbutton.rounded.border.radius
*/
roundedBorderRadius?: string;
/**
* Raised shadow of root
*
* @designToken splitbutton.raised.shadow
*/
raisedShadow?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Splitter Design Tokens
@ -12,107 +11,102 @@
import { ColorSchemeDesignToken } from '..';
export interface SplitterDesignTokens extends ColorSchemeDesignToken<SplitterDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken splitter.background
*/
background?: string;
/**
* Border color of root
*
* @designToken splitter.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken splitter.color
*/
color?: string;
/**
* Transition duration of root
*
* @designToken splitter.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the gutter section
*/
gutter?: {
/**
* Background of gutter
*
* @designToken splitter.gutter.background
*/
background?: string;
}
/**
* Used to pass tokens of the handle section
*/
handle?: {
/**
* Size of handle
*
* @designToken splitter.handle.size
*/
size?: string;
/**
* Background of handle
*
* @designToken splitter.handle.background
*/
background?: string;
/**
* Border radius of handle
*
* @designToken splitter.handle.border.radius
*/
borderRadius?: string;
/**
* Focus ring of handle
*/
focusRing?: {
/**
* Focus ring width of handle
*
* @designToken splitter.handle.focus.ring.width
*/
width?: string;
/**
* Focus ring style of handle
*
* @designToken splitter.handle.focus.ring.style
*/
style?: string;
/**
* Focus ring color of handle
*
* @designToken splitter.handle.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of handle
*
* @designToken splitter.handle.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of handle
*
* @designToken splitter.handle.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken splitter.background
*/
background?: string;
/**
* Border color of root
*
* @designToken splitter.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken splitter.color
*/
color?: string;
/**
* Transition duration of root
*
* @designToken splitter.transition.duration
*/
transitionDuration?: string;
};
/**
* Used to pass tokens of the gutter section
*/
gutter?: {
/**
* Background of gutter
*
* @designToken splitter.gutter.background
*/
background?: string;
};
/**
* Used to pass tokens of the handle section
*/
handle?: {
/**
* Size of handle
*
* @designToken splitter.handle.size
*/
size?: string;
/**
* Background of handle
*
* @designToken splitter.handle.background
*/
background?: string;
/**
* Border radius of handle
*
* @designToken splitter.handle.border.radius
*/
borderRadius?: string;
/**
* Focus ring of handle
*/
focusRing?: {
/**
* Focus ring width of handle
*
* @designToken splitter.handle.focus.ring.width
*/
width?: string;
/**
* Focus ring style of handle
*
* @designToken splitter.handle.focus.ring.style
*/
style?: string;
/**
* Focus ring color of handle
*
* @designToken splitter.handle.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of handle
*
* @designToken splitter.handle.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of handle
*
* @designToken splitter.handle.focus.ring.shadow
*/
shadow?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Stepper Design Tokens
@ -12,269 +11,258 @@
import { ColorSchemeDesignToken } from '..';
export interface StepperDesignTokens extends ColorSchemeDesignToken<StepperDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken stepper.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken stepper.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the separator section
*/
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Background of separator
*
* @designToken stepper.separator.background
*/
background?: string;
/**
* Active background of separator
*
* @designToken stepper.separator.active.background
*/
activeBackground?: string;
/**
* Margin of separator
*
* @designToken stepper.separator.margin
*/
margin?: string;
/**
* Size of separator
*
* @designToken stepper.separator.size
*/
size?: string;
};
/**
* Background of separator
*
* @designToken stepper.separator.background
*/
background?: string;
/**
* Active background of separator
*
* @designToken stepper.separator.active.background
*/
activeBackground?: string;
/**
* Margin of separator
*
* @designToken stepper.separator.margin
*/
margin?: string;
/**
* Size of separator
*
* @designToken stepper.separator.size
*/
size?: string;
}
/**
* Used to pass tokens of the step section
*/
* Used to pass tokens of the step section
*/
step?: {
/**
* Padding of step
*
* @designToken stepper.step.padding
*/
padding?: string;
/**
* Gap of step
*
* @designToken stepper.step.gap
*/
gap?: string;
};
/**
* Padding of step
*
* @designToken stepper.step.padding
*/
padding?: string;
/**
* Gap of step
*
* @designToken stepper.step.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the step header section
*/
* Used to pass tokens of the step header section
*/
stepHeader?: {
/**
* Padding of step header
*
* @designToken stepper.step.header.padding
*/
padding?: string;
/**
* Border radius of step header
*
* @designToken stepper.step.header.border.radius
*/
borderRadius?: string;
/**
* Focus ring of step header
*/
focusRing?: {
/**
* Focus ring width of step header
*
* @designToken stepper.step.header.focus.ring.width
*/
width?: string;
/**
* Focus ring style of step header
*
* @designToken stepper.step.header.focus.ring.style
*/
style?: string;
/**
* Focus ring color of step header
*
* @designToken stepper.step.header.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of step header
*
* @designToken stepper.step.header.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of step header
*
* @designToken stepper.step.header.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of step header
*
* @designToken stepper.step.header.padding
*/
padding?: string;
/**
* Border radius of step header
*
* @designToken stepper.step.header.border.radius
*/
borderRadius?: string;
/**
* Focus ring of step header
*/
focusRing?: {
/**
* Focus ring width of step header
*
* @designToken stepper.step.header.focus.ring.width
*/
width?: string;
/**
* Focus ring style of step header
*
* @designToken stepper.step.header.focus.ring.style
*/
style?: string;
/**
* Focus ring color of step header
*
* @designToken stepper.step.header.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of step header
*
* @designToken stepper.step.header.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of step header
*
* @designToken stepper.step.header.focus.ring.shadow
*/
shadow?: string;
};
/**
* Gap of step header
*
* @designToken stepper.step.header.gap
*/
gap?: string;
};
/**
* Gap of step header
*
* @designToken stepper.step.header.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the step title section
*/
* Used to pass tokens of the step title section
*/
stepTitle?: {
/**
* Color of step title
*
* @designToken stepper.step.title.color
*/
color?: string;
/**
* Active color of step title
*
* @designToken stepper.step.title.active.color
*/
activeColor?: string;
/**
* Font weight of step title
*
* @designToken stepper.step.title.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the step number section
*/
stepNumber?: {
/**
* Background of step number
*
* @designToken stepper.step.number.background
*/
background?: string;
/**
* Active background of step number
*
* @designToken stepper.step.number.active.background
*/
activeBackground?: string;
/**
* Border color of step number
*
* @designToken stepper.step.number.border.color
*/
borderColor?: string;
/**
* Active border color of step number
*
* @designToken stepper.step.number.active.border.color
*/
activeBorderColor?: string;
/**
* Color of step number
*
* @designToken stepper.step.number.color
*/
color?: string;
/**
* Active color of step number
*
* @designToken stepper.step.number.active.color
*/
activeColor?: string;
/**
* Size of step number
*
* @designToken stepper.step.number.size
*/
size?: string;
/**
* Font size of step number
*
* @designToken stepper.step.number.font.size
*/
fontSize?: string;
/**
* Font weight of step number
*
* @designToken stepper.step.number.font.weight
*/
fontWeight?: string;
/**
* Border radius of step number
*
* @designToken stepper.step.number.border.radius
*/
borderRadius?: string;
/**
* Shadow of step number
*
* @designToken stepper.step.number.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the steppanels section
*/
steppanels?: {
/**
* Padding of steppanels
*
* @designToken stepper.steppanels.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the steppanel section
*/
steppanel?: {
/**
* Background of steppanel
*
* @designToken stepper.steppanel.background
*/
background?: string;
/**
* Color of steppanel
*
* @designToken stepper.steppanel.color
*/
color?: string;
/**
* Padding of steppanel
*
* @designToken stepper.steppanel.padding
*/
padding?: string;
/**
* Last of steppanel
*/
last?: {
/**
* Last padding of steppanel
*
* @designToken stepper.steppanel.last.padding
*/
padding?: string;
/**
* Color of step title
*
* @designToken stepper.step.title.color
*/
color?: string;
/**
* Active color of step title
*
* @designToken stepper.step.title.active.color
*/
activeColor?: string;
/**
* Font weight of step title
*
* @designToken stepper.step.title.font.weight
*/
fontWeight?: string;
};
/**
* Used to pass tokens of the step number section
*/
stepNumber?: {
/**
* Background of step number
*
* @designToken stepper.step.number.background
*/
background?: string;
/**
* Active background of step number
*
* @designToken stepper.step.number.active.background
*/
activeBackground?: string;
/**
* Border color of step number
*
* @designToken stepper.step.number.border.color
*/
borderColor?: string;
/**
* Active border color of step number
*
* @designToken stepper.step.number.active.border.color
*/
activeBorderColor?: string;
/**
* Color of step number
*
* @designToken stepper.step.number.color
*/
color?: string;
/**
* Active color of step number
*
* @designToken stepper.step.number.active.color
*/
activeColor?: string;
/**
* Size of step number
*
* @designToken stepper.step.number.size
*/
size?: string;
/**
* Font size of step number
*
* @designToken stepper.step.number.font.size
*/
fontSize?: string;
/**
* Font weight of step number
*
* @designToken stepper.step.number.font.weight
*/
fontWeight?: string;
/**
* Border radius of step number
*
* @designToken stepper.step.number.border.radius
*/
borderRadius?: string;
/**
* Shadow of step number
*
* @designToken stepper.step.number.shadow
*/
shadow?: string;
};
/**
* Used to pass tokens of the steppanels section
*/
steppanels?: {
/**
* Padding of steppanels
*
* @designToken stepper.steppanels.padding
*/
padding?: string;
};
/**
* Used to pass tokens of the steppanel section
*/
steppanel?: {
/**
* Background of steppanel
*
* @designToken stepper.steppanel.background
*/
background?: string;
/**
* Color of steppanel
*
* @designToken stepper.steppanel.color
*/
color?: string;
/**
* Padding of steppanel
*
* @designToken stepper.steppanel.padding
*/
padding?: string;
/**
* Last of steppanel
*/
last?: {
/**
* Last padding of steppanel
*
* @designToken stepper.steppanel.last.padding
*/
padding?: string;
};
};
}
}

View File

@ -1,4 +1,3 @@
/**
*
* Steps Design Tokens
@ -12,179 +11,172 @@
import { ColorSchemeDesignToken } from '..';
export interface StepsDesignTokens extends ColorSchemeDesignToken<StepsDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken steps.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Background of separator
*
* @designToken steps.separator.background
*/
background?: string;
}
/**
* Used to pass tokens of the item link section
*/
itemLink?: {
/**
* Border radius of item link
*
* @designToken steps.item.link.border.radius
*/
borderRadius?: string;
/**
* Focus ring of item link
*/
focusRing?: {
/**
* Focus ring width of item link
*
* @designToken steps.item.link.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item link
*
* @designToken steps.item.link.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item link
*
* @designToken steps.item.link.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item link
*
* @designToken steps.item.link.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item link
*
* @designToken steps.item.link.focus.ring.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken steps.transition.duration
*/
transitionDuration?: string;
};
/**
* Gap of item link
*
* @designToken steps.item.link.gap
*/
gap?: string;
}
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Background of separator
*
* @designToken steps.separator.background
*/
background?: string;
};
/**
* Used to pass tokens of the item label section
*/
* Used to pass tokens of the item link section
*/
itemLink?: {
/**
* Border radius of item link
*
* @designToken steps.item.link.border.radius
*/
borderRadius?: string;
/**
* Focus ring of item link
*/
focusRing?: {
/**
* Focus ring width of item link
*
* @designToken steps.item.link.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item link
*
* @designToken steps.item.link.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item link
*
* @designToken steps.item.link.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item link
*
* @designToken steps.item.link.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item link
*
* @designToken steps.item.link.focus.ring.shadow
*/
shadow?: string;
};
/**
* Gap of item link
*
* @designToken steps.item.link.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the item label section
*/
itemLabel?: {
/**
* Color of item label
*
* @designToken steps.item.label.color
*/
color?: string;
/**
* Active color of item label
*
* @designToken steps.item.label.active.color
*/
activeColor?: string;
/**
* Font weight of item label
*
* @designToken steps.item.label.font.weight
*/
fontWeight?: string;
};
/**
* Color of item label
*
* @designToken steps.item.label.color
*/
color?: string;
/**
* Active color of item label
*
* @designToken steps.item.label.active.color
*/
activeColor?: string;
/**
* Font weight of item label
*
* @designToken steps.item.label.font.weight
*/
fontWeight?: string;
}
/**
* Used to pass tokens of the item number section
*/
* Used to pass tokens of the item number section
*/
itemNumber?: {
/**
* Background of item number
*
* @designToken steps.item.number.background
*/
background?: string;
/**
* Active background of item number
*
* @designToken steps.item.number.active.background
*/
activeBackground?: string;
/**
* Border color of item number
*
* @designToken steps.item.number.border.color
*/
borderColor?: string;
/**
* Active border color of item number
*
* @designToken steps.item.number.active.border.color
*/
activeBorderColor?: string;
/**
* Color of item number
*
* @designToken steps.item.number.color
*/
color?: string;
/**
* Active color of item number
*
* @designToken steps.item.number.active.color
*/
activeColor?: string;
/**
* Size of item number
*
* @designToken steps.item.number.size
*/
size?: string;
/**
* Font size of item number
*
* @designToken steps.item.number.font.size
*/
fontSize?: string;
/**
* Font weight of item number
*
* @designToken steps.item.number.font.weight
*/
fontWeight?: string;
/**
* Border radius of item number
*
* @designToken steps.item.number.border.radius
*/
borderRadius?: string;
/**
* Shadow of item number
*
* @designToken steps.item.number.shadow
*/
shadow?: string;
}
/**
* Background of item number
*
* @designToken steps.item.number.background
*/
background?: string;
/**
* Active background of item number
*
* @designToken steps.item.number.active.background
*/
activeBackground?: string;
/**
* Border color of item number
*
* @designToken steps.item.number.border.color
*/
borderColor?: string;
/**
* Active border color of item number
*
* @designToken steps.item.number.active.border.color
*/
activeBorderColor?: string;
/**
* Color of item number
*
* @designToken steps.item.number.color
*/
color?: string;
/**
* Active color of item number
*
* @designToken steps.item.number.active.color
*/
activeColor?: string;
/**
* Size of item number
*
* @designToken steps.item.number.size
*/
size?: string;
/**
* Font size of item number
*
* @designToken steps.item.number.font.size
*/
fontSize?: string;
/**
* Font weight of item number
*
* @designToken steps.item.number.font.weight
*/
fontWeight?: string;
/**
* Border radius of item number
*
* @designToken steps.item.number.border.radius
*/
borderRadius?: string;
/**
* Shadow of item number
*
* @designToken steps.item.number.shadow
*/
shadow?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Tabmenu Design Tokens
@ -12,215 +11,208 @@
import { ColorSchemeDesignToken } from '..';
export interface TabmenuDesignTokens extends ColorSchemeDesignToken<TabmenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken tabmenu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the tablist section
*/
tablist?: {
/**
* Border width of tablist
*
* @designToken tabmenu.tablist.border.width
*/
borderWidth?: string;
/**
* Background of tablist
*
* @designToken tabmenu.tablist.background
*/
background?: string;
/**
* Border color of tablist
*
* @designToken tabmenu.tablist.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Background of item
*
* @designToken tabmenu.item.background
*/
background?: string;
/**
* Hover background of item
*
* @designToken tabmenu.item.hover.background
*/
hoverBackground?: string;
/**
* Active background of item
*
* @designToken tabmenu.item.active.background
*/
activeBackground?: string;
/**
* Border width of item
*
* @designToken tabmenu.item.border.width
*/
borderWidth?: string;
/**
* Border color of item
*
* @designToken tabmenu.item.border.color
*/
borderColor?: string;
/**
* Hover border color of item
*
* @designToken tabmenu.item.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of item
*
* @designToken tabmenu.item.active.border.color
*/
activeBorderColor?: string;
/**
* Color of item
*
* @designToken tabmenu.item.color
*/
color?: string;
/**
* Hover color of item
*
* @designToken tabmenu.item.hover.color
*/
hoverColor?: string;
/**
* Active color of item
*
* @designToken tabmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken tabmenu.item.padding
*/
padding?: string;
/**
* Font weight of item
*
* @designToken tabmenu.item.font.weight
*/
fontWeight?: string;
/**
* Margin of item
*
* @designToken tabmenu.item.margin
*/
margin?: string;
/**
* Gap of item
*
* @designToken tabmenu.item.gap
*/
gap?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken tabmenu.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken tabmenu.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken tabmenu.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken tabmenu.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken tabmenu.item.focus.ring.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken tabmenu.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the item icon section
*/
* Used to pass tokens of the tablist section
*/
tablist?: {
/**
* Border width of tablist
*
* @designToken tabmenu.tablist.border.width
*/
borderWidth?: string;
/**
* Background of tablist
*
* @designToken tabmenu.tablist.background
*/
background?: string;
/**
* Border color of tablist
*
* @designToken tabmenu.tablist.border.color
*/
borderColor?: string;
};
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Background of item
*
* @designToken tabmenu.item.background
*/
background?: string;
/**
* Hover background of item
*
* @designToken tabmenu.item.hover.background
*/
hoverBackground?: string;
/**
* Active background of item
*
* @designToken tabmenu.item.active.background
*/
activeBackground?: string;
/**
* Border width of item
*
* @designToken tabmenu.item.border.width
*/
borderWidth?: string;
/**
* Border color of item
*
* @designToken tabmenu.item.border.color
*/
borderColor?: string;
/**
* Hover border color of item
*
* @designToken tabmenu.item.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of item
*
* @designToken tabmenu.item.active.border.color
*/
activeBorderColor?: string;
/**
* Color of item
*
* @designToken tabmenu.item.color
*/
color?: string;
/**
* Hover color of item
*
* @designToken tabmenu.item.hover.color
*/
hoverColor?: string;
/**
* Active color of item
*
* @designToken tabmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken tabmenu.item.padding
*/
padding?: string;
/**
* Font weight of item
*
* @designToken tabmenu.item.font.weight
*/
fontWeight?: string;
/**
* Margin of item
*
* @designToken tabmenu.item.margin
*/
margin?: string;
/**
* Gap of item
*
* @designToken tabmenu.item.gap
*/
gap?: string;
/**
* Focus ring of item
*/
focusRing?: {
/**
* Focus ring width of item
*
* @designToken tabmenu.item.focus.ring.width
*/
width?: string;
/**
* Focus ring style of item
*
* @designToken tabmenu.item.focus.ring.style
*/
style?: string;
/**
* Focus ring color of item
*
* @designToken tabmenu.item.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of item
*
* @designToken tabmenu.item.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of item
*
* @designToken tabmenu.item.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the item icon section
*/
itemIcon?: {
/**
* Color of item icon
*
* @designToken tabmenu.item.icon.color
*/
color?: string;
/**
* Hover color of item icon
*
* @designToken tabmenu.item.icon.hover.color
*/
hoverColor?: string;
/**
* Active color of item icon
*
* @designToken tabmenu.item.icon.active.color
*/
activeColor?: string;
};
/**
* Color of item icon
*
* @designToken tabmenu.item.icon.color
*/
color?: string;
/**
* Hover color of item icon
*
* @designToken tabmenu.item.icon.hover.color
*/
hoverColor?: string;
/**
* Active color of item icon
*
* @designToken tabmenu.item.icon.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the active bar section
*/
* Used to pass tokens of the active bar section
*/
activeBar?: {
/**
* Height of active bar
*
* @designToken tabmenu.active.bar.height
*/
height?: string;
/**
* Bottom of active bar
*
* @designToken tabmenu.active.bar.bottom
*/
bottom?: string;
/**
* Background of active bar
*
* @designToken tabmenu.active.bar.background
*/
background?: string;
}
/**
* Height of active bar
*
* @designToken tabmenu.active.bar.height
*/
height?: string;
/**
* Bottom of active bar
*
* @designToken tabmenu.active.bar.bottom
*/
bottom?: string;
/**
* Background of active bar
*
* @designToken tabmenu.active.bar.background
*/
background?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Tabs Design Tokens
@ -12,323 +11,313 @@
import { ColorSchemeDesignToken } from '..';
export interface TabsDesignTokens extends ColorSchemeDesignToken<TabsDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken tabs.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken tabs.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the tablist section
*/
* Used to pass tokens of the tablist section
*/
tablist?: {
/**
* Border width of tablist
*
* @designToken tabs.tablist.border.width
*/
borderWidth?: string;
/**
* Background of tablist
*
* @designToken tabs.tablist.background
*/
background?: string;
/**
* Border color of tablist
*
* @designToken tabs.tablist.border.color
*/
borderColor?: string;
};
/**
* Border width of tablist
*
* @designToken tabs.tablist.border.width
*/
borderWidth?: string;
/**
* Background of tablist
*
* @designToken tabs.tablist.background
*/
background?: string;
/**
* Border color of tablist
*
* @designToken tabs.tablist.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the tab section
*/
* Used to pass tokens of the tab section
*/
tab?: {
/**
* Background of tab
*
* @designToken tabs.tab.background
*/
background?: string;
/**
* Hover background of tab
*
* @designToken tabs.tab.hover.background
*/
hoverBackground?: string;
/**
* Active background of tab
*
* @designToken tabs.tab.active.background
*/
activeBackground?: string;
/**
* Border width of tab
*
* @designToken tabs.tab.border.width
*/
borderWidth?: string;
/**
* Border color of tab
*
* @designToken tabs.tab.border.color
*/
borderColor?: string;
/**
* Hover border color of tab
*
* @designToken tabs.tab.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of tab
*
* @designToken tabs.tab.active.border.color
*/
activeBorderColor?: string;
/**
* Color of tab
*
* @designToken tabs.tab.color
*/
color?: string;
/**
* Hover color of tab
*
* @designToken tabs.tab.hover.color
*/
hoverColor?: string;
/**
* Active color of tab
*
* @designToken tabs.tab.active.color
*/
activeColor?: string;
/**
* Padding of tab
*
* @designToken tabs.tab.padding
*/
padding?: string;
/**
* Font weight of tab
*
* @designToken tabs.tab.font.weight
*/
fontWeight?: string;
/**
* Margin of tab
*
* @designToken tabs.tab.margin
*/
margin?: string;
/**
* Gap of tab
*
* @designToken tabs.tab.gap
*/
gap?: string;
/**
* Focus ring of tab
*/
focusRing?: {
/**
* Focus ring width of tab
*
* @designToken tabs.tab.focus.ring.width
*/
width?: string;
/**
* Focus ring style of tab
*
* @designToken tabs.tab.focus.ring.style
*/
style?: string;
/**
* Focus ring color of tab
*
* @designToken tabs.tab.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of tab
*
* @designToken tabs.tab.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of tab
*
* @designToken tabs.tab.focus.ring.shadow
*/
shadow?: string;
/**
* Background of tab
*
* @designToken tabs.tab.background
*/
background?: string;
/**
* Hover background of tab
*
* @designToken tabs.tab.hover.background
*/
hoverBackground?: string;
/**
* Active background of tab
*
* @designToken tabs.tab.active.background
*/
activeBackground?: string;
/**
* Border width of tab
*
* @designToken tabs.tab.border.width
*/
borderWidth?: string;
/**
* Border color of tab
*
* @designToken tabs.tab.border.color
*/
borderColor?: string;
/**
* Hover border color of tab
*
* @designToken tabs.tab.hover.border.color
*/
hoverBorderColor?: string;
/**
* Active border color of tab
*
* @designToken tabs.tab.active.border.color
*/
activeBorderColor?: string;
/**
* Color of tab
*
* @designToken tabs.tab.color
*/
color?: string;
/**
* Hover color of tab
*
* @designToken tabs.tab.hover.color
*/
hoverColor?: string;
/**
* Active color of tab
*
* @designToken tabs.tab.active.color
*/
activeColor?: string;
/**
* Padding of tab
*
* @designToken tabs.tab.padding
*/
padding?: string;
/**
* Font weight of tab
*
* @designToken tabs.tab.font.weight
*/
fontWeight?: string;
/**
* Margin of tab
*
* @designToken tabs.tab.margin
*/
margin?: string;
/**
* Gap of tab
*
* @designToken tabs.tab.gap
*/
gap?: string;
/**
* Focus ring of tab
*/
focusRing?: {
/**
* Focus ring width of tab
*
* @designToken tabs.tab.focus.ring.width
*/
width?: string;
/**
* Focus ring style of tab
*
* @designToken tabs.tab.focus.ring.style
*/
style?: string;
/**
* Focus ring color of tab
*
* @designToken tabs.tab.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of tab
*
* @designToken tabs.tab.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of tab
*
* @designToken tabs.tab.focus.ring.shadow
*/
shadow?: string;
};
};
}
/**
* Used to pass tokens of the tabpanel section
*/
* Used to pass tokens of the tabpanel section
*/
tabpanel?: {
/**
* Background of tabpanel
*
* @designToken tabs.tabpanel.background
*/
background?: string;
/**
* Color of tabpanel
*
* @designToken tabs.tabpanel.color
*/
color?: string;
/**
* Padding of tabpanel
*
* @designToken tabs.tabpanel.padding
*/
padding?: string;
/**
* Focus ring of tabpanel
*/
focusRing?: {
/**
* Focus ring width of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.width
*/
width?: string;
/**
* Focus ring style of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.style
*/
style?: string;
/**
* Focus ring color of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.shadow
*/
shadow?: string;
/**
* Background of tabpanel
*
* @designToken tabs.tabpanel.background
*/
background?: string;
/**
* Color of tabpanel
*
* @designToken tabs.tabpanel.color
*/
color?: string;
/**
* Padding of tabpanel
*
* @designToken tabs.tabpanel.padding
*/
padding?: string;
/**
* Focus ring of tabpanel
*/
focusRing?: {
/**
* Focus ring width of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.width
*/
width?: string;
/**
* Focus ring style of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.style
*/
style?: string;
/**
* Focus ring color of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of tabpanel
*
* @designToken tabs.tabpanel.focus.ring.shadow
*/
shadow?: string;
};
};
}
/**
* Used to pass tokens of the nav button section
*/
* Used to pass tokens of the nav button section
*/
navButton?: {
/**
* Background of nav button
*
* @designToken tabs.nav.button.background
*/
background?: string;
/**
* Color of nav button
*
* @designToken tabs.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken tabs.nav.button.hover.color
*/
hoverColor?: string;
/**
* Width of nav button
*
* @designToken tabs.nav.button.width
*/
width?: string;
/**
* Focus ring of nav button
*/
focusRing?: {
/**
* Focus ring width of nav button
*
* @designToken tabs.nav.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of nav button
*
* @designToken tabs.nav.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of nav button
*
* @designToken tabs.nav.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of nav button
*
* @designToken tabs.nav.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of nav button
*
* @designToken tabs.nav.button.focus.ring.shadow
*/
shadow?: string;
/**
* Background of nav button
*
* @designToken tabs.nav.button.background
*/
background?: string;
/**
* Color of nav button
*
* @designToken tabs.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken tabs.nav.button.hover.color
*/
hoverColor?: string;
/**
* Width of nav button
*
* @designToken tabs.nav.button.width
*/
width?: string;
/**
* Focus ring of nav button
*/
focusRing?: {
/**
* Focus ring width of nav button
*
* @designToken tabs.nav.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of nav button
*
* @designToken tabs.nav.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of nav button
*
* @designToken tabs.nav.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of nav button
*
* @designToken tabs.nav.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of nav button
*
* @designToken tabs.nav.button.focus.ring.shadow
*/
shadow?: string;
};
/**
* Box shadow of nav button
*
* @designToken tabs.nav.button.box.shadow
*/
boxShadow?: string;
};
/**
* Box shadow of nav button
*
* @designToken tabs.nav.button.box.shadow
*/
boxShadow?: string;
}
/**
* Used to pass tokens of the active bar section
*/
* Used to pass tokens of the active bar section
*/
activeBar?: {
/**
* Height of active bar
*
* @designToken tabs.active.bar.height
*/
height?: string;
/**
* Bottom of active bar
*
* @designToken tabs.active.bar.bottom
*/
bottom?: string;
/**
* Background of active bar
*
* @designToken tabs.active.bar.background
*/
background?: string;
}
/**
* Height of active bar
*
* @designToken tabs.active.bar.height
*/
height?: string;
/**
* Bottom of active bar
*
* @designToken tabs.active.bar.bottom
*/
bottom?: string;
/**
* Background of active bar
*
* @designToken tabs.active.bar.background
*/
background?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* TabView Design Tokens
@ -12,119 +11,113 @@
import { ColorSchemeDesignToken } from '..';
export interface TabViewDesignTokens extends ColorSchemeDesignToken<TabViewDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Transition duration of root
*
* @designToken tabview.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken tabview.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the tab list section
*/
* Used to pass tokens of the tab list section
*/
tabList?: {
/**
* Background of tab list
*
* @designToken tabview.tab.list.background
*/
background?: string;
/**
* Border color of tab list
*
* @designToken tabview.tab.list.border.color
*/
borderColor?: string;
};
/**
* Background of tab list
*
* @designToken tabview.tab.list.background
*/
background?: string;
/**
* Border color of tab list
*
* @designToken tabview.tab.list.border.color
*/
borderColor?: string;
}
/**
* Used to pass tokens of the tab section
*/
* Used to pass tokens of the tab section
*/
tab?: {
/**
* Border color of tab
*
* @designToken tabview.tab.border.color
*/
borderColor?: string;
/**
* Active border color of tab
*
* @designToken tabview.tab.active.border.color
*/
activeBorderColor?: string;
/**
* Color of tab
*
* @designToken tabview.tab.color
*/
color?: string;
/**
* Hover color of tab
*
* @designToken tabview.tab.hover.color
*/
hoverColor?: string;
/**
* Active color of tab
*
* @designToken tabview.tab.active.color
*/
activeColor?: string;
};
/**
* Border color of tab
*
* @designToken tabview.tab.border.color
*/
borderColor?: string;
/**
* Active border color of tab
*
* @designToken tabview.tab.active.border.color
*/
activeBorderColor?: string;
/**
* Color of tab
*
* @designToken tabview.tab.color
*/
color?: string;
/**
* Hover color of tab
*
* @designToken tabview.tab.hover.color
*/
hoverColor?: string;
/**
* Active color of tab
*
* @designToken tabview.tab.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the tab panel section
*/
* Used to pass tokens of the tab panel section
*/
tabPanel?: {
/**
* Background of tab panel
*
* @designToken tabview.tab.panel.background
*/
background?: string;
/**
* Color of tab panel
*
* @designToken tabview.tab.panel.color
*/
color?: string;
};
/**
* Background of tab panel
*
* @designToken tabview.tab.panel.background
*/
background?: string;
/**
* Color of tab panel
*
* @designToken tabview.tab.panel.color
*/
color?: string;
}
/**
* Used to pass tokens of the nav button section
*/
* Used to pass tokens of the nav button section
*/
navButton?: {
/**
* Background of nav button
*
* @designToken tabview.nav.button.background
*/
background?: string;
/**
* Color of nav button
*
* @designToken tabview.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken tabview.nav.button.hover.color
*/
hoverColor?: string;
/**
* Box shadow of nav button
*
* @designToken tabview.nav.button.box.shadow
*/
boxShadow?: string;
}
/**
* Background of nav button
*
* @designToken tabview.nav.button.background
*/
background?: string;
/**
* Color of nav button
*
* @designToken tabview.nav.button.color
*/
color?: string;
/**
* Hover color of nav button
*
* @designToken tabview.nav.button.hover.color
*/
hoverColor?: string;
/**
* Box shadow of nav button
*
* @designToken tabview.nav.button.box.shadow
*/
boxShadow?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Tag Design Tokens
@ -12,185 +11,175 @@
import { ColorSchemeDesignToken } from '..';
export interface TagDesignTokens extends ColorSchemeDesignToken<TagDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Font size of root
*
* @designToken tag.font.size
*/
fontSize?: string;
/**
* Font weight of root
*
* @designToken tag.font.weight
*/
fontWeight?: string;
/**
* Padding of root
*
* @designToken tag.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken tag.gap
*/
gap?: string;
/**
* Border radius of root
*
* @designToken tag.border.radius
*/
borderRadius?: string;
/**
* Rounded border radius of root
*
* @designToken tag.rounded.border.radius
*/
roundedBorderRadius?: string;
};
/**
* Font size of root
*
* @designToken tag.font.size
*/
fontSize?: string;
/**
* Font weight of root
*
* @designToken tag.font.weight
*/
fontWeight?: string;
/**
* Padding of root
*
* @designToken tag.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken tag.gap
*/
gap?: string;
/**
* Border radius of root
*
* @designToken tag.border.radius
*/
borderRadius?: string;
/**
* Rounded border radius of root
*
* @designToken tag.rounded.border.radius
*/
roundedBorderRadius?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Size of icon
*
* @designToken tag.icon.size
*/
size?: string;
};
/**
* Size of icon
*
* @designToken tag.icon.size
*/
size?: string;
}
/**
* Used to pass tokens of the primary section
*/
* Used to pass tokens of the primary section
*/
primary?: {
/**
* Background of primary
*
* @designToken tag.primary.background
*/
background?: string;
/**
* Color of primary
*
* @designToken tag.primary.color
*/
color?: string;
};
/**
* Background of primary
*
* @designToken tag.primary.background
*/
background?: string;
/**
* Color of primary
*
* @designToken tag.primary.color
*/
color?: string;
}
/**
* Used to pass tokens of the secondary section
*/
* Used to pass tokens of the secondary section
*/
secondary?: {
/**
* Background of secondary
*
* @designToken tag.secondary.background
*/
background?: string;
/**
* Color of secondary
*
* @designToken tag.secondary.color
*/
color?: string;
};
/**
* Background of secondary
*
* @designToken tag.secondary.background
*/
background?: string;
/**
* Color of secondary
*
* @designToken tag.secondary.color
*/
color?: string;
}
/**
* Used to pass tokens of the success section
*/
* Used to pass tokens of the success section
*/
success?: {
/**
* Background of success
*
* @designToken tag.success.background
*/
background?: string;
/**
* Color of success
*
* @designToken tag.success.color
*/
color?: string;
};
/**
* Background of success
*
* @designToken tag.success.background
*/
background?: string;
/**
* Color of success
*
* @designToken tag.success.color
*/
color?: string;
}
/**
* Used to pass tokens of the info section
*/
* Used to pass tokens of the info section
*/
info?: {
/**
* Background of info
*
* @designToken tag.info.background
*/
background?: string;
/**
* Color of info
*
* @designToken tag.info.color
*/
color?: string;
};
/**
* Background of info
*
* @designToken tag.info.background
*/
background?: string;
/**
* Color of info
*
* @designToken tag.info.color
*/
color?: string;
}
/**
* Used to pass tokens of the warn section
*/
* Used to pass tokens of the warn section
*/
warn?: {
/**
* Background of warn
*
* @designToken tag.warn.background
*/
background?: string;
/**
* Color of warn
*
* @designToken tag.warn.color
*/
color?: string;
};
/**
* Background of warn
*
* @designToken tag.warn.background
*/
background?: string;
/**
* Color of warn
*
* @designToken tag.warn.color
*/
color?: string;
}
/**
* Used to pass tokens of the danger section
*/
* Used to pass tokens of the danger section
*/
danger?: {
/**
* Background of danger
*
* @designToken tag.danger.background
*/
background?: string;
/**
* Color of danger
*
* @designToken tag.danger.color
*/
color?: string;
};
/**
* Background of danger
*
* @designToken tag.danger.background
*/
background?: string;
/**
* Color of danger
*
* @designToken tag.danger.color
*/
color?: string;
}
/**
* Used to pass tokens of the contrast section
*/
* Used to pass tokens of the contrast section
*/
contrast?: {
/**
* Background of contrast
*
* @designToken tag.contrast.background
*/
background?: string;
/**
* Color of contrast
*
* @designToken tag.contrast.color
*/
color?: string;
}
/**
* Background of contrast
*
* @designToken tag.contrast.background
*/
background?: string;
/**
* Color of contrast
*
* @designToken tag.contrast.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Terminal Design Tokens
@ -12,71 +11,67 @@
import { ColorSchemeDesignToken } from '..';
export interface TerminalDesignTokens extends ColorSchemeDesignToken<TerminalDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken terminal.background
*/
background?: string;
/**
* Border color of root
*
* @designToken terminal.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken terminal.color
*/
color?: string;
/**
* Height of root
*
* @designToken terminal.height
*/
height?: string;
/**
* Padding of root
*
* @designToken terminal.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken terminal.border.radius
*/
borderRadius?: string;
};
/**
* Background of root
*
* @designToken terminal.background
*/
background?: string;
/**
* Border color of root
*
* @designToken terminal.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken terminal.color
*/
color?: string;
/**
* Height of root
*
* @designToken terminal.height
*/
height?: string;
/**
* Padding of root
*
* @designToken terminal.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken terminal.border.radius
*/
borderRadius?: string;
}
/**
* Used to pass tokens of the prompt section
*/
* Used to pass tokens of the prompt section
*/
prompt?: {
/**
* Gap of prompt
*
* @designToken terminal.prompt.gap
*/
gap?: string;
};
/**
* Gap of prompt
*
* @designToken terminal.prompt.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the command response section
*/
* Used to pass tokens of the command response section
*/
commandResponse?: {
/**
* Margin of command response
*
* @designToken terminal.command.response.margin
*/
margin?: string;
}
/**
* Margin of command response
*
* @designToken terminal.command.response.margin
*/
margin?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Textarea Design Tokens
@ -12,143 +11,140 @@
import { ColorSchemeDesignToken } from '..';
export interface TextareaDesignTokens extends ColorSchemeDesignToken<TextareaDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken textarea.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken textarea.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken textarea.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken textarea.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken textarea.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken textarea.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken textarea.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken textarea.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken textarea.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken textarea.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken textarea.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken textarea.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken textarea.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken textarea.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken textarea.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken textarea.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken textarea.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken textarea.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken textarea.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken textarea.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken textarea.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken textarea.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken textarea.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken textarea.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken textarea.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken textarea.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken textarea.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken textarea.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken textarea.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken textarea.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken textarea.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken textarea.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken textarea.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken textarea.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken textarea.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken textarea.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken textarea.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken textarea.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken textarea.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken textarea.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken textarea.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken textarea.transition.duration
*/
transitionDuration?: string;
}
}

View File

@ -1,4 +1,3 @@
/**
*
* TieredMenu Design Tokens
@ -12,215 +11,207 @@
import { ColorSchemeDesignToken } from '..';
export interface TieredMenuDesignTokens extends ColorSchemeDesignToken<TieredMenuDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken tieredmenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken tieredmenu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken tieredmenu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken tieredmenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken tieredmenu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken tieredmenu.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken tieredmenu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken tieredmenu.list.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken tieredmenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken tieredmenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken tieredmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken tieredmenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken tieredmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken tieredmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken tieredmenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken tieredmenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken tieredmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken tieredmenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken tieredmenu.item.icon.active.color
*/
activeColor?: string;
/**
* Background of root
*
* @designToken tieredmenu.background
*/
background?: string;
/**
* Border color of root
*
* @designToken tieredmenu.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken tieredmenu.color
*/
color?: string;
/**
* Border radius of root
*
* @designToken tieredmenu.border.radius
*/
borderRadius?: string;
/**
* Shadow of root
*
* @designToken tieredmenu.shadow
*/
shadow?: string;
/**
* Transition duration of root
*
* @designToken tieredmenu.transition.duration
*/
transitionDuration?: string;
};
}
/**
* Used to pass tokens of the submenu label section
*/
* Used to pass tokens of the list section
*/
list?: {
/**
* Padding of list
*
* @designToken tieredmenu.list.padding
*/
padding?: string;
/**
* Gap of list
*
* @designToken tieredmenu.list.gap
*/
gap?: string;
};
/**
* Used to pass tokens of the item section
*/
item?: {
/**
* Focus background of item
*
* @designToken tieredmenu.item.focus.background
*/
focusBackground?: string;
/**
* Active background of item
*
* @designToken tieredmenu.item.active.background
*/
activeBackground?: string;
/**
* Color of item
*
* @designToken tieredmenu.item.color
*/
color?: string;
/**
* Focus color of item
*
* @designToken tieredmenu.item.focus.color
*/
focusColor?: string;
/**
* Active color of item
*
* @designToken tieredmenu.item.active.color
*/
activeColor?: string;
/**
* Padding of item
*
* @designToken tieredmenu.item.padding
*/
padding?: string;
/**
* Border radius of item
*
* @designToken tieredmenu.item.border.radius
*/
borderRadius?: string;
/**
* Gap of item
*
* @designToken tieredmenu.item.gap
*/
gap?: string;
/**
* Icon of item
*/
icon?: {
/**
* Icon color of item
*
* @designToken tieredmenu.item.icon.color
*/
color?: string;
/**
* Icon focus color of item
*
* @designToken tieredmenu.item.icon.focus.color
*/
focusColor?: string;
/**
* Icon active color of item
*
* @designToken tieredmenu.item.icon.active.color
*/
activeColor?: string;
};
};
/**
* Used to pass tokens of the submenu label section
*/
submenuLabel?: {
/**
* Padding of submenu label
*
* @designToken tieredmenu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken tieredmenu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken tieredmenu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken tieredmenu.submenu.label.color
*/
color?: string;
};
/**
* Padding of submenu label
*
* @designToken tieredmenu.submenu.label.padding
*/
padding?: string;
/**
* Font weight of submenu label
*
* @designToken tieredmenu.submenu.label.font.weight
*/
fontWeight?: string;
/**
* Background of submenu label
*
* @designToken tieredmenu.submenu.label.background
*/
background?: string;
/**
* Color of submenu label
*
* @designToken tieredmenu.submenu.label.color
*/
color?: string;
}
/**
* Used to pass tokens of the submenu icon section
*/
* Used to pass tokens of the submenu icon section
*/
submenuIcon?: {
/**
* Size of submenu icon
*
* @designToken tieredmenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken tieredmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken tieredmenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken tieredmenu.submenu.icon.active.color
*/
activeColor?: string;
};
/**
* Size of submenu icon
*
* @designToken tieredmenu.submenu.icon.size
*/
size?: string;
/**
* Color of submenu icon
*
* @designToken tieredmenu.submenu.icon.color
*/
color?: string;
/**
* Focus color of submenu icon
*
* @designToken tieredmenu.submenu.icon.focus.color
*/
focusColor?: string;
/**
* Active color of submenu icon
*
* @designToken tieredmenu.submenu.icon.active.color
*/
activeColor?: string;
}
/**
* Used to pass tokens of the separator section
*/
* Used to pass tokens of the separator section
*/
separator?: {
/**
* Border color of separator
*
* @designToken tieredmenu.separator.border.color
*/
borderColor?: string;
}
/**
* Border color of separator
*
* @designToken tieredmenu.separator.border.color
*/
borderColor?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Timeline Design Tokens
@ -12,137 +11,128 @@
import { ColorSchemeDesignToken } from '..';
export interface TimelineDesignTokens extends ColorSchemeDesignToken<TimelineDesignTokens> {
/**
* Used to pass tokens of the event section
*/
* Used to pass tokens of the event section
*/
event?: {
/**
* Min height of event
*
* @designToken timeline.event.min.height
*/
minHeight?: string;
};
/**
* Min height of event
*
* @designToken timeline.event.min.height
*/
minHeight?: string;
}
/**
* Used to pass tokens of the horizontal section
*/
* Used to pass tokens of the horizontal section
*/
horizontal?: {
/**
* Event content of horizontal
*/
eventContent?: {
/**
* Event content padding of horizontal
*
* @designToken timeline.horizontal.event.content.padding
*/
padding?: string;
/**
* Event content of horizontal
*/
eventContent?: {
/**
* Event content padding of horizontal
*
* @designToken timeline.horizontal.event.content.padding
*/
padding?: string;
};
};
}
/**
* Used to pass tokens of the vertical section
*/
* Used to pass tokens of the vertical section
*/
vertical?: {
/**
* Event content of vertical
*/
eventContent?: {
/**
* Event content padding of vertical
*
* @designToken timeline.vertical.event.content.padding
*/
padding?: string;
/**
* Event content of vertical
*/
eventContent?: {
/**
* Event content padding of vertical
*
* @designToken timeline.vertical.event.content.padding
*/
padding?: string;
};
};
}
/**
* Used to pass tokens of the event marker section
*/
* Used to pass tokens of the event marker section
*/
eventMarker?: {
/**
* Size of event marker
*
* @designToken timeline.event.marker.size
*/
size?: string;
/**
* Border radius of event marker
*
* @designToken timeline.event.marker.border.radius
*/
borderRadius?: string;
/**
* Border width of event marker
*
* @designToken timeline.event.marker.border.width
*/
borderWidth?: string;
/**
* Background of event marker
*
* @designToken timeline.event.marker.background
*/
background?: string;
/**
* Border color of event marker
*
* @designToken timeline.event.marker.border.color
*/
borderColor?: string;
/**
* Content of event marker
*/
content?: {
/**
* Content border radius of event marker
*
* @designToken timeline.event.marker.content.border.radius
*/
borderRadius?: string;
/**
* Content size of event marker
*
* @designToken timeline.event.marker.content.size
*/
size?: string;
/**
* Content background of event marker
*
* @designToken timeline.event.marker.content.background
*/
background?: string;
/**
* Content inset shadow of event marker
*
* @designToken timeline.event.marker.content.inset.shadow
*/
insetShadow?: string;
/**
* Size of event marker
*
* @designToken timeline.event.marker.size
*/
size?: string;
/**
* Border radius of event marker
*
* @designToken timeline.event.marker.border.radius
*/
borderRadius?: string;
/**
* Border width of event marker
*
* @designToken timeline.event.marker.border.width
*/
borderWidth?: string;
/**
* Background of event marker
*
* @designToken timeline.event.marker.background
*/
background?: string;
/**
* Border color of event marker
*
* @designToken timeline.event.marker.border.color
*/
borderColor?: string;
/**
* Content of event marker
*/
content?: {
/**
* Content border radius of event marker
*
* @designToken timeline.event.marker.content.border.radius
*/
borderRadius?: string;
/**
* Content size of event marker
*
* @designToken timeline.event.marker.content.size
*/
size?: string;
/**
* Content background of event marker
*
* @designToken timeline.event.marker.content.background
*/
background?: string;
/**
* Content inset shadow of event marker
*
* @designToken timeline.event.marker.content.inset.shadow
*/
insetShadow?: string;
};
};
}
/**
* Used to pass tokens of the event connector section
*/
* Used to pass tokens of the event connector section
*/
eventConnector?: {
/**
* Color of event connector
*
* @designToken timeline.event.connector.color
*/
color?: string;
/**
* Size of event connector
*
* @designToken timeline.event.connector.size
*/
size?: string;
}
/**
* Color of event connector
*
* @designToken timeline.event.connector.color
*/
color?: string;
/**
* Size of event connector
*
* @designToken timeline.event.connector.size
*/
size?: string;
};
}

File diff suppressed because it is too large Load Diff

View File

@ -1,4 +1,3 @@
/**
*
* ToggleButton Design Tokens
@ -12,209 +11,204 @@
import { ColorSchemeDesignToken } from '..';
export interface ToggleButtonDesignTokens extends ColorSchemeDesignToken<ToggleButtonDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Padding of root
*
* @designToken togglebutton.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken togglebutton.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken togglebutton.gap
*/
gap?: string;
/**
* Font weight of root
*
* @designToken togglebutton.font.weight
*/
fontWeight?: string;
/**
* Disabled background of root
*
* @designToken togglebutton.disabled.background
*/
disabledBackground?: string;
/**
* Disabled border color of root
*
* @designToken togglebutton.disabled.border.color
*/
disabledBorderColor?: string;
/**
* Disabled color of root
*
* @designToken togglebutton.disabled.color
*/
disabledColor?: string;
/**
* Invalid border color of root
*
* @designToken togglebutton.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken togglebutton.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken togglebutton.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken togglebutton.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken togglebutton.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken togglebutton.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken togglebutton.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken togglebutton.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken togglebutton.gap
*/
gap?: string;
/**
* Font weight of root
*
* @designToken togglebutton.font.weight
*/
fontWeight?: string;
/**
* Disabled background of root
*
* @designToken togglebutton.disabled.background
*/
disabledBackground?: string;
/**
* Disabled border color of root
*
* @designToken togglebutton.disabled.border.color
*/
disabledBorderColor?: string;
/**
* Disabled color of root
*
* @designToken togglebutton.disabled.color
*/
disabledColor?: string;
/**
* Invalid border color of root
*
* @designToken togglebutton.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken togglebutton.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken togglebutton.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken togglebutton.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken togglebutton.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken togglebutton.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken togglebutton.transition.duration
*/
transitionDuration?: string;
/**
* Background of root
*
* @designToken togglebutton.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken togglebutton.checked.background
*/
checkedBackground?: string;
/**
* Hover background of root
*
* @designToken togglebutton.hover.background
*/
hoverBackground?: string;
/**
* Border color of root
*
* @designToken togglebutton.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken togglebutton.color
*/
color?: string;
/**
* Hover color of root
*
* @designToken togglebutton.hover.color
*/
hoverColor?: string;
/**
* Checked color of root
*
* @designToken togglebutton.checked.color
*/
checkedColor?: string;
/**
* Checked border color of root
*
* @designToken togglebutton.checked.border.color
*/
checkedBorderColor?: string;
};
/**
* Transition duration of root
*
* @designToken togglebutton.transition.duration
*/
transitionDuration?: string;
/**
* Background of root
*
* @designToken togglebutton.background
*/
background?: string;
/**
* Checked background of root
*
* @designToken togglebutton.checked.background
*/
checkedBackground?: string;
/**
* Hover background of root
*
* @designToken togglebutton.hover.background
*/
hoverBackground?: string;
/**
* Border color of root
*
* @designToken togglebutton.border.color
*/
borderColor?: string;
/**
* Color of root
*
* @designToken togglebutton.color
*/
color?: string;
/**
* Hover color of root
*
* @designToken togglebutton.hover.color
*/
hoverColor?: string;
/**
* Checked color of root
*
* @designToken togglebutton.checked.color
*/
checkedColor?: string;
/**
* Checked border color of root
*
* @designToken togglebutton.checked.border.color
*/
checkedBorderColor?: string;
}
/**
* Used to pass tokens of the icon section
*/
* Used to pass tokens of the icon section
*/
icon?: {
/**
* Disabled color of icon
*
* @designToken togglebutton.icon.disabled.color
*/
disabledColor?: string;
/**
* Color of icon
*
* @designToken togglebutton.icon.color
*/
color?: string;
/**
* Hover color of icon
*
* @designToken togglebutton.icon.hover.color
*/
hoverColor?: string;
/**
* Checked color of icon
*
* @designToken togglebutton.icon.checked.color
*/
checkedColor?: string;
};
/**
* Disabled color of icon
*
* @designToken togglebutton.icon.disabled.color
*/
disabledColor?: string;
/**
* Color of icon
*
* @designToken togglebutton.icon.color
*/
color?: string;
/**
* Hover color of icon
*
* @designToken togglebutton.icon.hover.color
*/
hoverColor?: string;
/**
* Checked color of icon
*
* @designToken togglebutton.icon.checked.color
*/
checkedColor?: string;
}
/**
* Used to pass tokens of the content section
*/
* Used to pass tokens of the content section
*/
content?: {
/**
* Left of content
*
* @designToken togglebutton.content.left
*/
left?: string;
/**
* Top of content
*
* @designToken togglebutton.content.top
*/
top?: string;
/**
* Checked shadow of content
*
* @designToken togglebutton.content.checked.shadow
*/
checkedShadow?: string;
/**
* Checked background of content
*
* @designToken togglebutton.content.checked.background
*/
checkedBackground?: string;
}
/**
* Left of content
*
* @designToken togglebutton.content.left
*/
left?: string;
/**
* Top of content
*
* @designToken togglebutton.content.top
*/
top?: string;
/**
* Checked shadow of content
*
* @designToken togglebutton.content.checked.shadow
*/
checkedShadow?: string;
/**
* Checked background of content
*
* @designToken togglebutton.content.checked.background
*/
checkedBackground?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* ToggleSwitch Design Tokens
@ -12,191 +11,187 @@
import { ColorSchemeDesignToken } from '..';
export interface ToggleSwitchDesignTokens extends ColorSchemeDesignToken<ToggleSwitchDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Width of root
*
* @designToken toggleswitch.width
*/
width?: string;
/**
* Height of root
*
* @designToken toggleswitch.height
*/
height?: string;
/**
* Border radius of root
*
* @designToken toggleswitch.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken toggleswitch.gap
*/
gap?: string;
/**
* Shadow of root
*
* @designToken toggleswitch.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken toggleswitch.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken toggleswitch.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken toggleswitch.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken toggleswitch.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken toggleswitch.focus.ring.shadow
*/
shadow?: string;
/**
* Width of root
*
* @designToken toggleswitch.width
*/
width?: string;
/**
* Height of root
*
* @designToken toggleswitch.height
*/
height?: string;
/**
* Border radius of root
*
* @designToken toggleswitch.border.radius
*/
borderRadius?: string;
/**
* Gap of root
*
* @designToken toggleswitch.gap
*/
gap?: string;
/**
* Shadow of root
*
* @designToken toggleswitch.shadow
*/
shadow?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken toggleswitch.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken toggleswitch.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken toggleswitch.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken toggleswitch.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken toggleswitch.focus.ring.shadow
*/
shadow?: string;
};
/**
* Border width of root
*
* @designToken toggleswitch.border.width
*/
borderWidth?: string;
/**
* Border color of root
*
* @designToken toggleswitch.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken toggleswitch.hover.border.color
*/
hoverBorderColor?: string;
/**
* Checked border color of root
*
* @designToken toggleswitch.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken toggleswitch.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken toggleswitch.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Transition duration of root
*
* @designToken toggleswitch.transition.duration
*/
transitionDuration?: string;
/**
* Slide duration of root
*
* @designToken toggleswitch.slide.duration
*/
slideDuration?: string;
/**
* Background of root
*
* @designToken toggleswitch.background
*/
background?: string;
/**
* Hover background of root
*
* @designToken toggleswitch.hover.background
*/
hoverBackground?: string;
/**
* Checked background of root
*
* @designToken toggleswitch.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken toggleswitch.checked.hover.background
*/
checkedHoverBackground?: string;
};
/**
* Border width of root
*
* @designToken toggleswitch.border.width
*/
borderWidth?: string;
/**
* Border color of root
*
* @designToken toggleswitch.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken toggleswitch.hover.border.color
*/
hoverBorderColor?: string;
/**
* Checked border color of root
*
* @designToken toggleswitch.checked.border.color
*/
checkedBorderColor?: string;
/**
* Checked hover border color of root
*
* @designToken toggleswitch.checked.hover.border.color
*/
checkedHoverBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken toggleswitch.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Transition duration of root
*
* @designToken toggleswitch.transition.duration
*/
transitionDuration?: string;
/**
* Slide duration of root
*
* @designToken toggleswitch.slide.duration
*/
slideDuration?: string;
/**
* Background of root
*
* @designToken toggleswitch.background
*/
background?: string;
/**
* Hover background of root
*
* @designToken toggleswitch.hover.background
*/
hoverBackground?: string;
/**
* Checked background of root
*
* @designToken toggleswitch.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of root
*
* @designToken toggleswitch.checked.hover.background
*/
checkedHoverBackground?: string;
}
/**
* Used to pass tokens of the handle section
*/
* Used to pass tokens of the handle section
*/
handle?: {
/**
* Border radius of handle
*
* @designToken toggleswitch.handle.border.radius
*/
borderRadius?: string;
/**
* Size of handle
*
* @designToken toggleswitch.handle.size
*/
size?: string;
/**
* Background of handle
*
* @designToken toggleswitch.handle.background
*/
background?: string;
/**
* Hover background of handle
*
* @designToken toggleswitch.handle.hover.background
*/
hoverBackground?: string;
/**
* Checked background of handle
*
* @designToken toggleswitch.handle.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of handle
*
* @designToken toggleswitch.handle.checked.hover.background
*/
checkedHoverBackground?: string;
}
/**
* Border radius of handle
*
* @designToken toggleswitch.handle.border.radius
*/
borderRadius?: string;
/**
* Size of handle
*
* @designToken toggleswitch.handle.size
*/
size?: string;
/**
* Background of handle
*
* @designToken toggleswitch.handle.background
*/
background?: string;
/**
* Hover background of handle
*
* @designToken toggleswitch.handle.hover.background
*/
hoverBackground?: string;
/**
* Checked background of handle
*
* @designToken toggleswitch.handle.checked.background
*/
checkedBackground?: string;
/**
* Checked hover background of handle
*
* @designToken toggleswitch.handle.checked.hover.background
*/
checkedHoverBackground?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Toolbar Design Tokens
@ -12,47 +11,45 @@
import { ColorSchemeDesignToken } from '..';
export interface ToolbarDesignTokens extends ColorSchemeDesignToken<ToolbarDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken toolbar.background
*/
background?: string;
/**
* Border color of root
*
* @designToken toolbar.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken toolbar.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken toolbar.color
*/
color?: string;
/**
* Gap of root
*
* @designToken toolbar.gap
*/
gap?: string;
/**
* Padding of root
*
* @designToken toolbar.padding
*/
padding?: string;
}
/**
* Background of root
*
* @designToken toolbar.background
*/
background?: string;
/**
* Border color of root
*
* @designToken toolbar.border.color
*/
borderColor?: string;
/**
* Border radius of root
*
* @designToken toolbar.border.radius
*/
borderRadius?: string;
/**
* Color of root
*
* @designToken toolbar.color
*/
color?: string;
/**
* Gap of root
*
* @designToken toolbar.gap
*/
gap?: string;
/**
* Padding of root
*
* @designToken toolbar.padding
*/
padding?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Tooltip Design Tokens
@ -12,53 +11,51 @@
import { ColorSchemeDesignToken } from '..';
export interface TooltipDesignTokens extends ColorSchemeDesignToken<TooltipDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Max width of root
*
* @designToken tooltip.max.width
*/
maxWidth?: string;
/**
* Gutter of root
*
* @designToken tooltip.gutter
*/
gutter?: string;
/**
* Shadow of root
*
* @designToken tooltip.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken tooltip.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken tooltip.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken tooltip.background
*/
background?: string;
/**
* Color of root
*
* @designToken tooltip.color
*/
color?: string;
}
/**
* Max width of root
*
* @designToken tooltip.max.width
*/
maxWidth?: string;
/**
* Gutter of root
*
* @designToken tooltip.gutter
*/
gutter?: string;
/**
* Shadow of root
*
* @designToken tooltip.shadow
*/
shadow?: string;
/**
* Padding of root
*
* @designToken tooltip.padding
*/
padding?: string;
/**
* Border radius of root
*
* @designToken tooltip.border.radius
*/
borderRadius?: string;
/**
* Background of root
*
* @designToken tooltip.background
*/
background?: string;
/**
* Color of root
*
* @designToken tooltip.color
*/
color?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* Tree Design Tokens
@ -12,257 +11,249 @@
import { ColorSchemeDesignToken } from '..';
export interface TreeDesignTokens extends ColorSchemeDesignToken<TreeDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken tree.background
*/
background?: string;
/**
* Color of root
*
* @designToken tree.color
*/
color?: string;
/**
* Padding of root
*
* @designToken tree.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken tree.gap
*/
gap?: string;
/**
* Indent of root
*
* @designToken tree.indent
*/
indent?: string;
/**
* Transition duration of root
*
* @designToken tree.transition.duration
*/
transitionDuration?: string;
};
/**
* Background of root
*
* @designToken tree.background
*/
background?: string;
/**
* Color of root
*
* @designToken tree.color
*/
color?: string;
/**
* Padding of root
*
* @designToken tree.padding
*/
padding?: string;
/**
* Gap of root
*
* @designToken tree.gap
*/
gap?: string;
/**
* Indent of root
*
* @designToken tree.indent
*/
indent?: string;
/**
* Transition duration of root
*
* @designToken tree.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the node section
*/
* Used to pass tokens of the node section
*/
node?: {
/**
* Padding of node
*
* @designToken tree.node.padding
*/
padding?: string;
/**
* Border radius of node
*
* @designToken tree.node.border.radius
*/
borderRadius?: string;
/**
* Hover background of node
*
* @designToken tree.node.hover.background
*/
hoverBackground?: string;
/**
* Selected background of node
*
* @designToken tree.node.selected.background
*/
selectedBackground?: string;
/**
* Color of node
*
* @designToken tree.node.color
*/
color?: string;
/**
* Hover color of node
*
* @designToken tree.node.hover.color
*/
hoverColor?: string;
/**
* Selected color of node
*
* @designToken tree.node.selected.color
*/
selectedColor?: string;
/**
* Focus ring of node
*/
focusRing?: {
/**
* Focus ring width of node
*
* @designToken tree.node.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node
*
* @designToken tree.node.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node
*
* @designToken tree.node.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node
*
* @designToken tree.node.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node
*
* @designToken tree.node.focus.ring.shadow
*/
shadow?: string;
/**
* Padding of node
*
* @designToken tree.node.padding
*/
padding?: string;
/**
* Border radius of node
*
* @designToken tree.node.border.radius
*/
borderRadius?: string;
/**
* Hover background of node
*
* @designToken tree.node.hover.background
*/
hoverBackground?: string;
/**
* Selected background of node
*
* @designToken tree.node.selected.background
*/
selectedBackground?: string;
/**
* Color of node
*
* @designToken tree.node.color
*/
color?: string;
/**
* Hover color of node
*
* @designToken tree.node.hover.color
*/
hoverColor?: string;
/**
* Selected color of node
*
* @designToken tree.node.selected.color
*/
selectedColor?: string;
/**
* Focus ring of node
*/
focusRing?: {
/**
* Focus ring width of node
*
* @designToken tree.node.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node
*
* @designToken tree.node.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node
*
* @designToken tree.node.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node
*
* @designToken tree.node.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node
*
* @designToken tree.node.focus.ring.shadow
*/
shadow?: string;
};
/**
* Gap of node
*
* @designToken tree.node.gap
*/
gap?: string;
};
/**
* Gap of node
*
* @designToken tree.node.gap
*/
gap?: string;
}
/**
* Used to pass tokens of the node icon section
*/
* Used to pass tokens of the node icon section
*/
nodeIcon?: {
/**
* Color of node icon
*
* @designToken tree.node.icon.color
*/
color?: string;
/**
* Hover color of node icon
*
* @designToken tree.node.icon.hover.color
*/
hoverColor?: string;
/**
* Selected color of node icon
*
* @designToken tree.node.icon.selected.color
*/
selectedColor?: string;
}
/**
* Used to pass tokens of the node toggle button section
*/
nodeToggleButton?: {
/**
* Border radius of node toggle button
*
* @designToken tree.node.toggle.button.border.radius
*/
borderRadius?: string;
/**
* Size of node toggle button
*
* @designToken tree.node.toggle.button.size
*/
size?: string;
/**
* Hover background of node toggle button
*
* @designToken tree.node.toggle.button.hover.background
*/
hoverBackground?: string;
/**
* Selected hover background of node toggle button
*
* @designToken tree.node.toggle.button.selected.hover.background
*/
selectedHoverBackground?: string;
/**
* Color of node toggle button
*
* @designToken tree.node.toggle.button.color
*/
color?: string;
/**
* Hover color of node toggle button
*
* @designToken tree.node.toggle.button.hover.color
*/
hoverColor?: string;
/**
* Selected hover color of node toggle button
*
* @designToken tree.node.toggle.button.selected.hover.color
*/
selectedHoverColor?: string;
/**
* Focus ring of node toggle button
*/
focusRing?: {
/**
* Focus ring width of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.shadow
*/
shadow?: string;
/**
* Color of node icon
*
* @designToken tree.node.icon.color
*/
color?: string;
/**
* Hover color of node icon
*
* @designToken tree.node.icon.hover.color
*/
hoverColor?: string;
/**
* Selected color of node icon
*
* @designToken tree.node.icon.selected.color
*/
selectedColor?: string;
};
}
/**
* Used to pass tokens of the loading icon section
*/
* Used to pass tokens of the node toggle button section
*/
nodeToggleButton?: {
/**
* Border radius of node toggle button
*
* @designToken tree.node.toggle.button.border.radius
*/
borderRadius?: string;
/**
* Size of node toggle button
*
* @designToken tree.node.toggle.button.size
*/
size?: string;
/**
* Hover background of node toggle button
*
* @designToken tree.node.toggle.button.hover.background
*/
hoverBackground?: string;
/**
* Selected hover background of node toggle button
*
* @designToken tree.node.toggle.button.selected.hover.background
*/
selectedHoverBackground?: string;
/**
* Color of node toggle button
*
* @designToken tree.node.toggle.button.color
*/
color?: string;
/**
* Hover color of node toggle button
*
* @designToken tree.node.toggle.button.hover.color
*/
hoverColor?: string;
/**
* Selected hover color of node toggle button
*
* @designToken tree.node.toggle.button.selected.hover.color
*/
selectedHoverColor?: string;
/**
* Focus ring of node toggle button
*/
focusRing?: {
/**
* Focus ring width of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.width
*/
width?: string;
/**
* Focus ring style of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.style
*/
style?: string;
/**
* Focus ring color of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of node toggle button
*
* @designToken tree.node.toggle.button.focus.ring.shadow
*/
shadow?: string;
};
};
/**
* Used to pass tokens of the loading icon section
*/
loadingIcon?: {
/**
* Size of loading icon
*
* @designToken tree.loading.icon.size
*/
size?: string;
}
/**
* Size of loading icon
*
* @designToken tree.loading.icon.size
*/
size?: string;
};
}

View File

@ -1,4 +1,3 @@
/**
*
* TreeSelect Design Tokens
@ -12,233 +11,225 @@
import { ColorSchemeDesignToken } from '..';
export interface TreeSelectDesignTokens extends ColorSchemeDesignToken<TreeSelectDesignTokens> {
/**
* Used to pass tokens of the root section
*/
* Used to pass tokens of the root section
*/
root?: {
/**
* Background of root
*
* @designToken treeselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken treeselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken treeselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken treeselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken treeselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken treeselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken treeselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken treeselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken treeselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken treeselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken treeselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken treeselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken treeselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken treeselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken treeselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken treeselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken treeselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken treeselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken treeselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken treeselect.focus.ring.shadow
*/
shadow?: string;
/**
* Background of root
*
* @designToken treeselect.background
*/
background?: string;
/**
* Disabled background of root
*
* @designToken treeselect.disabled.background
*/
disabledBackground?: string;
/**
* Filled background of root
*
* @designToken treeselect.filled.background
*/
filledBackground?: string;
/**
* Filled focus background of root
*
* @designToken treeselect.filled.focus.background
*/
filledFocusBackground?: string;
/**
* Border color of root
*
* @designToken treeselect.border.color
*/
borderColor?: string;
/**
* Hover border color of root
*
* @designToken treeselect.hover.border.color
*/
hoverBorderColor?: string;
/**
* Focus border color of root
*
* @designToken treeselect.focus.border.color
*/
focusBorderColor?: string;
/**
* Invalid border color of root
*
* @designToken treeselect.invalid.border.color
*/
invalidBorderColor?: string;
/**
* Color of root
*
* @designToken treeselect.color
*/
color?: string;
/**
* Disabled color of root
*
* @designToken treeselect.disabled.color
*/
disabledColor?: string;
/**
* Placeholder color of root
*
* @designToken treeselect.placeholder.color
*/
placeholderColor?: string;
/**
* Shadow of root
*
* @designToken treeselect.shadow
*/
shadow?: string;
/**
* Padding x of root
*
* @designToken treeselect.padding.x
*/
paddingX?: string;
/**
* Padding y of root
*
* @designToken treeselect.padding.y
*/
paddingY?: string;
/**
* Border radius of root
*
* @designToken treeselect.border.radius
*/
borderRadius?: string;
/**
* Focus ring of root
*/
focusRing?: {
/**
* Focus ring width of root
*
* @designToken treeselect.focus.ring.width
*/
width?: string;
/**
* Focus ring style of root
*
* @designToken treeselect.focus.ring.style
*/
style?: string;
/**
* Focus ring color of root
*
* @designToken treeselect.focus.ring.color
*/
color?: string;
/**
* Focus ring offset of root
*
* @designToken treeselect.focus.ring.offset
*/
offset?: string;
/**
* Focus ring shadow of root
*
* @designToken treeselect.focus.ring.shadow
*/
shadow?: string;
};
/**
* Transition duration of root
*
* @designToken treeselect.transition.duration
*/
transitionDuration?: string;
};
/**
* Transition duration of root
*
* @designToken treeselect.transition.duration
*/
transitionDuration?: string;
}
/**
* Used to pass tokens of the dropdown section
*/
* Used to pass tokens of the dropdown section
*/
dropdown?: {
/**
* Width of dropdown
*
* @designToken treeselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken treeselect.dropdown.color
*/
color?: string;
};
/**
* Width of dropdown
*
* @designToken treeselect.dropdown.width
*/
width?: string;
/**
* Color of dropdown
*
* @designToken treeselect.dropdown.color
*/
color?: string;
}
/**
* Used to pass tokens of the overlay section
*/
* Used to pass tokens of the overlay section
*/
overlay?: {
/**
* Background of overlay
*
* @designToken treeselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken treeselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken treeselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken treeselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken treeselect.overlay.shadow
*/
shadow?: string;
};
/**
* Background of overlay
*
* @designToken treeselect.overlay.background
*/
background?: string;
/**
* Border color of overlay
*
* @designToken treeselect.overlay.border.color
*/
borderColor?: string;
/**
* Border radius of overlay
*
* @designToken treeselect.overlay.border.radius
*/
borderRadius?: string;
/**
* Color of overlay
*
* @designToken treeselect.overlay.color
*/
color?: string;
/**
* Shadow of overlay
*
* @designToken treeselect.overlay.shadow
*/
shadow?: string;
}
/**
* Used to pass tokens of the tree section
*/
* Used to pass tokens of the tree section
*/
tree?: {
/**
* Padding of tree
*
* @designToken treeselect.tree.padding
*/
padding?: string;
};
/**
* Padding of tree
*
* @designToken treeselect.tree.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the empty message section
*/
* Used to pass tokens of the empty message section
*/
emptyMessage?: {
/**
* Padding of empty message
*
* @designToken treeselect.empty.message.padding
*/
padding?: string;
};
/**
* Padding of empty message
*
* @designToken treeselect.empty.message.padding
*/
padding?: string;
}
/**
* Used to pass tokens of the chip section
*/
* Used to pass tokens of the chip section
*/
chip?: {
/**
* Border radius of chip
*
* @designToken treeselect.chip.border.radius
*/
borderRadius?: string;
}
/**
* Border radius of chip
*
* @designToken treeselect.chip.border.radius
*/
borderRadius?: string;
};
}

File diff suppressed because it is too large Load Diff