You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
96 lines
2.7 KiB
96 lines
2.7 KiB
6 months ago
|
import type { Morfo } from '../types';
|
||
|
|
|
||
|
|
export const dropdownMenuMorfo: Morfo = {
|
||
|
|
name: 'DropdownMenu',
|
||
|
|
kebab: 'dropdown-menu',
|
||
|
|
scope: ['soma'],
|
||
|
|
apg: 'https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/',
|
||
|
|
parts: [
|
||
|
|
{ name: 'Provider', kebab: 'root', kind: 'virtual', defaultElement: 'none', optional: false, data: [], aria: [] },
|
||
|
|
{
|
||
|
|
name: 'Trigger',
|
||
|
|
kebab: 'trigger',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'button',
|
||
|
|
optional: false,
|
||
|
|
states: ['open', 'closed'],
|
||
|
|
data: [{ attr: 'data-state', values: ['open', 'closed'] }],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: 'Content',
|
||
|
|
kebab: 'content',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: false,
|
||
|
|
states: ['open', 'closed'],
|
||
|
|
data: [{ attr: 'data-state', values: ['open', 'closed'] }],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: 'Item',
|
||
|
|
kebab: 'item',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: false,
|
||
|
|
data: [{ attr: 'data-disabled', severity: 'optional' }],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: 'CheckboxItem',
|
||
|
|
kebab: 'checkbox-item',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: true,
|
||
|
|
states: ['checked', 'unchecked'],
|
||
|
|
data: [
|
||
|
|
{ attr: 'data-state', values: ['checked', 'unchecked'] },
|
||
|
|
{ attr: 'data-disabled', severity: 'optional' }
|
||
|
|
],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{ name: 'RadioGroup', kebab: 'radio-group', kind: 'public', defaultElement: 'div', optional: true, data: [], aria: [] },
|
||
|
|
{
|
||
|
|
name: 'RadioItem',
|
||
|
|
kebab: 'radio-item',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: true,
|
||
|
|
states: ['checked', 'unchecked'],
|
||
|
|
data: [
|
||
|
|
{ attr: 'data-state', values: ['checked', 'unchecked'] },
|
||
|
|
{ attr: 'data-disabled', severity: 'optional' }
|
||
|
|
],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{ name: 'Sub', kebab: 'sub', kind: 'virtual', defaultElement: 'none', optional: true, data: [], aria: [] },
|
||
|
|
{
|
||
|
|
name: 'SubTrigger',
|
||
|
|
kebab: 'sub-trigger',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: true,
|
||
|
|
states: ['open', 'closed'],
|
||
|
|
data: [
|
||
|
|
{ attr: 'data-state', values: ['open', 'closed'] },
|
||
|
|
{ attr: 'data-disabled', severity: 'optional' }
|
||
|
|
],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: 'SubContent',
|
||
|
|
kebab: 'sub-content',
|
||
|
|
kind: 'public',
|
||
|
|
defaultElement: 'div',
|
||
|
|
optional: true,
|
||
|
|
states: ['open', 'closed'],
|
||
|
|
data: [{ attr: 'data-state', values: ['open', 'closed'] }],
|
||
|
|
aria: []
|
||
|
|
},
|
||
|
|
{ name: 'Group', kebab: 'group', kind: 'public', defaultElement: 'div', optional: true, data: [], aria: [] },
|
||
|
|
{ name: 'GroupHeading', kebab: 'group-heading', kind: 'public', defaultElement: 'div', optional: true, data: [], aria: [] },
|
||
|
|
{ name: 'Separator', kebab: 'separator', kind: 'public', defaultElement: 'div', optional: true, data: [], aria: [] },
|
||
|
|
{ name: 'Arrow', kebab: 'arrow', kind: 'public', defaultElement: 'div', optional: true, data: [], aria: [] }
|
||
|
|
]
|
||
|
|
};
|