From 59decd8a1efe090998e94e46fdb5475d48a366f0 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 18:09:20 -0700 Subject: [PATCH 001/418] parse parse revolution --- packages/gui/src/components/schemas/types.ts | 8 ++++++++ packages/gui/src/lib/parse.ts | 2 +- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/gui/src/components/schemas/types.ts b/packages/gui/src/components/schemas/types.ts index ea3f0f58..192a09aa 100644 --- a/packages/gui/src/components/schemas/types.ts +++ b/packages/gui/src/components/schemas/types.ts @@ -1,4 +1,5 @@ import { ComponentType } from 'react' +import { Token } from '../../lib/parse' import { EditorPropsWithLabel } from '../../types/editor' import { Theme } from '../../types/theme' @@ -21,6 +22,13 @@ export interface DataTypeSchema { variants?: SchemaVariants /** Whether the input has a block input */ hasBlockInput?(value: T): boolean + /** + * Parse the list of tokens into this schema input. + * Returns a tuple of: + * - the parsed data, or undefined if this does not parse + * - the rest of the unparsed tokens + */ + parse?(tokens: Token[]): [result: T | undefined, rest: string] } export interface RegenOptions { diff --git a/packages/gui/src/lib/parse.ts b/packages/gui/src/lib/parse.ts index c400395a..f7576b60 100644 --- a/packages/gui/src/lib/parse.ts +++ b/packages/gui/src/lib/parse.ts @@ -1,4 +1,4 @@ -type Token = string | CssFunction +export type Token = string | CssFunction interface CssFunction { name: string From a782ca1438b28feb5b7756b89ce1282583ba7699 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:00:54 -0700 Subject: [PATCH 002/418] handle parsing some primitives --- .../gui/src/components/schemas/dimension.tsx | 23 ++++++++++++++ .../gui/src/components/schemas/primitives.tsx | 30 +++++++++++++++++-- packages/gui/src/components/schemas/types.ts | 2 +- 3 files changed, 52 insertions(+), 3 deletions(-) diff --git a/packages/gui/src/components/schemas/dimension.tsx b/packages/gui/src/components/schemas/dimension.tsx index bf9c8b3c..e3ba92e9 100644 --- a/packages/gui/src/components/schemas/dimension.tsx +++ b/packages/gui/src/components/schemas/dimension.tsx @@ -1,11 +1,14 @@ +import { toNumber } from 'lodash-es' import { UnitConversions, UnitSteps } from '../../lib' import { bindProps } from '../../lib/components' +import { Token } from '../../lib/parse' import { randomStep } from '../../lib/random' import { stringifyUnit } from '../../lib/stringify' import { DimensionInput } from '../inputs/Dimension' import { Range } from '../inputs/Dimension/Input' import { calc } from './calc' import { joinSchemas } from './joinSchemas' +import { number } from './primitives' import { DataTypeSchema, RegenOptions } from './types' type UnitRanges = Record @@ -51,6 +54,14 @@ function basicDimension({ defaultValue, regenerate, validate: ((value: any) => validateDimension(value, units)) as any, + parse(tokens) { + const [first, ...rest] = tokens + const result = parseDimension(first, units) + if (!result) { + return [undefined, tokens] + } + return [result, rest] + }, } } @@ -63,3 +74,15 @@ function validateDimension(value: any, units: readonly string[]) { if (typeof value !== 'object') return false return units.includes(value.unit) && typeof value.value === 'number' } + +function parseDimension( + token: Token, + units: readonly U[] +): UnitValue | undefined { + if (typeof token !== 'string') return undefined + const unit = units.find((unit) => token.endsWith(unit)) + if (!unit) return undefined + const numberPart = toNumber(token.replace(unit, '')) + if (isNaN(numberPart)) return undefined + return { value: numberPart, unit } +} diff --git a/packages/gui/src/components/schemas/primitives.tsx b/packages/gui/src/components/schemas/primitives.tsx index f582f4e4..7b408647 100644 --- a/packages/gui/src/components/schemas/primitives.tsx +++ b/packages/gui/src/components/schemas/primitives.tsx @@ -1,7 +1,6 @@ -import { compact } from 'lodash-es' +import { compact, isInteger, toNumber } from 'lodash-es' import { bindProps } from '../../lib/components' import { choose, randomStep } from '../../lib/random' -import { stringifyUnit } from '../../lib/stringify' import { randomInt } from '../../lib/util' import { CSSUnitValue, @@ -42,6 +41,13 @@ export function number({ defaultValue, regenerate, validate: ((value: any) => typeof value === 'number') as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + const asNumber = toNumber(token) + if (isNaN(asNumber)) return [undefined, tokens] + return [asNumber, rest] + }, } } @@ -135,6 +141,14 @@ export function integer({ stringify: (value) => value.toString(), defaultValue, validate: ((value: any) => typeof value === 'number') as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + const asNumber = toNumber(token) + if (isNaN(asNumber)) return [undefined, tokens] + if (!isInteger(number)) return [undefined, tokens] + return [asNumber, rest] + }, } } @@ -198,6 +212,12 @@ export function keyword( defaultValue, regenerate: regenerate, validate: ((value: any) => options.includes(value.toString())) as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + if (!options.includes(token as T)) return [undefined, tokens] + return [token as T, rest] + }, } } @@ -209,5 +229,11 @@ function literal(value: T): DataTypeSchema { defaultValue: value, regenerate: () => value, validate: ((testValue: any) => testValue === value) as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + if (token !== value) return [undefined, tokens] + return [value, rest] + }, } } diff --git a/packages/gui/src/components/schemas/types.ts b/packages/gui/src/components/schemas/types.ts index 192a09aa..901b94d2 100644 --- a/packages/gui/src/components/schemas/types.ts +++ b/packages/gui/src/components/schemas/types.ts @@ -28,7 +28,7 @@ export interface DataTypeSchema { * - the parsed data, or undefined if this does not parse * - the rest of the unparsed tokens */ - parse?(tokens: Token[]): [result: T | undefined, rest: string] + parse(tokens: Token[]): [result: T | undefined, rest: Token[]] } export interface RegenOptions { From 81e95d2b404354a3ce0d3f3e86215409dc70ae19 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:10:02 -0700 Subject: [PATCH 003/418] string parsing --- packages/gui/src/components/schemas/primitives.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/gui/src/components/schemas/primitives.tsx b/packages/gui/src/components/schemas/primitives.tsx index 7b408647..346f08be 100644 --- a/packages/gui/src/components/schemas/primitives.tsx +++ b/packages/gui/src/components/schemas/primitives.tsx @@ -180,6 +180,15 @@ export function string({ stringify: (value) => `"${value}"`, defaultValue, validate: ((value: any) => typeof value === 'string') as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + const ends = [token[0], token[token.length - 1]] + if (ends.some((x) => x === '"') || ends.some((x) => x === "'")) { + return [token.substring(1, token.length - 1), rest] + } + return [undefined, tokens] + }, } } From 163420b2cb3d90718e1c4c1d21298217ff3c841a Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:22:41 -0700 Subject: [PATCH 004/418] list schema --- packages/gui/src/components/schemas/list.tsx | 42 +++++++++++++++---- .../gui/src/components/schemas/primitives.tsx | 9 +++- packages/gui/src/lib/parse.ts | 2 +- 3 files changed, 44 insertions(+), 9 deletions(-) diff --git a/packages/gui/src/components/schemas/list.tsx b/packages/gui/src/components/schemas/list.tsx index 162fee09..7fda2df4 100644 --- a/packages/gui/src/components/schemas/list.tsx +++ b/packages/gui/src/components/schemas/list.tsx @@ -1,4 +1,5 @@ import { ComponentType } from 'react' +import { parse } from 'uuid' import FieldArray from '../FieldArray' import { DataTypeSchema, RegenOptions } from './types' @@ -28,13 +29,7 @@ export function listSchema({ stringify, defaultValue, input(props) { - return ( - - ) + return }, regenerate, validate: ((value: any) => { @@ -43,5 +38,38 @@ export function listSchema({ } return value.every((item) => itemSchema.validate(item)) }) as any, + parse(tokens) { + const parseSeperator = separator.trim() + // Split the tokens based on the separator + const ensplittenedTokens = parseSeperator + ? splitArray(tokens, parseSeperator) + : tokens.map((t) => [t]) + + const results = [] + for (const tokenGroup of ensplittenedTokens) { + const [result, rest] = itemSchema.parse(tokenGroup) + // Make sure the item schema parses the group *entirely* without loose ends + if (!result || rest.length > 0) { + return [undefined, tokens] + } + results.push(result) + } + // When parsed, the list should take up the remaining tokens + return [results, []] + }, + } +} + +function splitArray(array: T[], separator: T) { + const result = [] + let current: T[] = [] + for (const item of array) { + if (item === separator) { + result.push(current) + current = [] + } else { + current.push(item) + } } + return result } diff --git a/packages/gui/src/components/schemas/primitives.tsx b/packages/gui/src/components/schemas/primitives.tsx index 346f08be..7c36aace 100644 --- a/packages/gui/src/components/schemas/primitives.tsx +++ b/packages/gui/src/components/schemas/primitives.tsx @@ -158,7 +158,7 @@ export function ident({ defaultValue?: string } = {}): DataTypeSchema { return { - type: 'identifier', + type: '', // Right now, just use a text input. // In the future we may want to do smart-identification of identifiers // the user has used in other places @@ -166,6 +166,13 @@ export function ident({ stringify: (value) => value, defaultValue, validate: ((value: any) => typeof value === 'string') as any, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token !== 'string') return [undefined, tokens] + // TODO allow escaped characters + if (!/[-_0-9A-Za-z]+/.test(token)) return [undefined, tokens] + return [token, rest] + }, } } diff --git a/packages/gui/src/lib/parse.ts b/packages/gui/src/lib/parse.ts index f7576b60..5240b1d1 100644 --- a/packages/gui/src/lib/parse.ts +++ b/packages/gui/src/lib/parse.ts @@ -57,7 +57,7 @@ export function tokenizeRaw(str: string) { // TODO fail if there are any extraneous non-space characters return [ ...str.matchAll( - /(?:"[^"]*")|(?:'[^']*')|(?:[-A-Za-z0-9]+$)|[-A-Za-z0-9.]+|(?:#[a-f0-9]+)|\/|,|$|\+|\-|\*/g + /(?:"[^"]*")|(?:'[^']*')|(?:[-_A-Za-z0-9]+$)|[-_A-Za-z0-9.]+|(?:#[a-f0-9]+)|\/|,|$|\+|\-|\*/g ), ].map((match) => match[0]) } From 57ae4b783cbc10568635deb38fd38f0e05e552da Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:22:53 -0700 Subject: [PATCH 005/418] clenaup --- packages/gui/src/components/schemas/list.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/gui/src/components/schemas/list.tsx b/packages/gui/src/components/schemas/list.tsx index 7fda2df4..6e53181d 100644 --- a/packages/gui/src/components/schemas/list.tsx +++ b/packages/gui/src/components/schemas/list.tsx @@ -1,5 +1,3 @@ -import { ComponentType } from 'react' -import { parse } from 'uuid' import FieldArray from '../FieldArray' import { DataTypeSchema, RegenOptions } from './types' From 6df5c29cdc4cbb4459666cee195b3f37c0ff8153 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:28:36 -0700 Subject: [PATCH 006/418] options --- packages/gui/src/components/schemas/options.tsx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx index 81935cab..de6648ee 100644 --- a/packages/gui/src/components/schemas/options.tsx +++ b/packages/gui/src/components/schemas/options.tsx @@ -107,6 +107,17 @@ export function optionsSchema>({ variantSchema.validate(value) ) }) as any, + parse(tokens) { + // Try to find a variant that parses the options completely, and return that variant + // FIXME deal with instances where the one of the variants just swallows up the other + for (const variantSchema of Object.values(variants)) { + const [result, rest] = variantSchema.parse(tokens) + if (result) { + return [result, rest] + } + } + return [undefined, tokens] + }, } } From 3d9fc9b168d9663ab258ddc68c8f4e90f6067b32 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:33:33 -0700 Subject: [PATCH 007/418] parse function --- packages/gui/src/components/schemas/function.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/gui/src/components/schemas/function.tsx b/packages/gui/src/components/schemas/function.tsx index d638417e..5e5fe09d 100644 --- a/packages/gui/src/components/schemas/function.tsx +++ b/packages/gui/src/components/schemas/function.tsx @@ -1,3 +1,4 @@ +import { isNil } from 'lodash-es' import { getInputProps } from '../../lib/util' import { SchemaInput } from '../inputs/SchemaInput' import { DataTypeSchema } from './types' @@ -47,5 +48,14 @@ export function functionSchema( ) }, + parse(tokens) { + const [token, ...rest] = tokens + if (typeof token === 'string') return [undefined, tokens] + const { name: parseName, arguments: parseArgs } = token + if (name !== parseName) return [undefined, tokens] + const [argsResult, argsRest] = argsSchema.parse(parseArgs) + if (isNil(argsResult) || argsRest.length > 0) return [undefined, tokens] + return [{ name, arguments: argsResult }, rest] + }, } } From d13201c5b6127bc043535075015e6fe89b1c498a Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Fri, 24 Jun 2022 20:41:42 -0700 Subject: [PATCH 008/418] write a test for dimensions --- .../gui/src/components/schemas/dimension.test.ts | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 packages/gui/src/components/schemas/dimension.test.ts diff --git a/packages/gui/src/components/schemas/dimension.test.ts b/packages/gui/src/components/schemas/dimension.test.ts new file mode 100644 index 00000000..b0f758ce --- /dev/null +++ b/packages/gui/src/components/schemas/dimension.test.ts @@ -0,0 +1,16 @@ +import { dimension } from './dimension' + +const schema = dimension({ + type: 'my-unit', + units: ['unit'], + steps: { unit: 1 }, + regenRanges: { unit: [0, 100] }, +}) +describe('dimension() schema', () => { + describe('parse()', () => { + it('succeeds on valid dimension', () => { + const [result] = schema.parse(['1unit']) + expect(result).toEqual({ value: 1, unit: 'unit' }) + }) + }) +}) From e4b01dea70d983a3532147cdfb9d68ad36494543 Mon Sep 17 00:00:00 2001 From: John Otander Date: Mon, 27 Jun 2022 06:32:53 -0600 Subject: [PATCH 009/418] Hide copy node temporarily --- .changeset/moody-eyes-count.md | 5 ++++ .../ui/dropdowns/NodeEditorDropdown.tsx | 27 ++++++++++--------- 2 files changed, 20 insertions(+), 12 deletions(-) create mode 100644 .changeset/moody-eyes-count.md diff --git a/.changeset/moody-eyes-count.md b/.changeset/moody-eyes-count.md new file mode 100644 index 00000000..f495e06c --- /dev/null +++ b/.changeset/moody-eyes-count.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Hide copy node temporarily diff --git a/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx b/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx index 042581cd..d69458e2 100644 --- a/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx +++ b/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx @@ -27,17 +27,19 @@ export const NodeEditorDropdown = ({ - -

- {' '} - Duplicate -

- + {false ? ( + +

+ {' '} + Duplicate +

+ + ) : null}

- Add parent element + {' '} + Add parent element

From 6340841ae09b0d9c4d3f32e25e8e6d3a02e0478e Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Mon, 27 Jun 2022 12:33:56 +0000 Subject: [PATCH 010/418] Version Packages --- .changeset/moody-eyes-count.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/moody-eyes-count.md diff --git a/.changeset/moody-eyes-count.md b/.changeset/moody-eyes-count.md deleted file mode 100644 index f495e06c..00000000 --- a/.changeset/moody-eyes-count.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Hide copy node temporarily diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index f655bb18..c5a91361 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.128 + +### Patch Changes + +- e4b01dea: Hide copy node temporarily + ## 0.0.127 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index e27614b9..61adefd6 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.127", + "version": "0.0.128", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From afc66bf6cfc27a92032ab2a98bf8ffa761d52f6f Mon Sep 17 00:00:00 2001 From: John Otander Date: Mon, 27 Jun 2022 06:39:08 -0600 Subject: [PATCH 011/418] Use correct sign in/up urls --- apps/docs/components/Header.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/docs/components/Header.tsx b/apps/docs/components/Header.tsx index 33690734..761463f2 100644 --- a/apps/docs/components/Header.tsx +++ b/apps/docs/components/Header.tsx @@ -122,7 +122,7 @@ export const Header = () => { color: 'primary', }, }} - href="https://components.ai/signup" + href="https://components.ai/login" > Log in @@ -144,7 +144,7 @@ export const Header = () => { bg: 'primaryHover', }, }} - href="https://components.ai/signin" + href="https://components.ai/signup" > Sign up From 265ab6fde00a993573dbbb9283408956b4b8d798 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Mon, 27 Jun 2022 16:35:00 -0700 Subject: [PATCH 012/418] Remove user select from labels --- packages/gui/src/components/primitives/Label.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gui/src/components/primitives/Label.tsx b/packages/gui/src/components/primitives/Label.tsx index 59bf3906..3804fcb3 100644 --- a/packages/gui/src/components/primitives/Label.tsx +++ b/packages/gui/src/components/primitives/Label.tsx @@ -6,6 +6,6 @@ interface LabelProps extends HTMLAttributes { } export const Label = (props: LabelProps) => { return ( - + ) } From 46040f614f7683b422e951b775d9dc29ac3c3e57 Mon Sep 17 00:00:00 2001 From: John Otander Date: Mon, 27 Jun 2022 19:28:07 -0600 Subject: [PATCH 013/418] Add changeset, fix build --- .changeset/gorgeous-rockets-count.md | 5 +++++ apps/docs/components/Header.tsx | 1 - 2 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 .changeset/gorgeous-rockets-count.md diff --git a/.changeset/gorgeous-rockets-count.md b/.changeset/gorgeous-rockets-count.md new file mode 100644 index 00000000..0d5d44c7 --- /dev/null +++ b/.changeset/gorgeous-rockets-count.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Remove user select from labels diff --git a/apps/docs/components/Header.tsx b/apps/docs/components/Header.tsx index 761463f2..4a9880d7 100644 --- a/apps/docs/components/Header.tsx +++ b/apps/docs/components/Header.tsx @@ -76,7 +76,6 @@ export const Header = () => { Date: Mon, 27 Jun 2022 19:33:55 -0600 Subject: [PATCH 014/418] Fix build --- apps/docs/components/Header.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/apps/docs/components/Header.tsx b/apps/docs/components/Header.tsx index 4a9880d7..d6083a78 100644 --- a/apps/docs/components/Header.tsx +++ b/apps/docs/components/Header.tsx @@ -59,7 +59,6 @@ export const Header = () => { {

- {' '} - Duplicate -

- - ) : null} + +

+ {' '} + Duplicate +

Text Decoration

- - + +

Font

Text Decoration

- + {/* - + */} +

- +

@@ -285,7 +285,7 @@ function NodeEditor({ const { value: fullValue, selected } = useHtmlEditor() const nodeType = value.type === 'text' ? 'text' : 'tag' return ( -

Props

{prop.name}

Props

{prop.name}

Text Decoration

Font

Text Decoration