Format fixes
parent
411d002834
commit
3b20ef5ea6
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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
|
@ -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
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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
Loading…
Reference in New Issue