b5a5b41523
* feat(storybook): give components with behaviours their own story controls A Switch exported to Storybook showed a State select with On and Off. A variant property drawn by a behaviour's boolean value now becomes a boolean control named as Reka and Radix name the prop (checked, pressed, open, disabled), the interaction-state property leaves the controls, and each state stays a story. behaviourArgs in dom-css reads these props, so generated components can take the same API later. * fix(dom-css): import behaviour args by module so packed builds resolve it The #dom-css/* import maps to dist files when packed, which have no directory index, so #dom-css/behaviours failed to load in a consumer install.
49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import { describe, expect, test } from 'bun:test'
|
|
|
|
import { behaviourArgs } from '#dom-css/behaviours/args'
|
|
|
|
import { emptyBehaviour, SceneGraph, withBehaviour } from '@open-pencil/scene-graph'
|
|
|
|
function toggleSet(options: string[]) {
|
|
const graph = new SceneGraph()
|
|
const set = graph.createNode('COMPONENT_SET', graph.getPages()[0].id, {
|
|
name: 'Toggle',
|
|
componentPropertyDefinitions: [
|
|
{
|
|
id: 'pressed',
|
|
name: 'Pressed',
|
|
type: 'VARIANT',
|
|
defaultValue: 'No',
|
|
variantOptions: options
|
|
}
|
|
]
|
|
})
|
|
graph.updateNode(set.id, {
|
|
pluginData: withBehaviour(set, {
|
|
...emptyBehaviour('toggle'),
|
|
booleans: { value: { propertyId: 'pressed', on: 'Yes', off: 'No' } }
|
|
})
|
|
})
|
|
return { graph, set }
|
|
}
|
|
|
|
describe('behaviour args', () => {
|
|
test('a boolean value drawn by an on/off variant property is a prop named as Reka names it', () => {
|
|
const { graph, set } = toggleSet(['No', 'Yes'])
|
|
expect([...(behaviourArgs(graph, set)?.booleans ?? [])]).toEqual([
|
|
['Pressed', { name: 'pressed', on: 'Yes', off: 'No' }]
|
|
])
|
|
})
|
|
|
|
test('a property with values beyond on and off stays a variant', () => {
|
|
const { graph, set } = toggleSet(['No', 'Yes', 'Mixed'])
|
|
expect(behaviourArgs(graph, set)?.booleans.size).toBe(0)
|
|
})
|
|
|
|
test('a component without a behaviour has no behaviour props', () => {
|
|
const graph = new SceneGraph()
|
|
const set = graph.createNode('COMPONENT_SET', graph.getPages()[0].id, { name: 'Card' })
|
|
expect(behaviourArgs(graph, set)).toBeNull()
|
|
})
|
|
})
|