-
Notifications
You must be signed in to change notification settings - Fork 172
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* wip - with static data * rows * wip - clicking on stuff * correct navigation * update variable on apply * use correct colors * do not traverse when clicking in the left hand column * disable back button when current value path is empty * only traverse on double click * focusedVariableChildren is no longer a state * separating selected vs navigatedTo path * showing the selected path in the breadcrumbs * ElementSelector uses zero-based indexes * delete selection on navigation * add role to data reference cartouche * use the cartouche ui * top bar for primitive variables * show selection on cartouche * grid column * temporarily disable the back button * border color + selected * assorted navigation fixes * home button too * be able to select primitiveVars and folderVars * tooltip wraps icon too * implementing CartoucheUI datatype prop * subdue the "folder" border color * hover * removing currentHoveredPath * apply button * using mckayla's new icons * introducing pickTargetType * Revert "introducing pickTargetType" This reverts commit 42e8703. * only matching elements get a cartouche * wip - value preview styles * do not show monospaced font for information role cartouche * wip - top bar * Fix to X * tweaking the breadcrumbs to look like an input field * tweaking the "input field" css * the valuePreviewText observes hover * organize imports * Update data-selector-modal.tsx * Update data-selector-modal.tsx * Update data-selector-modal.tsx * Update data-selector-modal.tsx * basc test * update snapshots * cleanup * Update data-selector-modal.tsx * check children length in childvars --------- Co-authored-by: Balazs Bajorics <[email protected]>
- Loading branch information
1 parent
1e418ad
commit 1cb14ef
Showing
8 changed files
with
819 additions
and
76 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
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
84 changes: 84 additions & 0 deletions
84
...src/components/inspector/sections/component-section/data-selector-modal.spec.browser2.tsx
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,84 @@ | ||
| import * as EP from '../../../../core/shared/element-path' | ||
| import { selectComponentsForTest } from '../../../../utils/utils.test-utils' | ||
| import { mouseClickAtPoint } from '../../../canvas/event-helpers.test-utils' | ||
| import { renderTestEditorWithCode } from '../../../canvas/ui-jsx.test-utils' | ||
|
|
||
| describe('data selector modal', () => { | ||
| it('can be opened', async () => { | ||
| const editor = await renderTestEditorWithCode(project, 'await-first-dom-report') | ||
| await selectComponentsForTest(editor, [EP.fromString('sb/scene/pg:contents')]) | ||
|
|
||
| await mouseClickAtPoint(editor.renderedDOM.getByTestId('plus-button-title'), { x: 1, y: 1 }) | ||
|
|
||
| expect(editor.renderedDOM.getByText('Apply')).not.toBeNull() | ||
| }) | ||
| }) | ||
|
|
||
| const project = `import * as React from 'react' | ||
| import { | ||
| Scene, | ||
| Storyboard, | ||
| FlexCol, | ||
| FlexRow, | ||
| } from 'utopia-api' | ||
| const Contents = ({ children, style, title }) => { | ||
| return ( | ||
| <FlexCol data-uid='c-root'> | ||
| <h1 data-uid='c-title'>{title}</h1> | ||
| <FlexRow {...style} data-uid='c-row'> | ||
| {children} | ||
| </FlexRow> | ||
| </FlexCol> | ||
| ) | ||
| } | ||
| export var Playground = ({ style }) => { | ||
| const testimonials = [ | ||
| { name: 'Bob', review: 'Very OK' }, | ||
| { name: 'Bob', review: 'Very OK' }, | ||
| { name: 'Bob', review: 'Very OK' }, | ||
| { name: 'Bob', review: 'Very OK' }, | ||
| { name: 'Bob', review: 'Very OK' }, | ||
| ] | ||
| const reviews = { | ||
| length: 12, | ||
| nodes: [ | ||
| { user: 'bob', contents: 'super' }, | ||
| { user: 'bob', contents: 'super' }, | ||
| { user: 'bob', contents: 'super' }, | ||
| { user: 'bob', contents: 'super' }, | ||
| ], | ||
| } | ||
| const loaded = true | ||
| const header = { | ||
| title: 'Hello', | ||
| subtitle: 'These are the reviews', | ||
| } | ||
| return <Contents data-uid='contents' title='Hello' /> | ||
| } | ||
| export var storyboard = ( | ||
| <Storyboard data-uid='sb'> | ||
| <Scene | ||
| id='playground-scene' | ||
| commentId='playground-scene' | ||
| style={{ | ||
| width: 700, | ||
| height: 759, | ||
| position: 'absolute', | ||
| left: 212, | ||
| top: 128, | ||
| }} | ||
| data-label='Playground' | ||
| data-uid='scene' | ||
| > | ||
| <Playground style={{}} data-uid='pg' /> | ||
| </Scene> | ||
| </Storyboard> | ||
| ) | ||
| ` |
Oops, something went wrong.