-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Use latest Remote DOM APIs properly (#333)
- Loading branch information
Showing
187 changed files
with
4,227 additions
and
1,401 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,10 @@ | ||
| --- | ||
| '@watching/clips-preact': minor | ||
| '@watching/clips-svelte': minor | ||
| '@watching/clips-react': minor | ||
| '@watching/clips': minor | ||
| '@watching/cli': minor | ||
| '@watching/thread-render': patch | ||
| --- | ||
|
|
||
| Update custom element APIs |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,15 +1,31 @@ | ||
| import {Action as UiAction} from '@lemon/zest'; | ||
| import {usePossibleThreadSignals, createClipsComponent} from './shared.ts'; | ||
| import {Action as UIAction} from '@lemon/zest'; | ||
| import { | ||
| createClipsComponentRenderer, | ||
| useRenderedChildren, | ||
| wrapEventListenerForCallback, | ||
| } from './shared.ts'; | ||
|
|
||
| export const Action = createClipsComponent( | ||
| export const Action = createClipsComponentRenderer( | ||
| 'ui-action', | ||
| function Action({to, disabled, onPress, overlay, children}) { | ||
| const signalProps = usePossibleThreadSignals({disabled}); | ||
| function Action(props) { | ||
| const {overlay, children} = useRenderedChildren(props, { | ||
| slotProps: ['overlay'], | ||
| }); | ||
|
|
||
| const attributes = props.element.attributes.value; | ||
| const events = props.element.eventListeners.value; | ||
|
|
||
| return ( | ||
| <UiAction {...signalProps} to={to} onPress={onPress} overlay={overlay}> | ||
| <UIAction | ||
| to={attributes.to} | ||
| disabled={attributes.disabled != null} | ||
| onPress={ | ||
| events.press ? wrapEventListenerForCallback(events.press) : undefined | ||
| } | ||
| overlay={overlay} | ||
| > | ||
| {children} | ||
| </UiAction> | ||
| </UIAction> | ||
| ); | ||
| }, | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,40 +1,54 @@ | ||
| import {BlockGrid as UiBlockGrid} from '@lemon/zest'; | ||
| import {createClipsComponent} from './shared.ts'; | ||
| import { | ||
| SPACING_KEYWORDS, | ||
| ALIGNMENT_KEYWORDS, | ||
| LAYOUT_MODE_KEYWORDS, | ||
| } from '@watching/design'; | ||
| import {BlockGrid as UIBlockGrid} from '@lemon/zest'; | ||
|
|
||
| export const BlockGrid = createClipsComponent( | ||
| import {useViewProps} from './View.tsx'; | ||
| import {parseGridSizesAttribute} from './Grid.tsx'; | ||
|
|
||
| import { | ||
| createClipsComponentRenderer, | ||
| restrictToAllowedValues, | ||
| useRenderedChildren, | ||
| } from './shared.ts'; | ||
|
|
||
| export const BlockGrid = createClipsComponentRenderer( | ||
| 'ui-block-grid', | ||
| function BlockGrid({ | ||
| children, | ||
| sizes, | ||
| spacing, | ||
| blockSpacing, | ||
| inlineSpacing, | ||
| blockAlignment, | ||
| inlineAlignment, | ||
| layoutMode, | ||
| padding, | ||
| paddingBlockEnd, | ||
| paddingBlockStart, | ||
| paddingInlineEnd, | ||
| paddingInlineStart, | ||
| }) { | ||
| function BlockGrid(props) { | ||
| const {children} = useRenderedChildren(props); | ||
|
|
||
| const attributes = props.element.attributes.value; | ||
|
|
||
| return ( | ||
| <UiBlockGrid | ||
| sizes={sizes} | ||
| spacing={spacing} | ||
| blockSpacing={blockSpacing} | ||
| inlineSpacing={inlineSpacing} | ||
| blockAlignment={blockAlignment} | ||
| inlineAlignment={inlineAlignment} | ||
| layoutMode={layoutMode} | ||
| padding={padding} | ||
| paddingBlockEnd={paddingBlockEnd} | ||
| paddingBlockStart={paddingBlockStart} | ||
| paddingInlineEnd={paddingInlineEnd} | ||
| paddingInlineStart={paddingInlineStart} | ||
| <UIBlockGrid | ||
| {...useViewProps(props)} | ||
| sizes={parseGridSizesAttribute(attributes.sizes)} | ||
| spacing={restrictToAllowedValues(attributes.spacing, SPACING_KEYWORDS)} | ||
| blockSpacing={restrictToAllowedValues( | ||
| attributes.blockSpacing, | ||
| SPACING_KEYWORDS, | ||
| )} | ||
| inlineSpacing={restrictToAllowedValues( | ||
| attributes.inlineSpacing, | ||
| SPACING_KEYWORDS, | ||
| )} | ||
| blockAlignment={restrictToAllowedValues( | ||
| attributes.blockAlignment, | ||
| ALIGNMENT_KEYWORDS, | ||
| )} | ||
| inlineAlignment={restrictToAllowedValues( | ||
| attributes.inlineAlignment, | ||
| ALIGNMENT_KEYWORDS, | ||
| )} | ||
| layoutMode={restrictToAllowedValues( | ||
| attributes.layoutMode, | ||
| LAYOUT_MODE_KEYWORDS, | ||
| )} | ||
| > | ||
| {children} | ||
| </UiBlockGrid> | ||
| </UIBlockGrid> | ||
| ); | ||
| }, | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,34 +1,44 @@ | ||
| import {BlockStack as UiBlockStack} from '@lemon/zest'; | ||
| import {createClipsComponent} from './shared.ts'; | ||
| import { | ||
| SPACING_KEYWORDS, | ||
| ALIGNMENT_KEYWORDS, | ||
| LAYOUT_MODE_KEYWORDS, | ||
| } from '@watching/design'; | ||
| import {BlockStack as UIBlockStack} from '@lemon/zest'; | ||
|
|
||
| export const BlockStack = createClipsComponent( | ||
| import {useViewProps} from './View.tsx'; | ||
|
|
||
| import { | ||
| createClipsComponentRenderer, | ||
| restrictToAllowedValues, | ||
| useRenderedChildren, | ||
| } from './shared.ts'; | ||
|
|
||
| export const BlockStack = createClipsComponentRenderer( | ||
| 'ui-block-stack', | ||
| function BlockStack({ | ||
| children, | ||
| spacing, | ||
| blockAlignment, | ||
| inlineAlignment, | ||
| layoutMode, | ||
| padding, | ||
| paddingBlockEnd, | ||
| paddingBlockStart, | ||
| paddingInlineEnd, | ||
| paddingInlineStart, | ||
| }) { | ||
| function BlockStack(props) { | ||
| const {children} = useRenderedChildren(props); | ||
|
|
||
| const attributes = props.element.attributes.value; | ||
|
|
||
| return ( | ||
| <UiBlockStack | ||
| spacing={spacing} | ||
| blockAlignment={blockAlignment} | ||
| inlineAlignment={inlineAlignment} | ||
| layoutMode={layoutMode} | ||
| padding={padding} | ||
| paddingBlockEnd={paddingBlockEnd} | ||
| paddingBlockStart={paddingBlockStart} | ||
| paddingInlineEnd={paddingInlineEnd} | ||
| paddingInlineStart={paddingInlineStart} | ||
| <UIBlockStack | ||
| {...useViewProps(props)} | ||
| spacing={restrictToAllowedValues(attributes.spacing, SPACING_KEYWORDS)} | ||
| inlineAlignment={restrictToAllowedValues( | ||
| attributes.inlineAlignment, | ||
| ALIGNMENT_KEYWORDS, | ||
| )} | ||
| blockAlignment={restrictToAllowedValues( | ||
| attributes.blockAlignment, | ||
| ALIGNMENT_KEYWORDS, | ||
| )} | ||
| layoutMode={restrictToAllowedValues( | ||
| attributes.layoutMode, | ||
| LAYOUT_MODE_KEYWORDS, | ||
| )} | ||
| > | ||
| {children} | ||
| </UiBlockStack> | ||
| </UIBlockStack> | ||
| ); | ||
| }, | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,9 +1,18 @@ | ||
| import {Disclosure as UiDisclosure} from '@lemon/zest'; | ||
| import {createClipsComponent} from './shared.ts'; | ||
| import {Disclosure as UIDisclosure} from '@lemon/zest'; | ||
|
|
||
| export const Disclosure = createClipsComponent( | ||
| import {createClipsComponentRenderer, useRenderedChildren} from './shared.ts'; | ||
|
|
||
| export const Disclosure = createClipsComponentRenderer( | ||
| 'ui-disclosure', | ||
| function Disclosure({children, label}) { | ||
| return <UiDisclosure label={label}>{children}</UiDisclosure>; | ||
| function Disclosure(props) { | ||
| const {label, children} = useRenderedChildren(props, { | ||
| slotProps: ['label'], | ||
| }); | ||
|
|
||
| const attributes = props.element.attributes.value; | ||
|
|
||
| return ( | ||
| <UIDisclosure label={label ?? attributes.label}>{children}</UIDisclosure> | ||
| ); | ||
| }, | ||
| ); |
Oops, something went wrong.