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 = () => { { Date: Tue, 28 Jun 2022 01:34:41 +0000 Subject: [PATCH 015/418] Version Packages --- .changeset/gorgeous-rockets-count.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/gorgeous-rockets-count.md diff --git a/.changeset/gorgeous-rockets-count.md b/.changeset/gorgeous-rockets-count.md deleted file mode 100644 index 0d5d44c7..00000000 --- a/.changeset/gorgeous-rockets-count.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Remove user select from labels diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index c5a91361..2991c132 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.129 + +### Patch Changes + +- 46040f61: Remove user select from labels + ## 0.0.128 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 61adefd6..b6ae78c4 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.128", + "version": "0.0.129", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From b85fc590e9960bea66d6db384c86a5348ae74da2 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Mon, 27 Jun 2022 19:07:19 -0700 Subject: [PATCH 016/418] fix box-side --- packages/gui/src/components/schemas/box-side.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/gui/src/components/schemas/box-side.tsx b/packages/gui/src/components/schemas/box-side.tsx index 6101907f..e4d03dce 100644 --- a/packages/gui/src/components/schemas/box-side.tsx +++ b/packages/gui/src/components/schemas/box-side.tsx @@ -58,6 +58,8 @@ export function boxSideSchema({ return false } const { top, left, right, bottom } = value + // If *nothing* is defined, it is not a box side + if (!top) return false return compact([top, left, right, bottom]).every((item) => itemSchema.validate(item) ) From f3bf3a5ae43be2ce34f8c330f3fc8b56a6ab0181 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Mon, 27 Jun 2022 19:07:45 -0700 Subject: [PATCH 017/418] re-enable box side regenerate --- packages/gui/src/components/schemas/box-side.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/gui/src/components/schemas/box-side.tsx b/packages/gui/src/components/schemas/box-side.tsx index e4d03dce..13241b3b 100644 --- a/packages/gui/src/components/schemas/box-side.tsx +++ b/packages/gui/src/components/schemas/box-side.tsx @@ -53,6 +53,7 @@ export function boxSideSchema({ type: `${itemSchema.type} {1,4}`, stringify, defaultValue, + regenerate, validate: ((value: any) => { if (typeof value !== 'object') { return false From b3324cd9e1bbe740640e3de1e989b8d6ff653776 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Mon, 27 Jun 2022 19:13:28 -0700 Subject: [PATCH 018/418] fix tuple rendering --- packages/gui/src/components/schemas/tuple.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/gui/src/components/schemas/tuple.tsx b/packages/gui/src/components/schemas/tuple.tsx index 08ce90c4..6836c9dd 100644 --- a/packages/gui/src/components/schemas/tuple.tsx +++ b/packages/gui/src/components/schemas/tuple.tsx @@ -3,6 +3,7 @@ import { DataTypeSchema, RegenOptions } from './types' import * as Toggle from '@radix-ui/react-toggle' import { Link } from 'react-feather' import { SchemaInput } from '../inputs/SchemaInput' +import { replace } from '../../lib/array' interface CreateTupleSchema { itemSchema: DataTypeSchema @@ -56,7 +57,6 @@ export function tupleSchema({ input(props) { const { value, onChange } = props const linked = isLinked(value) - // const ItemInput = itemSchema.input return (
{linkable && ( @@ -75,9 +75,9 @@ export function tupleSchema({ pressed={linked} onPressedChange={(pressed) => { if (pressed) { - props.onChange([value[0]]) + onChange([value[0]]) } else { - props.onChange(labels.map(() => value[0])) + onChange(labels.map(() => value[0])) } }} > @@ -89,7 +89,10 @@ export function tupleSchema({ { + onChange(replace(value, i, newValue)) + }} label="" /> ) From 5d9ad0c1abb6d0694761ddb2d225b8b9b43600f8 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 28 Jun 2022 08:09:44 -0600 Subject: [PATCH 019/418] Add changeset --- .changeset/cyan-buckets-clap.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/cyan-buckets-clap.md diff --git a/.changeset/cyan-buckets-clap.md b/.changeset/cyan-buckets-clap.md new file mode 100644 index 00000000..016c7565 --- /dev/null +++ b/.changeset/cyan-buckets-clap.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Misc bug fixes including tuple handling and box sides From 52d9f407fbe49e44113e317053495b47abf8b15c Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Tue, 28 Jun 2022 14:10:37 +0000 Subject: [PATCH 020/418] Version Packages --- .changeset/cyan-buckets-clap.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/cyan-buckets-clap.md diff --git a/.changeset/cyan-buckets-clap.md b/.changeset/cyan-buckets-clap.md deleted file mode 100644 index 016c7565..00000000 --- a/.changeset/cyan-buckets-clap.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Misc bug fixes including tuple handling and box sides diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 2991c132..52e0c2cf 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.130 + +### Patch Changes + +- 5d9ad0c1: Misc bug fixes including tuple handling and box sides + ## 0.0.129 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index b6ae78c4..1347fad3 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.129", + "version": "0.0.130", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From d9d7d449cd9a9b326356b035c1bb616cbe0a430b Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 28 Jun 2022 11:35:05 -0600 Subject: [PATCH 021/418] Add back node copying, make more robust --- .changeset/tasty-meals-chew.md | 5 ++++ packages/gui/src/components/html/editor.tsx | 24 +++++++++++++++++-- .../ui/dropdowns/NodeEditorDropdown.tsx | 24 +++++++++---------- 3 files changed, 38 insertions(+), 15 deletions(-) create mode 100644 .changeset/tasty-meals-chew.md diff --git a/.changeset/tasty-meals-chew.md b/.changeset/tasty-meals-chew.md new file mode 100644 index 00000000..564926a7 --- /dev/null +++ b/.changeset/tasty-meals-chew.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Add back node copying, make more robust diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index 2b22a064..77903724 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -234,6 +234,12 @@ export function HtmlEditor({ onChange }: HtmlEditorProps) { onChange={(newItem) => onChange(setChildAtPath(value, selected, newItem)) } + onParentChange={(newItem) => { + const parentPath = [...(selected || [])] + parentPath.pop() + const newValue = setChildAtPath(value, parentPath, newItem) + onChange(newValue) + }} onRemove={() => { onChange(removeChildAtPath(value, selected)) const newPath = [...selected] @@ -263,9 +269,15 @@ interface EditorProps { } interface TagEditorProps extends EditorProps { onRemove(): void + onParentChange?(parentValue: HtmlNode): void } -function NodeEditor({ value, onChange, onRemove }: TagEditorProps) { +function NodeEditor({ + value, + onChange, + onRemove, + onParentChange, +}: TagEditorProps) { const { value: fullValue, selected } = useHtmlEditor() const nodeType = value.type === 'text' ? 'text' : 'tag' return ( @@ -305,7 +317,15 @@ function NodeEditor({ value, onChange, onRemove }: TagEditorProps) { const parentPath = [...(selected || [])] const childIndex = parentPath.pop() // Remove child from parent path const parent = getAt(fullValue, parentPath) - onChange(addChildAtPath(parent, [childIndex ?? 0], { ...value })) + + const newParent = addChildAtPath(parent, [childIndex ?? 0], { + ...value, + }) + + const onChangeForParent = onParentChange + ? onParentChange + : onChange + onChangeForParent(newParent) }} onWrap={() => { const wrappedNode: HtmlNode = { diff --git a/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx b/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx index d69458e2..5f00d519 100644 --- a/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx +++ b/packages/gui/src/components/ui/dropdowns/NodeEditorDropdown.tsx @@ -27,19 +27,17 @@ export const NodeEditorDropdown = ({ - {false ? ( - -
- {' '} - Duplicate -
-
- ) : null} + +
+ {' '} + Duplicate +
+
Date: Tue, 28 Jun 2022 18:20:05 +0000 Subject: [PATCH 022/418] Version Packages --- .changeset/tasty-meals-chew.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/tasty-meals-chew.md diff --git a/.changeset/tasty-meals-chew.md b/.changeset/tasty-meals-chew.md deleted file mode 100644 index 564926a7..00000000 --- a/.changeset/tasty-meals-chew.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Add back node copying, make more robust diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 52e0c2cf..16d15996 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.131 + +### Patch Changes + +- d9d7d449: Add back node copying, make more robust + ## 0.0.130 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 1347fad3..e3d7aa20 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.130", + "version": "0.0.131", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 13157ea01d889bad7f456f1a915a41e4b6616503 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 15:35:04 -0700 Subject: [PATCH 023/418] lkajlaksjdlfkajsdlf --- apps/docs/components/examples/Space.tsx | 30 ++++++++++++------- .../gui/src/components/Editor/Controls.tsx | 17 ++++++++++- .../gui/src/components/schemas/object.tsx | 4 +++ packages/gui/src/index.ts | 1 + 4 files changed, 40 insertions(+), 12 deletions(-) diff --git a/apps/docs/components/examples/Space.tsx b/apps/docs/components/examples/Space.tsx index 336b8b84..c0e6d1ff 100644 --- a/apps/docs/components/examples/Space.tsx +++ b/apps/docs/components/examples/Space.tsx @@ -1,17 +1,25 @@ import { useState } from 'react' -import { codegen, Editor, styled, toCSSObject } from '@compai/css-gui' +import { + codegen, + Editor, + parseStyles, + styled, + toCSSObject, +} from '@compai/css-gui' export const SpaceExample = () => { - const [styles, setStyles] = useState({ - marginTop: { value: 1, unit: 'rem' }, - marginBottom: { value: 1, unit: 'rem' }, - marginLeft: { value: 1, unit: 'rem' }, - marginRight: { value: 1, unit: 'rem' }, - paddingTop: { value: 1, unit: 'rem' }, - paddingBottom: { value: 1, unit: 'rem' }, - paddingLeft: { value: 1, unit: 'rem' }, - paddingRight: { value: 1, unit: 'rem' }, - }) + const [styles, setStyles] = useState( + parseStyles({ + marginTop: '1rem', + marginBottom: '1rem', + marginLeft: '1rem', + marginRight: '1rem', + paddingTop: '1rem', + paddingBottom: '1rem', + paddingLeft: '1rem', + paddingRight: '1rem', + }) + ) return (
diff --git a/packages/gui/src/components/Editor/Controls.tsx b/packages/gui/src/components/Editor/Controls.tsx index 262b0215..3f829e0c 100644 --- a/packages/gui/src/components/Editor/Controls.tsx +++ b/packages/gui/src/components/Editor/Controls.tsx @@ -7,7 +7,7 @@ import { ReactNode, useMemo, } from 'react' -import { camelCase, mapValues, uniq } from 'lodash-es' +import { camelCase, isNil, mapValues, uniq } from 'lodash-es' import { RefreshCw } from 'react-feather' import { Styles } from '../../types/css' import { Theme } from '../../types/theme' @@ -36,6 +36,7 @@ import IconButton from '../ui/IconButton' import { SchemaInput } from '../inputs/SchemaInput' import { EditorDropdown } from '../ui/dropdowns/EditorDropdown' import { FieldsetDropdown } from '../ui/dropdowns/FieldsetDropdown' +import { tokenize } from '../../lib/parse' export const getPropertyFromField = (field: KeyArg) => { if (Array.isArray(field)) { @@ -389,3 +390,17 @@ function getPropertiesFromChildren(children: ReactNode): string[] { }) return properties } + +export function parseStyles(styles: Record) { + return mapValues(styles, (value, property) => { + const schema = properties[property] + if (!schema) { + throw new Error(`Parsing unknown property: ${property}`) + } + const [parsed, rest] = schema.parse(tokenize(value)) + if (isNil(parsed) || rest.length > 0) { + throw new Error(`Error parsing given value ${value} into ${property}`) + } + return parsed + }) +} diff --git a/packages/gui/src/components/schemas/object.tsx b/packages/gui/src/components/schemas/object.tsx index 654339e9..aca1cc7d 100644 --- a/packages/gui/src/components/schemas/object.tsx +++ b/packages/gui/src/components/schemas/object.tsx @@ -1,4 +1,5 @@ import { mapValues } from 'lodash-es' +import { Token } from '../../lib/parse' import { getInputProps } from '../../lib/util' import { SchemaInput } from '../inputs/SchemaInput' import { DataTypeSchema, RegenOptions } from './types' @@ -12,6 +13,7 @@ interface CreateObject { stringify?(values: Record): string separator?: string defaultValue?: Partial + parse(tokens: Token[]): [result: T, rest: Token[]] } export function objectSchema({ @@ -21,6 +23,7 @@ export function objectSchema({ separator = ' ', stringify: providedStringify, defaultValue: providedDefaultValue, + parse, }: CreateObject): DataTypeSchema { function stringify(value: T) { if (providedStringify) { @@ -79,5 +82,6 @@ export function objectSchema({ return schema.validate(value[key]) }) }) as any, + parse, } } diff --git a/packages/gui/src/index.ts b/packages/gui/src/index.ts index e07a8057..f263a20d 100644 --- a/packages/gui/src/index.ts +++ b/packages/gui/src/index.ts @@ -26,6 +26,7 @@ export { theme } from './components/ui/theme' export { supportedProperties, unsupportedProperties } from './data/properties' export { allProperties } from './data/css-properties' export { mdnProperties } from './data/mdn-properties' +export { parseStyles } from './components/Editor/Controls' export * from './lib' export * from './types/theme' From 2c516c31162a9b6bfd2cc2ab91abafb30ea41f30 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 16:05:30 -0700 Subject: [PATCH 024/418] get color working --- apps/docs/pages/examples/text-decoration.tsx | 38 +++++++++---------- packages/gui/src/components/schemas/color.ts | 12 ++++++ .../gui/src/components/schemas/object.tsx | 2 +- .../gui/src/components/schemas/options.tsx | 1 + .../gui/src/components/schemas/shorthand.ts | 36 +++++++++++++++++- packages/gui/src/components/schemas/theme.tsx | 3 ++ 6 files changed, 70 insertions(+), 22 deletions(-) diff --git a/apps/docs/pages/examples/text-decoration.tsx b/apps/docs/pages/examples/text-decoration.tsx index 596b5675..c5cd7f95 100644 --- a/apps/docs/pages/examples/text-decoration.tsx +++ b/apps/docs/pages/examples/text-decoration.tsx @@ -1,29 +1,29 @@ import { useState } from 'react' import Link from 'next/link' -import { Editor, Inputs, styled, codegen } from '@compai/css-gui' +import { Editor, Inputs, styled, codegen, parseStyles } from '@compai/css-gui' import { defaultTheme } from '../../data/default-theme' import { Container } from '../../components/Container' -const initialStyles = { - textDecorationColor: { type: 'theme', path: 'primary' }, - textDecorationThickness: { - value: 8, - unit: 'px', - }, +const initialStyles = parseStyles({ + // textDecoration: 'tomato 8px underline wavy', + textDecorationColor: 'tomato', + textDecorationThickness: '8px', textDecorationLine: 'underline', textDecorationStyle: 'wavy', // Font - fontSize: { - value: 3, - unit: 'rem', - }, + fontSize: '3rem', + // fontSize: { + // value: 3, + // unit: 'rem', + // }, letterSpacing: 'initial', - lineHeight: { - value: 1.25, - unit: 'number', - }, - fontFamily: 'Space Mono', -} + lineHeight: '2rem', + // lineHeight: { + // value: 1.25, + // unit: 'number', + // }, + // fontFamily: 'Space Mono', +}) export default function TextDecoration() { const [styles, setStyles] = useState(initialStyles) @@ -43,10 +43,10 @@ export default function TextDecoration() {

Text Decoration

- - + +

Font

diff --git a/packages/gui/src/components/schemas/color.ts b/packages/gui/src/components/schemas/color.ts index 370d3ade..93dba120 100644 --- a/packages/gui/src/components/schemas/color.ts +++ b/packages/gui/src/components/schemas/color.ts @@ -24,6 +24,14 @@ function rawColor({ validate: ((value: any) => { return typeof value === 'string' && isValidColor(value) }) as any, + parse(tokens) { + const [first, ...rest] = tokens + // TODO hsl and stuff will be parsed as functions + if (typeof first === 'string' && isValidColor(first)) { + return [first, rest] + } + return [undefined, tokens] + }, } } @@ -37,6 +45,10 @@ const themeColor: DataTypeSchema = { if (typeof value !== 'object') return false return value.type === 'theme' && typeof value.path === 'string' }) as any, + parse(tokens) { + // TODO aaaargh how are we going to do this + return [undefined, tokens] + }, } export function color({ diff --git a/packages/gui/src/components/schemas/object.tsx b/packages/gui/src/components/schemas/object.tsx index aca1cc7d..1ab77b15 100644 --- a/packages/gui/src/components/schemas/object.tsx +++ b/packages/gui/src/components/schemas/object.tsx @@ -13,7 +13,7 @@ interface CreateObject { stringify?(values: Record): string separator?: string defaultValue?: Partial - parse(tokens: Token[]): [result: T, rest: Token[]] + parse(tokens: Token[]): [result: T | undefined, rest: Token[]] } export function objectSchema({ diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx index de6648ee..17b0ceae 100644 --- a/packages/gui/src/components/schemas/options.tsx +++ b/packages/gui/src/components/schemas/options.tsx @@ -111,6 +111,7 @@ export function optionsSchema>({ // 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)) { + console.log('checking', variantSchema) const [result, rest] = variantSchema.parse(tokens) if (result) { return [result, rest] diff --git a/packages/gui/src/components/schemas/shorthand.ts b/packages/gui/src/components/schemas/shorthand.ts index edab7630..edc3d72c 100644 --- a/packages/gui/src/components/schemas/shorthand.ts +++ b/packages/gui/src/components/schemas/shorthand.ts @@ -1,3 +1,4 @@ +import { isNil } from 'lodash-es' import { objectSchema } from './object' import { DataTypeSchema } from './types' @@ -15,8 +16,6 @@ interface CreateShorthand { /** * Used for objects representing CSS shorthands, like `background` or `border`. * These consist of one or more optional properties. - * - * When certain properties are */ export function shorthandSchema({ type, @@ -38,5 +37,38 @@ export function shorthandSchema({ }) .join(' ') }, + parse(tokens) { + let remaining = [...tokens] + const result: Partial = {} + while (remaining.length > 0) { + let foundMatch = false + // Iterate through the fields to see if we can find a matching parse + for (const key of keyOrder) { + const fieldSchema = fields[key] + // TODO handle slashed fields + const [parsed, rest] = fieldSchema.parse(tokens) + if (!isNil(parsed)) { + result[key] = parsed + remaining = rest + foundMatch = true + break + } + } + if (!foundMatch) { + break + } + } + // If we got no matches at all, then parsing failed + if (Object.keys(result).length === 0) { + return [undefined, tokens] + } + // Fill the rest with defaults + for (const key of keyOrder) { + if (isNil(result[key])) { + result[key] = fields[key].defaultValue + } + } + return [result as T, remaining] + }, }) } diff --git a/packages/gui/src/components/schemas/theme.tsx b/packages/gui/src/components/schemas/theme.tsx index 2de520f4..0fddb20a 100644 --- a/packages/gui/src/components/schemas/theme.tsx +++ b/packages/gui/src/components/schemas/theme.tsx @@ -39,5 +39,8 @@ export function theme(path: string): DataTypeSchema { }, // TODO function version of defaultValue, pass in theme defaultValue: { type: 'theme', path, index: 0 }, + parse(tokens) { + return [undefined, tokens] + }, } } From 7da6aba270b0f8a8f0e21a3fa8f3f75e753108a7 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 16:20:46 -0700 Subject: [PATCH 025/418] handle raw numbers --- apps/docs/pages/examples/text-decoration.tsx | 21 +++++-------------- .../gui/src/components/schemas/dimension.tsx | 5 ++++- .../gui/src/components/schemas/shorthand.ts | 2 +- 3 files changed, 10 insertions(+), 18 deletions(-) diff --git a/apps/docs/pages/examples/text-decoration.tsx b/apps/docs/pages/examples/text-decoration.tsx index c5cd7f95..b89b0ffb 100644 --- a/apps/docs/pages/examples/text-decoration.tsx +++ b/apps/docs/pages/examples/text-decoration.tsx @@ -5,23 +5,11 @@ import { defaultTheme } from '../../data/default-theme' import { Container } from '../../components/Container' const initialStyles = parseStyles({ - // textDecoration: 'tomato 8px underline wavy', - textDecorationColor: 'tomato', - textDecorationThickness: '8px', - textDecorationLine: 'underline', - textDecorationStyle: 'wavy', + textDecoration: 'tomato 8px underline wavy', // Font fontSize: '3rem', - // fontSize: { - // value: 3, - // unit: 'rem', - // }, letterSpacing: 'initial', - lineHeight: '2rem', - // lineHeight: { - // value: 1.25, - // unit: 'number', - // }, + lineHeight: '1.25', // fontFamily: 'Space Mono', }) @@ -42,10 +30,11 @@ export default function TextDecoration() { <>

Text Decoration

- + {/* - + */} +
diff --git a/packages/gui/src/components/schemas/dimension.tsx b/packages/gui/src/components/schemas/dimension.tsx index e3ba92e9..339c5d4f 100644 --- a/packages/gui/src/components/schemas/dimension.tsx +++ b/packages/gui/src/components/schemas/dimension.tsx @@ -8,7 +8,6 @@ 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 @@ -80,6 +79,10 @@ function parseDimension( units: readonly U[] ): UnitValue | undefined { if (typeof token !== 'string') return undefined + // special case handling for raw numbers + if ((units as any).includes('number') && !isNaN(+token)) { + return { value: +token, unit: 'number' as U } + } const unit = units.find((unit) => token.endsWith(unit)) if (!unit) return undefined const numberPart = toNumber(token.replace(unit, '')) diff --git a/packages/gui/src/components/schemas/shorthand.ts b/packages/gui/src/components/schemas/shorthand.ts index edc3d72c..9878db71 100644 --- a/packages/gui/src/components/schemas/shorthand.ts +++ b/packages/gui/src/components/schemas/shorthand.ts @@ -46,7 +46,7 @@ export function shorthandSchema({ for (const key of keyOrder) { const fieldSchema = fields[key] // TODO handle slashed fields - const [parsed, rest] = fieldSchema.parse(tokens) + const [parsed, rest] = fieldSchema.parse(remaining) if (!isNil(parsed)) { result[key] = parsed remaining = rest From 374a8fec3d163034d30406c850e6a1403bfe5225 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 16:29:59 -0700 Subject: [PATCH 026/418] svg --- apps/docs/pages/examples/svg.tsx | 27 ++++---------------- packages/gui/src/components/schemas/list.tsx | 1 + 2 files changed, 6 insertions(+), 22 deletions(-) diff --git a/apps/docs/pages/examples/svg.tsx b/apps/docs/pages/examples/svg.tsx index f925b7df..69c141e7 100644 --- a/apps/docs/pages/examples/svg.tsx +++ b/apps/docs/pages/examples/svg.tsx @@ -1,34 +1,17 @@ -import { codegen, Editor, toCSSObject } from '@compai/css-gui' +import { Editor, parseStyles, toCSSObject } from '@compai/css-gui' import { useState } from 'react' import { defaultTheme } from '../../data/default-theme' -import { Container } from '../../components/Container' -const initialStyles = { +const initialStyles = parseStyles({ stroke: '#fff', fill: 'none', strokeAlignment: 'center', - strokeWidth: { - value: 8, - unit: 'px', - }, + strokeWidth: '8px', strokeLinejoin: 'round', strokeLinecap: 'square', strokeDashadjust: 'dashed', - strokeDashcorner: { - value: 0, - unit: 'px', - }, - strokeDashoffset: { - value: 0, - unit: 'px', - }, - strokeDasharray: [ - { value: 0, unit: 'number' }, - { value: 8, unit: 'number' }, - { value: 0, unit: 'number' }, - { value: 24, unit: 'number' }, - ], -} + strokeDasharray: '1, 20, 1, 15', +}) export default function SvgExample() { const [styles, setStyles] = useState(initialStyles) diff --git a/packages/gui/src/components/schemas/list.tsx b/packages/gui/src/components/schemas/list.tsx index 6e53181d..08bc59c0 100644 --- a/packages/gui/src/components/schemas/list.tsx +++ b/packages/gui/src/components/schemas/list.tsx @@ -69,5 +69,6 @@ function splitArray(array: T[], separator: T) { current.push(item) } } + result.push(current) return result } From 2a7a139227b8ee64807a2293d2cee1e0621cb5ba Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 17:08:27 -0700 Subject: [PATCH 027/418] transitions --- apps/docs/pages/examples/transitions.tsx | 43 ++++--------------- .../components/schemas/easing-function.tsx | 22 ++++++++++ packages/gui/src/components/schemas/list.tsx | 18 +------- .../gui/src/components/schemas/options.tsx | 2 +- packages/gui/src/lib/array.ts | 15 +++++++ packages/gui/src/lib/parse.ts | 2 +- 6 files changed, 50 insertions(+), 52 deletions(-) diff --git a/apps/docs/pages/examples/transitions.tsx b/apps/docs/pages/examples/transitions.tsx index 63b02bbb..4e914617 100644 --- a/apps/docs/pages/examples/transitions.tsx +++ b/apps/docs/pages/examples/transitions.tsx @@ -1,39 +1,14 @@ -import { Editor, styled } from '@compai/css-gui' +import { Editor, parseStyles, styled } from '@compai/css-gui' import { useState } from 'react' -import { Container } from '../../components/Container' -const initialStyles = { - transition: [ - { - timingFunction: { - type: 'cubic-bezier', - p1: 0, - p2: 0, - p3: 1, - p4: 1, - }, - property: 'width', - duration: { value: 250, unit: 'ms' }, - delay: { value: 0, unit: 'ms' }, - }, - { - timingFunction: { - type: 'cubic-bezier', - p1: 0.1, - p2: 0.2, - p3: 0.9, - p4: 0.75, - }, - property: 'background-color', - duration: { value: 350, unit: 'ms' }, - delay: { value: 0, unit: 'ms' }, - }, - ], - width: { value: 100, unit: '%' }, - height: { value: 240, unit: 'px' }, - borderRadius: { value: 0, unit: 'px' }, - backgroundColor: { type: 'theme', path: 'primary' }, -} +const initialStyles = parseStyles({ + transition: + 'width 250ms cubic-bezier(0, 0, 1, 0), background-color 350ms cubic-bezier(0.1, 0.2, 0.9, 0.75)', + width: '100%', + height: '240px', + // TODO theme colors again + backgroundColor: 'rebeccapurple', +}) export default function Transitions() { const [styles, setStyles] = useState(initialStyles) diff --git a/packages/gui/src/components/schemas/easing-function.tsx b/packages/gui/src/components/schemas/easing-function.tsx index 96a8e0c2..976055b1 100644 --- a/packages/gui/src/components/schemas/easing-function.tsx +++ b/packages/gui/src/components/schemas/easing-function.tsx @@ -1,3 +1,4 @@ +import { split } from '../../lib/array' import { EasingFunctionEditor } from '../inputs/EasingFunction' import { keywordValues } from '../inputs/EasingFunction/keywords' import { stringifyEasingFunction } from '../inputs/EasingFunction/stringify' @@ -30,6 +31,27 @@ const rawEasingFunction: DataTypeSchema = { } } }) as any, + parse(tokens) { + const [first, ...rest] = tokens + // ensure the easing function uses function syntax + if (typeof first === 'string') return [undefined, tokens] + const { name, arguments: args } = first + if (name === 'cubic-bezier') { + const [p1, p2, p3, p4] = args + .join('') + .split(',') + .map((p) => +p) + return [{ type: 'cubic-bezier', p1, p2, p3, p4 }, rest] + } + if (name === 'steps') { + const [numberOfSteps, direction] = args.join('').split(',') + return [ + { type: 'steps', stops: +numberOfSteps, jumpTerm: direction as any }, + rest, + ] + } + return [undefined, tokens] + }, } export const easingFunction = joinSchemas([ diff --git a/packages/gui/src/components/schemas/list.tsx b/packages/gui/src/components/schemas/list.tsx index 08bc59c0..b7999ba5 100644 --- a/packages/gui/src/components/schemas/list.tsx +++ b/packages/gui/src/components/schemas/list.tsx @@ -1,3 +1,4 @@ +import { split } from '../../lib/array' import FieldArray from '../FieldArray' import { DataTypeSchema, RegenOptions } from './types' @@ -40,7 +41,7 @@ export function listSchema({ const parseSeperator = separator.trim() // Split the tokens based on the separator const ensplittenedTokens = parseSeperator - ? splitArray(tokens, parseSeperator) + ? split(tokens, parseSeperator) : tokens.map((t) => [t]) const results = [] @@ -57,18 +58,3 @@ export function listSchema({ }, } } - -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) - } - } - result.push(current) - return result -} diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx index 17b0ceae..c21f0d8d 100644 --- a/packages/gui/src/components/schemas/options.tsx +++ b/packages/gui/src/components/schemas/options.tsx @@ -111,7 +111,7 @@ export function optionsSchema>({ // 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)) { - console.log('checking', variantSchema) + console.log('checking', variantSchema.type, 'on', tokens) const [result, rest] = variantSchema.parse(tokens) if (result) { return [result, rest] diff --git a/packages/gui/src/lib/array.ts b/packages/gui/src/lib/array.ts index f4ad94f9..672f411f 100644 --- a/packages/gui/src/lib/array.ts +++ b/packages/gui/src/lib/array.ts @@ -18,3 +18,18 @@ export function replace(array: T[], index: number, newValue: T) { copy.splice(index, 1, newValue) return copy } + +export function split(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) + } + } + result.push(current) + return result +} diff --git a/packages/gui/src/lib/parse.ts b/packages/gui/src/lib/parse.ts index 5240b1d1..27a15ef2 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 ea271f92af9573d9c18513958ac241e532123c66 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 28 Jun 2022 19:30:04 -0600 Subject: [PATCH 028/418] Make sure font family is applied --- .changeset/cyan-snails-float.md | 5 +++++ packages/gui/src/lib/codegen/to-css-object.ts | 8 +++----- 2 files changed, 8 insertions(+), 5 deletions(-) create mode 100644 .changeset/cyan-snails-float.md diff --git a/.changeset/cyan-snails-float.md b/.changeset/cyan-snails-float.md new file mode 100644 index 00000000..43d44168 --- /dev/null +++ b/.changeset/cyan-snails-float.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Stringify font family diff --git a/packages/gui/src/lib/codegen/to-css-object.ts b/packages/gui/src/lib/codegen/to-css-object.ts index 45da2fcb..9121d246 100644 --- a/packages/gui/src/lib/codegen/to-css-object.ts +++ b/packages/gui/src/lib/codegen/to-css-object.ts @@ -19,11 +19,9 @@ export const stringifyProperty = ( } } - // // font-family? - // if (!isCSSUnitValue(value)) { - // return String(value) ?? null - // } - // return stringifyUnit(value, theme) + if (property === 'fontFamily') { + return String(value) ?? null + } } type StyleEntry = [string, Length | string | null | undefined] From 8823ee2a0bbce6dffac0866de2ee2446164d61ab Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Tue, 28 Jun 2022 18:32:59 -0700 Subject: [PATCH 029/418] fix typecheck for now --- packages/gui/src/components/Editor/Controls.tsx | 2 +- .../gui/src/components/schemas/dimension.test.ts | 16 ---------------- packages/gui/src/components/schemas/function.tsx | 2 +- packages/gui/src/components/schemas/list.tsx | 2 +- packages/gui/src/components/schemas/object.tsx | 2 +- packages/gui/src/components/schemas/shorthand.ts | 2 +- packages/gui/src/components/schemas/types.ts | 2 +- 7 files changed, 6 insertions(+), 22 deletions(-) delete mode 100644 packages/gui/src/components/schemas/dimension.test.ts diff --git a/packages/gui/src/components/Editor/Controls.tsx b/packages/gui/src/components/Editor/Controls.tsx index 3f829e0c..31ca5a7f 100644 --- a/packages/gui/src/components/Editor/Controls.tsx +++ b/packages/gui/src/components/Editor/Controls.tsx @@ -397,7 +397,7 @@ export function parseStyles(styles: Record) { if (!schema) { throw new Error(`Parsing unknown property: ${property}`) } - const [parsed, rest] = schema.parse(tokenize(value)) + const [parsed, rest] = schema.parse!(tokenize(value)) if (isNil(parsed) || rest.length > 0) { throw new Error(`Error parsing given value ${value} into ${property}`) } diff --git a/packages/gui/src/components/schemas/dimension.test.ts b/packages/gui/src/components/schemas/dimension.test.ts deleted file mode 100644 index b0f758ce..00000000 --- a/packages/gui/src/components/schemas/dimension.test.ts +++ /dev/null @@ -1,16 +0,0 @@ -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' }) - }) - }) -}) diff --git a/packages/gui/src/components/schemas/function.tsx b/packages/gui/src/components/schemas/function.tsx index 5e5fe09d..7dca4e6f 100644 --- a/packages/gui/src/components/schemas/function.tsx +++ b/packages/gui/src/components/schemas/function.tsx @@ -53,7 +53,7 @@ export function functionSchema( 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) + const [argsResult, argsRest] = argsSchema.parse!(parseArgs) if (isNil(argsResult) || argsRest.length > 0) return [undefined, tokens] return [{ name, arguments: argsResult }, rest] }, diff --git a/packages/gui/src/components/schemas/list.tsx b/packages/gui/src/components/schemas/list.tsx index b7999ba5..e4f6cf84 100644 --- a/packages/gui/src/components/schemas/list.tsx +++ b/packages/gui/src/components/schemas/list.tsx @@ -46,7 +46,7 @@ export function listSchema({ const results = [] for (const tokenGroup of ensplittenedTokens) { - const [result, rest] = itemSchema.parse(tokenGroup) + 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] diff --git a/packages/gui/src/components/schemas/object.tsx b/packages/gui/src/components/schemas/object.tsx index 1ab77b15..2f773d72 100644 --- a/packages/gui/src/components/schemas/object.tsx +++ b/packages/gui/src/components/schemas/object.tsx @@ -13,7 +13,7 @@ interface CreateObject { stringify?(values: Record): string separator?: string defaultValue?: Partial - parse(tokens: Token[]): [result: T | undefined, rest: Token[]] + parse?(tokens: Token[]): [result: T | undefined, rest: Token[]] } export function objectSchema({ diff --git a/packages/gui/src/components/schemas/shorthand.ts b/packages/gui/src/components/schemas/shorthand.ts index 9878db71..5c19a3e6 100644 --- a/packages/gui/src/components/schemas/shorthand.ts +++ b/packages/gui/src/components/schemas/shorthand.ts @@ -46,7 +46,7 @@ export function shorthandSchema({ for (const key of keyOrder) { const fieldSchema = fields[key] // TODO handle slashed fields - const [parsed, rest] = fieldSchema.parse(remaining) + const [parsed, rest] = fieldSchema.parse!(remaining) if (!isNil(parsed)) { result[key] = parsed remaining = rest diff --git a/packages/gui/src/components/schemas/types.ts b/packages/gui/src/components/schemas/types.ts index 901b94d2..67e04585 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: Token[]] + parse?(tokens: Token[]): [result: T | undefined, rest: Token[]] } export interface RegenOptions { From 938bf3be4fd6506ac92adb74da79423a6652dd3a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 29 Jun 2022 01:33:59 +0000 Subject: [PATCH 030/418] Version Packages --- .changeset/cyan-snails-float.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/cyan-snails-float.md diff --git a/.changeset/cyan-snails-float.md b/.changeset/cyan-snails-float.md deleted file mode 100644 index 43d44168..00000000 --- a/.changeset/cyan-snails-float.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Stringify font family diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 16d15996..18f53e6e 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.132 + +### Patch Changes + +- ea271f92: Stringify font family + ## 0.0.131 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index e3d7aa20..0c2b81cb 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.131", + "version": "0.0.132", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From cbac582ab73b78a3765dab251d35be027a4ea513 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 28 Jun 2022 19:39:49 -0600 Subject: [PATCH 031/418] Don't use old color shape --- .changeset/old-dingos-invent.md | 5 +++++ packages/gui/src/components/inputs/Gradient/stops.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/old-dingos-invent.md diff --git a/.changeset/old-dingos-invent.md b/.changeset/old-dingos-invent.md new file mode 100644 index 00000000..acfd5626 --- /dev/null +++ b/.changeset/old-dingos-invent.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Don't use old color shape diff --git a/packages/gui/src/components/inputs/Gradient/stops.tsx b/packages/gui/src/components/inputs/Gradient/stops.tsx index e7de0847..6975910d 100644 --- a/packages/gui/src/components/inputs/Gradient/stops.tsx +++ b/packages/gui/src/components/inputs/Gradient/stops.tsx @@ -72,7 +72,7 @@ export default function GradientStopsField({ onChange([ ...value, { - color: { value: randomColor() }, + color: randomColor(), hinting: randomInt(0, 100), }, ]) From a0439c30f3c86d13314153fe27260c20f49b9e81 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 29 Jun 2022 01:40:45 +0000 Subject: [PATCH 032/418] Version Packages --- .changeset/old-dingos-invent.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/old-dingos-invent.md diff --git a/.changeset/old-dingos-invent.md b/.changeset/old-dingos-invent.md deleted file mode 100644 index acfd5626..00000000 --- a/.changeset/old-dingos-invent.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Don't use old color shape diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 18f53e6e..23666614 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.133 + +### Patch Changes + +- cbac582a: Don't use old color shape + ## 0.0.132 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 0c2b81cb..589cff03 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.132", + "version": "0.0.133", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 50b691fd5849f26154f66b678f1f6cb9a58bd8c4 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 12:19:35 -0600 Subject: [PATCH 033/418] Adjust height and width ranges --- .changeset/perfect-maps-cross.md | 5 +++++ packages/gui/src/data/properties.ts | 8 ++++---- 2 files changed, 9 insertions(+), 4 deletions(-) create mode 100644 .changeset/perfect-maps-cross.md diff --git a/.changeset/perfect-maps-cross.md b/.changeset/perfect-maps-cross.md new file mode 100644 index 00000000..6fd32887 --- /dev/null +++ b/.changeset/perfect-maps-cross.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Adjust height/width default values diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index 6fd9dca2..18597244 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -823,8 +823,8 @@ export const rawProperties: Record = { keywords: ['max-content', 'min-content', 'auto'], range: { [AbsoluteLengthUnits.Px]: [0, 2160], - [FontRelativeLengthUnits.Em]: [0, 16], - [FontRelativeLengthUnits.Rem]: [0, 16], + [FontRelativeLengthUnits.Em]: [0, 256], + [FontRelativeLengthUnits.Rem]: [0, 256], [PercentageLengthUnits.Pct]: [0.1, 200], [ViewportPercentageLengthUnits.Vh]: [0, 100], [ViewportPercentageLengthUnits.Vw]: [0, 100], @@ -1571,8 +1571,8 @@ export const rawProperties: Record = { keywords: ['max-content', 'min-content', 'auto'], range: { [AbsoluteLengthUnits.Px]: [0, 3840], - [FontRelativeLengthUnits.Em]: [0, 16], - [FontRelativeLengthUnits.Rem]: [0, 16], + [FontRelativeLengthUnits.Em]: [0, 256], + [FontRelativeLengthUnits.Rem]: [0, 256], [PercentageLengthUnits.Pct]: [0.1, 200], [ViewportPercentageLengthUnits.Vh]: [0, 100], [ViewportPercentageLengthUnits.Vw]: [0, 100], From 4790114fbd148f6c2574c7fd2479ee4f9a88eed3 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 12:23:31 -0600 Subject: [PATCH 034/418] Don't error when the theme path doesn't exist --- .changeset/friendly-turtles-rhyme.md | 5 +++++ packages/gui/src/components/schemas/theme.tsx | 3 +-- 2 files changed, 6 insertions(+), 2 deletions(-) create mode 100644 .changeset/friendly-turtles-rhyme.md diff --git a/.changeset/friendly-turtles-rhyme.md b/.changeset/friendly-turtles-rhyme.md new file mode 100644 index 00000000..57d4b163 --- /dev/null +++ b/.changeset/friendly-turtles-rhyme.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Don't error when the theme path doesn't exist diff --git a/packages/gui/src/components/schemas/theme.tsx b/packages/gui/src/components/schemas/theme.tsx index 0fddb20a..935bc675 100644 --- a/packages/gui/src/components/schemas/theme.tsx +++ b/packages/gui/src/components/schemas/theme.tsx @@ -2,7 +2,6 @@ import { useTheme } from '@emotion/react' import { get, range } from 'lodash-es' import { ThemeValue } from '../../types/css' import { SelectInput } from '../inputs/SelectInput' -import { length } from './primitives' import { DataTypeSchema } from './types' export function theme(path: string): DataTypeSchema { @@ -21,7 +20,7 @@ export function theme(path: string): DataTypeSchema { }, inlineInput(props) { const theme = useTheme() - const numOptions = get(theme, path).length + const numOptions = get(theme, path)?.length || 0 return ( Date: Wed, 29 Jun 2022 18:24:23 +0000 Subject: [PATCH 035/418] Version Packages --- .changeset/friendly-turtles-rhyme.md | 5 ----- .changeset/perfect-maps-cross.md | 5 ----- packages/gui/CHANGELOG.md | 7 +++++++ packages/gui/package.json | 2 +- 4 files changed, 8 insertions(+), 11 deletions(-) delete mode 100644 .changeset/friendly-turtles-rhyme.md delete mode 100644 .changeset/perfect-maps-cross.md diff --git a/.changeset/friendly-turtles-rhyme.md b/.changeset/friendly-turtles-rhyme.md deleted file mode 100644 index 57d4b163..00000000 --- a/.changeset/friendly-turtles-rhyme.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Don't error when the theme path doesn't exist diff --git a/.changeset/perfect-maps-cross.md b/.changeset/perfect-maps-cross.md deleted file mode 100644 index 6fd32887..00000000 --- a/.changeset/perfect-maps-cross.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Adjust height/width default values diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 23666614..e236e9e6 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,12 @@ # @compai/css-gui +## 0.0.134 + +### Patch Changes + +- 4790114f: Don't error when the theme path doesn't exist +- 50b691fd: Adjust height/width default values + ## 0.0.133 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 589cff03..6ce89a9b 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.133", + "version": "0.0.134", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 5bfb117dc20f42fe7f30a5c955aed79b50c4abed Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 13:31:25 -0600 Subject: [PATCH 036/418] Set default value of height to 100% for now --- .changeset/fair-houses-reflect.md | 5 +++++ packages/gui/src/data/properties.ts | 5 ++++- 2 files changed, 9 insertions(+), 1 deletion(-) create mode 100644 .changeset/fair-houses-reflect.md diff --git a/.changeset/fair-houses-reflect.md b/.changeset/fair-houses-reflect.md new file mode 100644 index 00000000..4546be97 --- /dev/null +++ b/.changeset/fair-houses-reflect.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Change default length value for height diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index 18597244..13546508 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -831,7 +831,10 @@ export const rawProperties: Record = { [ViewportPercentageLengthUnits.VMin]: [0, 100], [ViewportPercentageLengthUnits.VMax]: [0, 100], }, - defaultValue: 'auto', + defaultValue: { + value: 100, + unit: '%', + }, themeProperty: 'sizes', }, hyphenateCharacter: { From f4da0bd436b6317bc0a313042c385d2c73f5a706 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 29 Jun 2022 19:32:37 +0000 Subject: [PATCH 037/418] Version Packages --- .changeset/fair-houses-reflect.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/fair-houses-reflect.md diff --git a/.changeset/fair-houses-reflect.md b/.changeset/fair-houses-reflect.md deleted file mode 100644 index 4546be97..00000000 --- a/.changeset/fair-houses-reflect.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Change default length value for height diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index e236e9e6..41a4d924 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.135 + +### Patch Changes + +- 5bfb117d: Change default length value for height + ## 0.0.134 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 6ce89a9b..0b909014 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.134", + "version": "0.0.135", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From af3185f5ede2881bdae9e264ec7d02d0100101c7 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 14:03:59 -0600 Subject: [PATCH 038/418] Default z index to 1 --- .changeset/ninety-parents-dress.md | 5 +++++ packages/gui/src/data/properties.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/ninety-parents-dress.md diff --git a/.changeset/ninety-parents-dress.md b/.changeset/ninety-parents-dress.md new file mode 100644 index 00000000..6b121b9f --- /dev/null +++ b/.changeset/ninety-parents-dress.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Default z index to 1 diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index 13546508..f9a04805 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -1634,7 +1634,7 @@ export const rawProperties: Record = { zIndex: { input: 'integer', keywords: ['auto'], - defaultValue: 'auto', + defaultValue: 1, }, } From e384376ca2267d4f4eeaa8f19857f7cd498c0f9d Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 29 Jun 2022 20:04:58 +0000 Subject: [PATCH 039/418] Version Packages --- .changeset/ninety-parents-dress.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/ninety-parents-dress.md diff --git a/.changeset/ninety-parents-dress.md b/.changeset/ninety-parents-dress.md deleted file mode 100644 index 6b121b9f..00000000 --- a/.changeset/ninety-parents-dress.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Default z index to 1 diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 41a4d924..2ca845ab 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.136 + +### Patch Changes + +- af3185f5: Default z index to 1 + ## 0.0.135 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 0b909014..ed99149d 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.135", + "version": "0.0.136", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From e1c1e7128fc763ad3457185076d351a93673457e Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Wed, 29 Jun 2022 13:54:10 -0700 Subject: [PATCH 040/418] take out the background --- packages/gui/src/components/schemas/options.tsx | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx index c21f0d8d..417b5c98 100644 --- a/packages/gui/src/components/schemas/options.tsx +++ b/packages/gui/src/components/schemas/options.tsx @@ -53,13 +53,7 @@ export function optionsSchema>({ // Render the select return (
- {InlineInput ? ( - - ) : ( - - {variants[type].stringify(props.value)} - - )} + {InlineInput && } { From 01ff14d5b4b1b2a978ec359c6cacf1f99b891773 Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Wed, 29 Jun 2022 14:10:51 -0700 Subject: [PATCH 041/418] set defaults for length --- packages/gui/src/data/properties.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index f9a04805..310220cd 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -104,8 +104,8 @@ function normalizeSchema(propertyData: PropertyData): DataTypeSchema { let schema = primitiveMap[input](propertyData) as any return joinSchemas( compact([ - keywords && keyword(keywords), schema, + keywords && keyword(keywords), themeProperty && theme(themeProperty), ]) ) From e47733fc41a4cf50a6d375e0779cef93bd1b950e Mon Sep 17 00:00:00 2001 From: Nat Alison <1278991+tesseralis@users.noreply.github.com> Date: Wed, 29 Jun 2022 14:25:10 -0700 Subject: [PATCH 042/418] default for grid-template --- packages/gui/src/components/schemas/grid.tsx | 35 ++++++++++++-------- 1 file changed, 21 insertions(+), 14 deletions(-) diff --git a/packages/gui/src/components/schemas/grid.tsx b/packages/gui/src/components/schemas/grid.tsx index 4bad7468..c3f631dd 100644 --- a/packages/gui/src/components/schemas/grid.tsx +++ b/packages/gui/src/components/schemas/grid.tsx @@ -9,7 +9,11 @@ const inflexibleBreadth = joinSchemas([ keyword(['min-content', 'max-content', 'auto']), ]) const trackBreadth = joinSchemas([ - lengthPercentage({ range: 'nonnegative', flex: true }), + lengthPercentage({ + range: 'nonnegative', + flex: true, + defaultValue: { value: 1, unit: 'fr' }, + }), keyword(['min-content', 'max-content', 'auto']), ]) @@ -25,19 +29,22 @@ const trackSize = joinSchemas([ functionSchema('fit-content', lengthPercentage()), ]) -const trackList = joinSchemas([ - trackSize, - functionSchema( - 'repeat', - objectSchema({ - fields: { - count: integer({ defaultValue: 1 }), - trackList: listSchema({ itemSchema: trackSize, separator: ' ' }), - }, - separator: ', ', - }) - ), -]) +const trackList = joinSchemas( + [ + trackSize, + functionSchema( + 'repeat', + objectSchema({ + fields: { + count: integer({ defaultValue: 3 }), + trackList: listSchema({ itemSchema: trackSize, separator: ' ' }), + }, + separator: ', ', + }) + ), + ], + { defaultType: 'repeat' } +) export const gridAutoRow = listSchema({ itemSchema: trackSize, separator: ' ' }) export const gridAutoColumns = listSchema({ From 6df72919c453db1d6147392e46fea003565afd63 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 15:32:48 -0600 Subject: [PATCH 043/418] Hide none schema type None schema types, like fontVariationSettings, are skipped in rendering and don't bother with stringifying. This can be used for properties that are dependent on others (like variable fonts). In the future we can likely make this fontVariationSettings specific since this is currently the only place this behavior is implemented. But this works for now. --- .changeset/long-beds-visit.md | 5 +++++ packages/gui/src/components/Editor/Controls.tsx | 4 ++++ packages/gui/src/components/schemas/topLevel.ts | 4 +++- packages/gui/src/data/properties.ts | 7 +++++++ 4 files changed, 19 insertions(+), 1 deletion(-) create mode 100644 .changeset/long-beds-visit.md diff --git a/.changeset/long-beds-visit.md b/.changeset/long-beds-visit.md new file mode 100644 index 00000000..5b036f51 --- /dev/null +++ b/.changeset/long-beds-visit.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Properly hide none schema type, tie in variable fonts diff --git a/packages/gui/src/components/Editor/Controls.tsx b/packages/gui/src/components/Editor/Controls.tsx index 31ca5a7f..db845e33 100644 --- a/packages/gui/src/components/Editor/Controls.tsx +++ b/packages/gui/src/components/Editor/Controls.tsx @@ -84,6 +84,10 @@ const Control = ({ field, showRemove = false, ...props }: ControlProps) => { const schema = properties[property] + if (schema.type === 'none') { + return null + } + return ( (schema: DataTypeSchema, property: string) { - if (property === 'fontFamily') { + if (NO_GLOBAL_SCHEMA_PROPERTIES.includes(property)) { return schema } const withGlobal = joinSchemas([schema, global]) diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index f9a04805..7cd59b40 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -100,6 +100,13 @@ function normalizeSchema(propertyData: PropertyData): DataTypeSchema { if (input === 'keyword') { // const { keywords = [], ...rest } = propertyData return keyword(keywords!, propertyData) + } else if (input === 'none') { + return { + type: 'none', + defaultValue: null, + validate: (() => true) as any, + stringify: (value) => String(value), + } } else { let schema = primitiveMap[input](propertyData) as any return joinSchemas( From d729f2ec83322e1f10b1d31a3d9bcf7a5fe3303d Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 15:57:15 -0600 Subject: [PATCH 044/418] Use direct strings for keywords --- packages/gui/src/data/properties.ts | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/packages/gui/src/data/properties.ts b/packages/gui/src/data/properties.ts index cad66f90..c40d1c4a 100644 --- a/packages/gui/src/data/properties.ts +++ b/packages/gui/src/data/properties.ts @@ -273,7 +273,7 @@ export const rawProperties: Record = { input: 'length', percentage: true, keywords: ['max-content', 'min-content', 'auto'], - defaultValue: { value: 'auto', unit: 'keyword' }, + defaultValue: 'auto', themeProperty: 'sizes', }, borderCollapse: { @@ -542,7 +542,7 @@ export const rawProperties: Record = { 'fit-content', 'content', ], - defaultValue: { value: 'auto', unit: 'keyword' }, + defaultValue: 'auto', themeProperty: 'sizes', }, flexDirection: { @@ -1548,10 +1548,7 @@ export const rawProperties: Record = { 'top', 'bottom', ], - defaultValue: { - value: 'baseline', - unit: 'keyword', - }, + defaultValue: 'baseline', }, visibility: { input: 'keyword', From a321a065c69e302ac0bcdf33e0fc1e5459634537 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 29 Jun 2022 21:58:14 +0000 Subject: [PATCH 045/418] Version Packages --- .changeset/long-beds-visit.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/long-beds-visit.md diff --git a/.changeset/long-beds-visit.md b/.changeset/long-beds-visit.md deleted file mode 100644 index 5b036f51..00000000 --- a/.changeset/long-beds-visit.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Properly hide none schema type, tie in variable fonts diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 2ca845ab..8d852cc9 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.137 + +### Patch Changes + +- 6df72919: Properly hide none schema type, tie in variable fonts + ## 0.0.136 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index ed99149d..921a79bf 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.136", + "version": "0.0.137", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 6ad62f6669dc003d2e6ca96f63e9f23ae9dc001d Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 29 Jun 2022 19:41:10 -0600 Subject: [PATCH 046/418] Add a couple svg elements and some of their attrs --- .changeset/fluffy-garlics-raise.md | 5 + .../gui/src/components/html/default-styles.ts | 7 + packages/gui/src/components/html/editor.tsx | 14 +- packages/gui/src/components/html/types.ts | 8 +- packages/gui/src/data/attributes.ts | 136 +++++++----------- 5 files changed, 80 insertions(+), 90 deletions(-) create mode 100644 .changeset/fluffy-garlics-raise.md diff --git a/.changeset/fluffy-garlics-raise.md b/.changeset/fluffy-garlics-raise.md new file mode 100644 index 00000000..50524ca1 --- /dev/null +++ b/.changeset/fluffy-garlics-raise.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Add some basic SVG functionality diff --git a/packages/gui/src/components/html/default-styles.ts b/packages/gui/src/components/html/default-styles.ts index db2100bb..b1452f52 100644 --- a/packages/gui/src/components/html/default-styles.ts +++ b/packages/gui/src/components/html/default-styles.ts @@ -11,3 +11,10 @@ export const DEFAULT_STYLES: Record = { [HTMLTag.H5]: { textAlign: 'left' }, [HTMLTag.H6]: { textAlign: 'left' }, } + +export const DEFAULT_ATTRIBUTES: Record = { + [HTMLTag.Svg]: { + version: '1.1', + xmlns: 'http://www.w3.org/2000/svg', + }, +} diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index 77903724..e475f6c8 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -8,7 +8,7 @@ import { Code, Layers, X } from 'react-feather' import { Label, Combobox } from '../primitives' import { SelectInput } from '../inputs/SelectInput' import { AttributeEditor } from './AttributeEditor' -import { DEFAULT_STYLES } from './default-styles' +import { DEFAULT_ATTRIBUTES, DEFAULT_STYLES } from './default-styles' import { useHtmlEditor } from './Provider' import { isVoidElement } from '../../lib/elements' import { isSamePath } from './util' @@ -112,6 +112,12 @@ const HTML_TAGS = [ HTMLTag.Var, HTMLTag.Video, HTMLTag.Wbr, + HTMLTag.Svg, + HTMLTag.Circle, + HTMLTag.Line, + HTMLTag.Rect, + HTMLTag.Path, + HTMLTag.Text, ] interface HtmlEditorProps { @@ -389,8 +395,14 @@ function NodeSwitch({ value, onChange }: EditorProps) { onItemSelected={(selectedItem) => { const defaultStyles = DEFAULT_STYLES[selectedItem] || {} const mergedStyles = { ...defaultStyles, ...value.style } + const defaultAttributes = DEFAULT_ATTRIBUTES[selectedItem] || {} + const mergedAttributes = { + ...defaultAttributes, + ...(value.attributes || {}), + } onChange({ ...value, + attributes: mergedAttributes, tagName: selectedItem, style: mergedStyles, }) diff --git a/packages/gui/src/components/html/types.ts b/packages/gui/src/components/html/types.ts index 68c6caad..d98511ff 100644 --- a/packages/gui/src/components/html/types.ts +++ b/packages/gui/src/components/html/types.ts @@ -67,7 +67,7 @@ export const enum HTMLTag { Menuitem = 'menuitem', Meter = 'meter', Nav = 'nav', - Noscript ='noscript', + Noscript = 'noscript', Ol = 'ol', Optgroup = 'optgroup', Option = 'option', @@ -108,4 +108,10 @@ export const enum HTMLTag { Var = 'var', Video = 'video', Wbr = 'wbr', + Svg = 'svg', + Circle = 'circle', + Line = 'line', + Path = 'path', + Rect = 'rect', + Text = 'text', } diff --git a/packages/gui/src/data/attributes.ts b/packages/gui/src/data/attributes.ts index fd188ef1..3bf0baf5 100644 --- a/packages/gui/src/data/attributes.ts +++ b/packages/gui/src/data/attributes.ts @@ -1,14 +1,14 @@ -const GLOBAL_ATTRIBUTES = ['class', 'id', 'title',] +const GLOBAL_ATTRIBUTES = ['class', 'id', 'title'] export const ATTRIBUTE_MAP: Record = { a: [ - ...GLOBAL_ATTRIBUTES, - 'href', - 'target', - 'download', - 'hreflang', - 'referrerpolicy', - 'rel' + ...GLOBAL_ATTRIBUTES, + 'href', + 'target', + 'download', + 'hreflang', + 'referrerpolicy', + 'rel', ], abbr: GLOBAL_ATTRIBUTES, address: GLOBAL_ATTRIBUTES, @@ -28,50 +28,42 @@ export const ATTRIBUTE_MAP: Record = { b: GLOBAL_ATTRIBUTES, bdi: GLOBAL_ATTRIBUTES, bdo: GLOBAL_ATTRIBUTES, - blockquote: [ ...GLOBAL_ATTRIBUTES, 'cite' ], + blockquote: [...GLOBAL_ATTRIBUTES, 'cite'], br: GLOBAL_ATTRIBUTES, button: [ - 'type', - 'disabled', - 'name', - 'value', + 'type', + 'disabled', + 'name', + 'value', 'autofocus', - 'form', - 'formaction', + 'form', + 'formaction', 'formenctype', 'formnovalidate', 'formtarget', - 'formmethod', + 'formmethod', 'step', - 'formnovalidate', - 'formtarget', + 'formnovalidate', + 'formtarget', ], caption: GLOBAL_ATTRIBUTES, cite: GLOBAL_ATTRIBUTES, code: GLOBAL_ATTRIBUTES, col: GLOBAL_ATTRIBUTES, colgroup: GLOBAL_ATTRIBUTES, - data: [ - ...GLOBAL_ATTRIBUTES, - 'datetime', - ], + data: [...GLOBAL_ATTRIBUTES, 'datetime'], datalist: GLOBAL_ATTRIBUTES, dd: GLOBAL_ATTRIBUTES, del: GLOBAL_ATTRIBUTES, details: GLOBAL_ATTRIBUTES, dfn: GLOBAL_ATTRIBUTES, - dialog: [...GLOBAL_ATTRIBUTES, 'open' ], + dialog: [...GLOBAL_ATTRIBUTES, 'open'], div: GLOBAL_ATTRIBUTES, dl: GLOBAL_ATTRIBUTES, dt: GLOBAL_ATTRIBUTES, em: GLOBAL_ATTRIBUTES, - fieldset: [ - ...GLOBAL_ATTRIBUTES, - 'disabled', - 'form', - 'name', - ], - figcaption: GLOBAL_ATTRIBUTES, + fieldset: [...GLOBAL_ATTRIBUTES, 'disabled', 'form', 'name'], + figcaption: GLOBAL_ATTRIBUTES, figure: GLOBAL_ATTRIBUTES, footer: GLOBAL_ATTRIBUTES, form: [ @@ -96,10 +88,10 @@ export const ATTRIBUTE_MAP: Record = { hr: GLOBAL_ATTRIBUTES, i: GLOBAL_ATTRIBUTES, img: [ - ...GLOBAL_ATTRIBUTES, - 'alt', - 'src', - 'srcset', + ...GLOBAL_ATTRIBUTES, + 'alt', + 'src', + 'srcset', 'width', 'height', 'sizes', @@ -111,16 +103,16 @@ export const ATTRIBUTE_MAP: Record = { 'crossorigin', ], input: [ - ...GLOBAL_ATTRIBUTES, + ...GLOBAL_ATTRIBUTES, // TODO: Adjust attribute list based on type value - 'type', + 'type', 'value', // all - 'name', // all - 'disabled', // almost all + 'name', // all + 'disabled', // almost all 'required', // almost all - 'checked', // radio, checkbox + 'checked', // radio, checkbox 'autocomplete', // all - 'dirname', // text, search + 'dirname', // text, search 'form', // all 'formaction', // image, submit 'formenctype', // image, submit @@ -129,10 +121,10 @@ export const ATTRIBUTE_MAP: Record = { 'formtarget', // image, submit 'alt', // image 'src', // image - 'list', // almost all + 'list', // almost all 'max', // numeric types 'maxlength', // password, search, tel, text, url - 'min', // numeric types + 'min', // numeric types 'minlength', // password, search, tel, text, url 'step', // numeric types 'capture', // file @@ -144,16 +136,9 @@ export const ATTRIBUTE_MAP: Record = { 'size', // email, password, tel, text, url ], kbd: GLOBAL_ATTRIBUTES, - label: [ - ...GLOBAL_ATTRIBUTES, - 'for', - ], + label: [...GLOBAL_ATTRIBUTES, 'for'], legend: GLOBAL_ATTRIBUTES, - li: [ - ...GLOBAL_ATTRIBUTES, - 'value', - 'type', - ], + li: [...GLOBAL_ATTRIBUTES, 'value', 'type'], main: GLOBAL_ATTRIBUTES, mark: GLOBAL_ATTRIBUTES, menu: GLOBAL_ATTRIBUTES, @@ -169,27 +154,15 @@ export const ATTRIBUTE_MAP: Record = { ], nav: GLOBAL_ATTRIBUTES, noscript: GLOBAL_ATTRIBUTES, - ol: [ - ...GLOBAL_ATTRIBUTES, - 'reversed', - 'start', - 'type', - ], + ol: [...GLOBAL_ATTRIBUTES, 'reversed', 'start', 'type'], optgroup: GLOBAL_ATTRIBUTES, option: GLOBAL_ATTRIBUTES, output: GLOBAL_ATTRIBUTES, p: GLOBAL_ATTRIBUTES, picture: GLOBAL_ATTRIBUTES, pre: GLOBAL_ATTRIBUTES, - progress: [ - ...GLOBAL_ATTRIBUTES, - 'max', - 'value', - ], - q: [ - ...GLOBAL_ATTRIBUTES, - 'cite', - ], + progress: [...GLOBAL_ATTRIBUTES, 'max', 'value'], + q: [...GLOBAL_ATTRIBUTES, 'cite'], rp: GLOBAL_ATTRIBUTES, rt: GLOBAL_ATTRIBUTES, rtc: GLOBAL_ATTRIBUTES, @@ -197,10 +170,7 @@ export const ATTRIBUTE_MAP: Record = { s: GLOBAL_ATTRIBUTES, samp: GLOBAL_ATTRIBUTES, section: GLOBAL_ATTRIBUTES, - slot: [ - ...GLOBAL_ATTRIBUTES, - 'name', - ], + slot: [...GLOBAL_ATTRIBUTES, 'name'], small: GLOBAL_ATTRIBUTES, source: [ ...GLOBAL_ATTRIBUTES, @@ -218,12 +188,7 @@ export const ATTRIBUTE_MAP: Record = { sup: GLOBAL_ATTRIBUTES, table: GLOBAL_ATTRIBUTES, tbody: GLOBAL_ATTRIBUTES, - td: [ - ...GLOBAL_ATTRIBUTES, - 'colspan', - 'headers', - 'rowspan', - ], + td: [...GLOBAL_ATTRIBUTES, 'colspan', 'headers', 'rowspan'], template: GLOBAL_ATTRIBUTES, textarea: [ ...GLOBAL_ATTRIBUTES, @@ -245,19 +210,9 @@ export const ATTRIBUTE_MAP: Record = { tfoot: GLOBAL_ATTRIBUTES, th: GLOBAL_ATTRIBUTES, thead: GLOBAL_ATTRIBUTES, - time: [ - ...GLOBAL_ATTRIBUTES, - 'datetime', - ], + time: [...GLOBAL_ATTRIBUTES, 'datetime'], tr: GLOBAL_ATTRIBUTES, - track: [ - ...GLOBAL_ATTRIBUTES, - 'default', - 'kind', - 'label', - 'src', - 'srclang', - ], + track: [...GLOBAL_ATTRIBUTES, 'default', 'kind', 'label', 'src', 'srclang'], u: GLOBAL_ATTRIBUTES, ul: GLOBAL_ATTRIBUTES, var: GLOBAL_ATTRIBUTES, @@ -280,4 +235,9 @@ export const ATTRIBUTE_MAP: Record = { 'crossorigin', ], wbr: GLOBAL_ATTRIBUTES, + svg: [...GLOBAL_ATTRIBUTES, 'version', 'xmlns', 'viewBox'], + circle: [...GLOBAL_ATTRIBUTES, 'cx', 'cy', 'r'], + rect: [...GLOBAL_ATTRIBUTES, 'width', 'height'], + line: [...GLOBAL_ATTRIBUTES, 'x1', 'y1', 'x2', 'y2'], + path: [...GLOBAL_ATTRIBUTES, 'd'], } From a3b7e5a79aec5d35e39642eeffc923db78da0512 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Thu, 30 Jun 2022 01:45:53 +0000 Subject: [PATCH 047/418] Version Packages --- .changeset/fluffy-garlics-raise.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/fluffy-garlics-raise.md diff --git a/.changeset/fluffy-garlics-raise.md b/.changeset/fluffy-garlics-raise.md deleted file mode 100644 index 50524ca1..00000000 --- a/.changeset/fluffy-garlics-raise.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Add some basic SVG functionality diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 8d852cc9..71f9228b 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.138 + +### Patch Changes + +- 6ad62f66: Add some basic SVG functionality + ## 0.0.137 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 921a79bf..00a74500 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.137", + "version": "0.0.138", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 20f68b777f0a3de9f47c413b876b7f24079150a1 Mon Sep 17 00:00:00 2001 From: John Otander Date: Thu, 30 Jun 2022 10:40:43 -0600 Subject: [PATCH 048/418] Remove unneeded internal function --- .changeset/sixty-carpets-sleep.md | 5 +++++ packages/gui/src/components/html/editor.tsx | 10 +--------- 2 files changed, 6 insertions(+), 9 deletions(-) create mode 100644 .changeset/sixty-carpets-sleep.md diff --git a/.changeset/sixty-carpets-sleep.md b/.changeset/sixty-carpets-sleep.md new file mode 100644 index 00000000..62a163a1 --- /dev/null +++ b/.changeset/sixty-carpets-sleep.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Remove unneeded internal function diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index e475f6c8..366a5bb5 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -322,8 +322,8 @@ function NodeEditor({ onDuplicate={() => { const parentPath = [...(selected || [])] const childIndex = parentPath.pop() // Remove child from parent path - const parent = getAt(fullValue, parentPath) + const parent = getChildAtPath(fullValue, parentPath) const newParent = addChildAtPath(parent, [childIndex ?? 0], { ...value, }) @@ -731,14 +731,6 @@ function addAt(items: T[], index: number, newItem: T) { return spliced } -function getAt(node: ElementData, path: ElementPath) { - let el: ElementData | undefined = node - path.reverse().forEach((index) => { - el = el?.children?.[index] - }) - return el -} - function replaceAt(items: T[], index: number, newItem: T) { const spliced = [...items] spliced.splice(index, 1, newItem) From e035dd7bac41728fad3504d6387e662b529a493a Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 1 Jul 2022 23:10:59 +0000 Subject: [PATCH 049/418] Bump prettier from 2.6.2 to 2.7.1 Bumps [prettier](https://github.com/prettier/prettier) from 2.6.2 to 2.7.1. - [Release notes](https://github.com/prettier/prettier/releases) - [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md) - [Commits](https://github.com/prettier/prettier/compare/2.6.2...2.7.1) --- updated-dependencies: - dependency-name: prettier dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 74aaa70e..541b89be 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ "dependencies": { "@changesets/cli": "^2.22.0", "@manypkg/cli": "^0.19.1", - "prettier": "^2.6.2", + "prettier": "^2.7.1", "tsup": "^5.12.6", "turbo": "^1.2.6" } diff --git a/yarn.lock b/yarn.lock index 7633e2b1..7fd7f29b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6805,10 +6805,10 @@ prettier@^1.19.1: resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.19.1.tgz#f7d7f5ff8a9cd872a7be4ca142095956a60797cb" integrity sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew== -prettier@^2.6.2: - version "2.6.2" - resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.6.2.tgz#e26d71a18a74c3d0f0597f55f01fb6c06c206032" - integrity sha512-PkUpF+qoXTqhOeWL9fu7As8LXsIUZ1WYaJiY/a7McAQzxjk82OF0tibkFXVCDImZtWxbvojFjerkiLb0/q8mew== +prettier@^2.7.1: + version "2.7.1" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.7.1.tgz#e235806850d057f97bb08368a4f7d899f7760c64" + integrity sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g== pretty-format@^28.0.0, pretty-format@^28.1.1: version "28.1.1" From 5c11d54a0645f2899d93f58cad68a719e46cb3a4 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 1 Jul 2022 23:11:31 +0000 Subject: [PATCH 050/418] Bump theme-ui from 0.14.5 to 0.14.6 Bumps [theme-ui](https://github.com/system-ui/theme-ui) from 0.14.5 to 0.14.6. - [Release notes](https://github.com/system-ui/theme-ui/releases) - [Changelog](https://github.com/system-ui/theme-ui/blob/v0.14.6/CHANGELOG.md) - [Commits](https://github.com/system-ui/theme-ui/compare/v0.14.5...v0.14.6) --- updated-dependencies: - dependency-name: theme-ui dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- apps/docs/package.json | 2 +- packages/gui/package.json | 2 +- yarn.lock | 102 +++++++++++++++++++------------------- 3 files changed, 53 insertions(+), 53 deletions(-) diff --git a/apps/docs/package.json b/apps/docs/package.json index c90cd9d1..6b0ded1a 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -23,7 +23,7 @@ "rehype-slug": "^5.0.1", "remark-gfm": "^3.0.1", "remark-prism": "^1.3.6", - "theme-ui": "^0.14.5" + "theme-ui": "^0.14.6" }, "devDependencies": { "@types/node": "^17.0.31", diff --git a/packages/gui/package.json b/packages/gui/package.json index 00a74500..27d8cb39 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -70,7 +70,7 @@ "rehype-parse": "^8.0.4", "rehype-sanitize": "^5.0.1", "rehype-stringify": "^9.0.3", - "theme-ui": "^0.14.5", + "theme-ui": "^0.14.6", "unified": "^10.1.2", "unist-util-remove": "^3.1.0", "unist-util-visit": "^4.1.0", diff --git a/yarn.lock b/yarn.lock index 7633e2b1..ab5f150b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1695,66 +1695,66 @@ dependencies: defer-to-connect "^1.0.1" -"@theme-ui/color-modes@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/color-modes/-/color-modes-0.14.5.tgz#c9b77f2a6f7b529268e4e47147f763dfe8d2f215" - integrity sha512-cblrNDonr0sqPY9xRNcRLc4mDud9W59BxgTqS6GznB4fdnztV9FgN488JODbo4uHiHMZddhno0Vb3f/bbs6jsQ== +"@theme-ui/color-modes@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/color-modes/-/color-modes-0.14.6.tgz#68f70c6e976ab317e435059a0f9501ca607f1888" + integrity sha512-s+ajgKaJyM6y0IYfYKuQSukbtj+8nvbZhurP5sOb9DzHlJ6eVRCluvEd2hJ4pIA5aQrqs8LwUFNifAH1gPCB4A== dependencies: - "@theme-ui/core" "0.14.5" - "@theme-ui/css" "0.14.5" + "@theme-ui/core" "0.14.6" + "@theme-ui/css" "0.14.6" deepmerge "^4.2.2" -"@theme-ui/components@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/components/-/components-0.14.5.tgz#63f0d5fdb042e46562f839cb4ce84b6cb964717e" - integrity sha512-V1h7j4yUsIbS6oHd5ke7ogCWq7ng31vzpUkK3xGI2acV+N0jfJNf7CfG6AaJfiwP0kAZhtCbIMvFsRWbRyvEnA== +"@theme-ui/components@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/components/-/components-0.14.6.tgz#6f8b4d1b631099fc212bb2f53e233719c18e4cef" + integrity sha512-B5tnrkFqxTwT92GFyc+6CHz8yeWoJJGfyvLJrT4GVjih0uKASHa33N2QoKOrCEcivHPtjr5IJ1po7fFmNaEmAw== dependencies: "@styled-system/color" "^5.1.2" "@styled-system/should-forward-prop" "^5.1.2" "@styled-system/space" "^5.1.2" - "@theme-ui/css" "0.14.5" + "@theme-ui/css" "0.14.6" "@types/styled-system" "^5.1.13" -"@theme-ui/core@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/core/-/core-0.14.5.tgz#a12ea2c7c73d4328da5762272a24edca52513f27" - integrity sha512-fyllFax0hnABTMS3ryKP0w1oa2oHCE4xUKRZMwyA46ldV3pe3C4to8SmlF7x6RgSlsyrwdpEm34aB1ZgHsWrQg== +"@theme-ui/core@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/core/-/core-0.14.6.tgz#e1a7ccc1625e44c09aa70dd36d101c7a19060c92" + integrity sha512-T9JGhtzGfYkgD+H0zUF/zz6YR86fja7G1O1A41Him+ZmtVmdKX9z6qpYq1np2uOJhHWBUdGma5HnqNLN9adxUA== dependencies: - "@theme-ui/css" "0.14.5" - "@theme-ui/parse-props" "0.14.5" + "@theme-ui/css" "0.14.6" + "@theme-ui/parse-props" "0.14.6" deepmerge "^4.2.2" -"@theme-ui/css@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/css/-/css-0.14.5.tgz#ac2bf57ee8f7ed1e960b175d2e76b43f04fde20d" - integrity sha512-EZztsPXJEg8rceTRGwWDD++d9QFSwEkl5913BvWmWTmB/Ips91ZIpnTbhfVRbG3bgUa+9lc1VwSEHOsHkN5mgw== +"@theme-ui/css@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/css/-/css-0.14.6.tgz#92ad80e0d350d284d935856ff38116f9ced48d8a" + integrity sha512-/gUkro5YksMLD/NAA45iBGMHnZ4Qedq1aNeLXUTwvZmKhLfBs/TiK+fH+9xl4RJp9BZmSIHppMMtmGCbTuvckA== dependencies: csstype "^3.0.10" -"@theme-ui/mdx@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/mdx/-/mdx-0.14.5.tgz#a462cf378d5a8ef4a03369a75e3b258bbab6d566" - integrity sha512-iYYsvo6TZAxc9frXJWUijEYLmZltbsv3xFfBptA2iaw8iDj/Aw2ggtHpVyGVXGAgS09vfgH+ebFuzup61ADdDw== +"@theme-ui/mdx@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/mdx/-/mdx-0.14.6.tgz#aa7b3a75963698a241583cd3ed58f7c13c2626b8" + integrity sha512-vaZWzxOFziI1hptl8BFz7SiSG2TkiUr7LvdIkPf9Tdnt1pp/YFrCS880o1rPTrjW9UmAiRfgJTx7tSpXAWbJyg== dependencies: - "@theme-ui/core" "0.14.5" - "@theme-ui/css" "0.14.5" + "@theme-ui/core" "0.14.6" + "@theme-ui/css" "0.14.6" -"@theme-ui/parse-props@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/parse-props/-/parse-props-0.14.5.tgz#abdcca2a7c83dcd899b35b2488582b592b065825" - integrity sha512-VB4/eH3v+1hXkzVWW0pahNdooG8gEreUXMyizR5TsJffy8KwjW6CsZJheoDJhyRfFk2nLhi1M0PjA+01lxL1qg== +"@theme-ui/parse-props@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/parse-props/-/parse-props-0.14.6.tgz#52d0d7804aea8f8106841d872d94e02243a5cf7b" + integrity sha512-TQ3RhX+0eGvXWWSWZkF7LnWL3aGWOoao/OKZ5crrMyPCJqo5dqdiYDm75n+k8dHGKcWJx79cJ9xtMy4YBRqbgQ== dependencies: - "@theme-ui/css" "0.14.5" + "@theme-ui/css" "0.14.6" -"@theme-ui/theme-provider@0.14.5": - version "0.14.5" - resolved "https://registry.yarnpkg.com/@theme-ui/theme-provider/-/theme-provider-0.14.5.tgz#cb319deccfaa8e94f38e6629b2f4c0dc95865ed4" - integrity sha512-FHT2FLQB412USzW/JX7UXXcJXdFyEDcwwaOXrR5caHX+XDb61k1tkXhT7fjnCpEx+z7rOeCXjxai3sQGk5SFNg== +"@theme-ui/theme-provider@0.14.6": + version "0.14.6" + resolved "https://registry.yarnpkg.com/@theme-ui/theme-provider/-/theme-provider-0.14.6.tgz#8ab949e6893c145c492570a865dca1f2ac458e69" + integrity sha512-r1/LAzAaFOpo3CzvYTF/Ls0Tm2l2TJFxF8tX2qO3t+Rxo3W/3hlnvD3I86/QNNATJTpDcTqXTKuqOe++UxEbTQ== dependencies: - "@theme-ui/color-modes" "0.14.5" - "@theme-ui/core" "0.14.5" - "@theme-ui/css" "0.14.5" - "@theme-ui/mdx" "0.14.5" + "@theme-ui/color-modes" "0.14.6" + "@theme-ui/core" "0.14.6" + "@theme-ui/css" "0.14.6" + "@theme-ui/mdx" "0.14.6" "@tootallnate/once@1": version "1.1.2" @@ -7806,17 +7806,17 @@ text-table@^0.2.0: resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ= -theme-ui@^0.14.5: - version "0.14.5" - resolved "https://registry.yarnpkg.com/theme-ui/-/theme-ui-0.14.5.tgz#c056d0370cd2f50273bc9ac74eaa8bbbc489c19f" - integrity sha512-KrQ/5pFF/K/a+fortQg0w1VlTwhpu/b4u2pFZL1TMZLIHPwOsu/r4L3thJLkco7Gjj9lje8mIPx/L1I9Pqy3TQ== - dependencies: - "@theme-ui/color-modes" "0.14.5" - "@theme-ui/components" "0.14.5" - "@theme-ui/core" "0.14.5" - "@theme-ui/css" "0.14.5" - "@theme-ui/mdx" "0.14.5" - "@theme-ui/theme-provider" "0.14.5" +theme-ui@^0.14.6: + version "0.14.6" + resolved "https://registry.yarnpkg.com/theme-ui/-/theme-ui-0.14.6.tgz#7033939f1b192a7473cf963218563901822741ff" + integrity sha512-DFjZuRGT+f/vXbusb4XzbWgGVtLhNfI2l89XYgT9fd3lTZnUsPPT+UQXX3/nHCHTx6X8likV6gjiKy6DUS2BGA== + dependencies: + "@theme-ui/color-modes" "0.14.6" + "@theme-ui/components" "0.14.6" + "@theme-ui/core" "0.14.6" + "@theme-ui/css" "0.14.6" + "@theme-ui/mdx" "0.14.6" + "@theme-ui/theme-provider" "0.14.6" thenify-all@^1.0.0: version "1.6.0" From 7e6f3fa47f7b10ffc2560f4953cf6ffade6da45b Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 1 Jul 2022 23:11:45 +0000 Subject: [PATCH 051/418] Bump @mdx-js/loader from 2.1.1 to 2.1.2 Bumps [@mdx-js/loader](https://github.com/mdx-js/mdx/tree/HEAD/packages/loader) from 2.1.1 to 2.1.2. - [Release notes](https://github.com/mdx-js/mdx/releases) - [Changelog](https://github.com/mdx-js/mdx/blob/main/changelog.md) - [Commits](https://github.com/mdx-js/mdx/commits/2.1.2/packages/loader) --- updated-dependencies: - dependency-name: "@mdx-js/loader" dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] --- apps/docs/package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/apps/docs/package.json b/apps/docs/package.json index c90cd9d1..e0ceafa5 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -13,7 +13,7 @@ "@compai/css-gui": "*", "@compai/logo": "^0.1.0", "@emotion/react": "^11.9.0", - "@mdx-js/loader": "^2.1.1", + "@mdx-js/loader": "^2.1.2", "@next/mdx": "^12.1.5", "@segment/snippet": "^4.15.3", "next": "12.1.5", diff --git a/yarn.lock b/yarn.lock index 7633e2b1..8acdbba2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -946,10 +946,10 @@ globby "^11.0.0" read-yaml-file "^1.1.0" -"@mdx-js/loader@^2.1.1": - version "2.1.1" - resolved "https://registry.yarnpkg.com/@mdx-js/loader/-/loader-2.1.1.tgz#98f0f2d8fc7f6b2f2c51ea2f4185e9c1ebcb187a" - integrity sha512-24danl02C30QoXVQTqvoEL84jN1e2BBSYMk9A/DGYBtHWXg5kdVp+A6P4hrFOwHvkEIjRbY0N49jPOSbpOgrOQ== +"@mdx-js/loader@^2.1.2": + version "2.1.2" + resolved "https://registry.yarnpkg.com/@mdx-js/loader/-/loader-2.1.2.tgz#fe7631bbef1e6546f4289f7adaef60083c22063a" + integrity sha512-P7CWhrqE5rZ3ewBngZ9t/zQPbSq42iuty78K3zJ8Bl518qnOX1d106c+n7I/zHODPAmw9JfYMQdbv9WrrHa0DA== dependencies: "@mdx-js/mdx" "^2.0.0" source-map "^0.7.0" From a11347cbc546a54e98941ad20fe2efdda846850b Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 1 Jul 2022 23:11:57 +0000 Subject: [PATCH 052/418] Bump eslint from 8.16.0 to 8.18.0 Bumps [eslint](https://github.com/eslint/eslint) from 8.16.0 to 8.18.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/compare/v8.16.0...v8.18.0) --- updated-dependencies: - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- apps/docs/package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/apps/docs/package.json b/apps/docs/package.json index c90cd9d1..bb4871c9 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -29,7 +29,7 @@ "@types/node": "^17.0.31", "@types/react": "18.0.10", "config": "*", - "eslint": "8.16.0", + "eslint": "8.18.0", "tsconfig": "*", "typescript": "^4.6.4" } diff --git a/yarn.lock b/yarn.lock index 7633e2b1..2fd4a7d8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3562,10 +3562,10 @@ eslint-visitor-keys@^3.3.0: resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826" integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA== -eslint@8.16.0: - version "8.16.0" - resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.16.0.tgz#6d936e2d524599f2a86c708483b4c372c5d3bbae" - integrity sha512-MBndsoXY/PeVTDJeWsYj7kLZ5hQpJOfMYLsF6LicLHQWbRDG19lK5jOix4DPl8yY4SUFcE3txy86OzFLWT+yoA== +eslint@8.18.0: + version "8.18.0" + resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.18.0.tgz#78d565d16c993d0b73968c523c0446b13da784fd" + integrity sha512-As1EfFMVk7Xc6/CvhssHUjsAQSkpfXvUGMFC3ce8JDe6WvqCgRrLOBQbVpsBFr1X1V+RACOadnzVvcUS5ni2bA== dependencies: "@eslint/eslintrc" "^1.3.0" "@humanwhocodes/config-array" "^0.9.2" From ffb1ef8ec3cf52ec0702dddcc4f8875fedb83104 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 11:58:08 -0600 Subject: [PATCH 053/418] Use theme provider in html editor --- .changeset/tough-donuts-tap.md | 5 +++++ packages/gui/src/components/html/Provider.tsx | 10 ++++++---- 2 files changed, 11 insertions(+), 4 deletions(-) create mode 100644 .changeset/tough-donuts-tap.md diff --git a/.changeset/tough-donuts-tap.md b/.changeset/tough-donuts-tap.md new file mode 100644 index 00000000..c3f4e880 --- /dev/null +++ b/.changeset/tough-donuts-tap.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Fix theme handling in HTML editor diff --git a/packages/gui/src/components/html/Provider.tsx b/packages/gui/src/components/html/Provider.tsx index e2e825a9..8b66e404 100644 --- a/packages/gui/src/components/html/Provider.tsx +++ b/packages/gui/src/components/html/Provider.tsx @@ -1,6 +1,7 @@ import { createContext, ReactNode, useContext, useState } from 'react' import { htmlToEditorSchema } from '../../lib' import { stylesToEditorSchema } from '../../lib/transformers/styles-to-editor-schema' +import { ThemeProvider } from '../providers/ThemeContext' import { HtmlNode, ElementPath, ElementData } from './types' const DEFAULT_HTML_EDITOR_VALUE = { @@ -81,15 +82,16 @@ export function HtmlEditorProvider({ const fullContext = { value: transformedValue, - theme, selected, setSelected: (newSelection: ElementPath | null) => setSelected(newSelection), } return ( - - {children} - + + + {children} + + ) } From 633ca2ed6cbc511c7a5be5ba0f168aaff7f38c39 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Tue, 5 Jul 2022 18:06:19 +0000 Subject: [PATCH 054/418] Version Packages --- .changeset/sixty-carpets-sleep.md | 5 ----- .changeset/tough-donuts-tap.md | 5 ----- packages/gui/CHANGELOG.md | 7 +++++++ packages/gui/package.json | 2 +- 4 files changed, 8 insertions(+), 11 deletions(-) delete mode 100644 .changeset/sixty-carpets-sleep.md delete mode 100644 .changeset/tough-donuts-tap.md diff --git a/.changeset/sixty-carpets-sleep.md b/.changeset/sixty-carpets-sleep.md deleted file mode 100644 index 62a163a1..00000000 --- a/.changeset/sixty-carpets-sleep.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Remove unneeded internal function diff --git a/.changeset/tough-donuts-tap.md b/.changeset/tough-donuts-tap.md deleted file mode 100644 index c3f4e880..00000000 --- a/.changeset/tough-donuts-tap.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Fix theme handling in HTML editor diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 71f9228b..5a4d3b4c 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,12 @@ # @compai/css-gui +## 0.0.139 + +### Patch Changes + +- 20f68b77: Remove unneeded internal function +- ffb1ef8e: Fix theme handling in HTML editor + ## 0.0.138 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 00a74500..0fb3d5e1 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.138", + "version": "0.0.139", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From e6df73421d3bdf5f4befe2e4c732183ba54b793e Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 5 Jul 2022 18:08:08 +0000 Subject: [PATCH 055/418] Bump @next/mdx from 12.1.5 to 12.2.0 Bumps [@next/mdx](https://github.com/vercel/next.js/tree/HEAD/packages/next-mdx) from 12.1.5 to 12.2.0. - [Release notes](https://github.com/vercel/next.js/releases) - [Changelog](https://github.com/vercel/next.js/blob/canary/release.js) - [Commits](https://github.com/vercel/next.js/commits/v12.2.0/packages/next-mdx) --- updated-dependencies: - dependency-name: "@next/mdx" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] --- apps/docs/package.json | 2 +- yarn.lock | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/apps/docs/package.json b/apps/docs/package.json index 870e2dba..009c30f8 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -14,7 +14,7 @@ "@compai/logo": "^0.1.0", "@emotion/react": "^11.9.0", "@mdx-js/loader": "^2.1.2", - "@next/mdx": "^12.1.5", + "@next/mdx": "^12.2.0", "@segment/snippet": "^4.15.3", "next": "12.1.5", "react": "18.1.0", diff --git a/yarn.lock b/yarn.lock index da0f6410..a4d3d298 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1021,10 +1021,10 @@ dependencies: glob "7.1.7" -"@next/mdx@^12.1.5": - version "12.1.5" - resolved "https://registry.yarnpkg.com/@next/mdx/-/mdx-12.1.5.tgz#302fbf195b406d32423f6a0317771d3b27f88e8e" - integrity sha512-3R8J/3jKz4bCAOWDKVhxXoUETy3eqC+zaNlgwLK7LAid3UZjioVZ+jxIJmopd1auqjpev7doKeRE2p8YG55QLg== +"@next/mdx@^12.2.0": + version "12.2.0" + resolved "https://registry.yarnpkg.com/@next/mdx/-/mdx-12.2.0.tgz#de38207bc1150836c33455fa072afb55cdbbd194" + integrity sha512-obWsgfD0/1+OOr4PMQlSal34uhIDxkFe9Db+LaFfRDbsmD8+gb0YevUOV5KBoleEHXfDku0WAPUUmPmDiAxu1w== "@next/swc-android-arm-eabi@12.1.5": version "12.1.5" From 09588f40ba9b6cae0de3b6738cdaae554bec33f2 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 15:51:41 -0600 Subject: [PATCH 056/418] Improve theme property retrieval and add theme-based stringification --- .changeset/soft-months-refuse.md | 5 +++++ packages/gui/src/components/html/Provider.tsx | 1 + packages/gui/src/components/html/Renderer.tsx | 1 - packages/gui/src/components/html/editor.tsx | 9 +++------ .../primitives/ColorPicker/PalettePicker.tsx | 9 +++------ packages/gui/src/components/schemas/color.ts | 10 +++++++++- packages/gui/src/components/schemas/options.tsx | 4 ++-- packages/gui/src/components/schemas/theme.tsx | 2 +- packages/gui/src/lib/theme.ts | 13 ++++++++++++- 9 files changed, 36 insertions(+), 18 deletions(-) create mode 100644 .changeset/soft-months-refuse.md diff --git a/.changeset/soft-months-refuse.md b/.changeset/soft-months-refuse.md new file mode 100644 index 00000000..3cd66fac --- /dev/null +++ b/.changeset/soft-months-refuse.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Improve theme integration diff --git a/packages/gui/src/components/html/Provider.tsx b/packages/gui/src/components/html/Provider.tsx index 8b66e404..f3bf036b 100644 --- a/packages/gui/src/components/html/Provider.tsx +++ b/packages/gui/src/components/html/Provider.tsx @@ -72,6 +72,7 @@ type HtmlEditorProviderProps = { children: ReactNode theme?: any } + export function HtmlEditorProvider({ children, value, diff --git a/packages/gui/src/components/html/Renderer.tsx b/packages/gui/src/components/html/Renderer.tsx index c6dcd45c..7e5d4be1 100644 --- a/packages/gui/src/components/html/Renderer.tsx +++ b/packages/gui/src/components/html/Renderer.tsx @@ -1,4 +1,3 @@ -import { Fragment, HTMLAttributes } from 'react' import { toCSSObject } from '../../lib' import { ElementData, ElementPath } from './types' import { HTMLFontTags } from './FontTags' diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index 366a5bb5..ea4867ac 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -14,6 +14,7 @@ import { isVoidElement } from '../../lib/elements' import { isSamePath } from './util' import { Export } from './Export' import { NodeEditorDropdown } from '../ui/dropdowns/NodeEditorDropdown' +import { useTheme } from '../providers/ThemeContext' const HTML_TAGS = [ HTMLTag.A, @@ -166,12 +167,8 @@ const TABS_CONTENT_STYLES: any = { * An HTML tree-based editor that lets you add HTML nodes and mess around with their styles */ export function HtmlEditor({ onChange }: HtmlEditorProps) { - const { - value, - theme, - selected: providedSelected, - setSelected, - } = useHtmlEditor() + const { value, selected: providedSelected, setSelected } = useHtmlEditor() + const theme = useTheme() const selected = providedSelected || [] const nodeValue = getChildAtPath(value, selected) diff --git a/packages/gui/src/components/primitives/ColorPicker/PalettePicker.tsx b/packages/gui/src/components/primitives/ColorPicker/PalettePicker.tsx index e4acc32a..7ce1d389 100644 --- a/packages/gui/src/components/primitives/ColorPicker/PalettePicker.tsx +++ b/packages/gui/src/components/primitives/ColorPicker/PalettePicker.tsx @@ -1,11 +1,8 @@ import * as Popover from '@radix-ui/react-popover' -import { get } from 'lodash-es' -import { Color } from '../../../types/css' -import { Theme } from '../../../types/theme' +import { themeGet } from '../../../lib' import { useTheme } from '../../providers/ThemeContext' import Checkerboard from './Checkerboard' import { hasAlpha, withFallback } from './util' -import ColorValueDisplay from './ValueDisplay' export interface ThemeColor { type: 'theme' @@ -69,7 +66,7 @@ export default function PalettePopover({ function Swatch({ value }: { value: ThemeColor }) { const theme = useTheme() // FIXME extracting color value from path is annoying... - const color = get(theme.colors, value.path) + const color = themeGet({ theme, property: 'color', path: value.path }) const isTransparent = hasAlpha(color) return (
{/* */} diff --git a/packages/gui/src/components/schemas/color.ts b/packages/gui/src/components/schemas/color.ts index 93dba120..eafe7416 100644 --- a/packages/gui/src/components/schemas/color.ts +++ b/packages/gui/src/components/schemas/color.ts @@ -1,3 +1,5 @@ +import { get } from 'theme-ui' +import { themeGet } from '../../lib' import { randomColor } from '../../lib/color' import { stringifyUnit } from '../../lib/stringify' import { Color } from '../../types/css' @@ -38,7 +40,13 @@ function rawColor({ const themeColor: DataTypeSchema = { type: 'theme', inlineInput: PalettePopover, - stringify: (value) => value.path, + stringify: (value, theme = {}) => { + return themeGet({ + theme, + property: 'color', + path: value.path, + }) + }, defaultValue: { type: 'theme', path: 'primary' }, regenerate: () => randomColor(), validate: ((value: any) => { diff --git a/packages/gui/src/components/schemas/options.tsx b/packages/gui/src/components/schemas/options.tsx index 417b5c98..be976b00 100644 --- a/packages/gui/src/components/schemas/options.tsx +++ b/packages/gui/src/components/schemas/options.tsx @@ -90,9 +90,9 @@ export function optionsSchema>({ const type = getType(value) return !!variants[type].input }, - stringify(value) { + stringify(value, ...args) { const type = getType(value) - return variants[type].stringify(value) + return variants[type].stringify(value, ...args) }, defaultValue: variants[defaultType].defaultValue, regenerate, diff --git a/packages/gui/src/components/schemas/theme.tsx b/packages/gui/src/components/schemas/theme.tsx index 935bc675..735e382e 100644 --- a/packages/gui/src/components/schemas/theme.tsx +++ b/packages/gui/src/components/schemas/theme.tsx @@ -1,4 +1,4 @@ -import { useTheme } from '@emotion/react' +import { useTheme } from '../providers/ThemeContext' import { get, range } from 'lodash-es' import { ThemeValue } from '../../types/css' import { SelectInput } from '../inputs/SelectInput' diff --git a/packages/gui/src/lib/theme.ts b/packages/gui/src/lib/theme.ts index e17abd94..07250e2c 100644 --- a/packages/gui/src/lib/theme.ts +++ b/packages/gui/src/lib/theme.ts @@ -1,8 +1,19 @@ import { v4 as uuid } from 'uuid' -import { ColorModesScale } from 'theme-ui' +import { ColorModesScale, get as themeUIGet } from 'theme-ui' import { THEME_SCALES } from './constants' import { ColorGroup, Theme } from '../types/theme' +type GetArguments = { + theme: any + path: string | number + property: string +} +export const themeGet = ({ theme, path, property }: GetArguments) => { + const scale = THEME_SCALES[property] + const fullPath = [scale, path].filter(Boolean).join('.') + return themeUIGet(theme, fullPath) ?? property +} + export const isThemeable = (property?: string): boolean => !!THEME_SCALES[property || ''] From b6d7647ee517dfb03853e5ec2c8ff12b13496701 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Tue, 5 Jul 2022 21:54:26 +0000 Subject: [PATCH 057/418] Version Packages --- .changeset/soft-months-refuse.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/soft-months-refuse.md diff --git a/.changeset/soft-months-refuse.md b/.changeset/soft-months-refuse.md deleted file mode 100644 index 3cd66fac..00000000 --- a/.changeset/soft-months-refuse.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Improve theme integration diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 5a4d3b4c..614aba43 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.140 + +### Patch Changes + +- 09588f40: Improve theme integration + ## 0.0.139 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index d6151438..289f14b2 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.139", + "version": "0.0.140", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 1fd871b337c6772c47d1ea8172750b9d07762227 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 16:57:20 -0600 Subject: [PATCH 058/418] Pass theme along with document for codegen --- .changeset/lazy-parrots-turn.md | 5 +++++ packages/gui/src/lib/codegen/html.ts | 8 ++++++-- 2 files changed, 11 insertions(+), 2 deletions(-) create mode 100644 .changeset/lazy-parrots-turn.md diff --git a/.changeset/lazy-parrots-turn.md b/.changeset/lazy-parrots-turn.md new file mode 100644 index 00000000..b3c9c241 --- /dev/null +++ b/.changeset/lazy-parrots-turn.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Pass theme along with document for codegen diff --git a/packages/gui/src/lib/codegen/html.ts b/packages/gui/src/lib/codegen/html.ts index 4600fa08..75e6a143 100644 --- a/packages/gui/src/lib/codegen/html.ts +++ b/packages/gui/src/lib/codegen/html.ts @@ -12,13 +12,17 @@ export const unstyledHtml = async (node: HtmlNode) => { return format('html', output) } -export const html = async (node: HtmlNode) => { +type HTMLOptions = { + selector?: string + theme?: any +} +export const html = async (node: HtmlNode, { theme }: CSSOptions = {}) => { const res = await fetch('https://components.ai/api/v1/gui/export/html', { method: 'POST', headers: { 'Content-Type': 'application/json', }, - body: JSON.stringify({ html: node }), + body: JSON.stringify({ html: node, theme }), }) const html = await res.text() From f276311560c9506e43ce65afe9c264398c28037a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Tue, 5 Jul 2022 22:58:06 +0000 Subject: [PATCH 059/418] Version Packages --- .changeset/lazy-parrots-turn.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/lazy-parrots-turn.md diff --git a/.changeset/lazy-parrots-turn.md b/.changeset/lazy-parrots-turn.md deleted file mode 100644 index b3c9c241..00000000 --- a/.changeset/lazy-parrots-turn.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Pass theme along with document for codegen diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 614aba43..4576bc13 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.141 + +### Patch Changes + +- 1fd871b3: Pass theme along with document for codegen + ## 0.0.140 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 289f14b2..f5befd12 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.140", + "version": "0.0.141", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From d6c83103154ef9c9968d77d56b18190089149558 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 17:02:36 -0600 Subject: [PATCH 060/418] Fix typo --- packages/gui/src/lib/codegen/html.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gui/src/lib/codegen/html.ts b/packages/gui/src/lib/codegen/html.ts index 75e6a143..9ea22375 100644 --- a/packages/gui/src/lib/codegen/html.ts +++ b/packages/gui/src/lib/codegen/html.ts @@ -16,7 +16,7 @@ type HTMLOptions = { selector?: string theme?: any } -export const html = async (node: HtmlNode, { theme }: CSSOptions = {}) => { +export const html = async (node: HtmlNode, { theme }: HTMLOptions = {}) => { const res = await fetch('https://components.ai/api/v1/gui/export/html', { method: 'POST', headers: { From 07cf407054d11bf23293f6eda39bb3a2ebd3d9fa Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 18:59:53 -0600 Subject: [PATCH 061/418] Place keywords for system colors before raw colors in schema --- .changeset/eleven-paws-look.md | 5 +++++ packages/gui/src/components/schemas/color.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/eleven-paws-look.md diff --git a/.changeset/eleven-paws-look.md b/.changeset/eleven-paws-look.md new file mode 100644 index 00000000..833414c3 --- /dev/null +++ b/.changeset/eleven-paws-look.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Fix system colors diff --git a/packages/gui/src/components/schemas/color.ts b/packages/gui/src/components/schemas/color.ts index eafe7416..10102e6f 100644 --- a/packages/gui/src/components/schemas/color.ts +++ b/packages/gui/src/components/schemas/color.ts @@ -65,8 +65,8 @@ export function color({ defaultValue?: any } = {}) { return joinSchemas([ + keyword(['transparent', 'currentcolor'], { type: 'system' }), rawColor({ defaultValue }), themeColor, - keyword(['transparent', 'currentcolor'], { type: 'system' }), ]) } From d21e7f16322943cc5b778e3ff74318982e7a3229 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 01:00:41 +0000 Subject: [PATCH 062/418] Version Packages --- .changeset/eleven-paws-look.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/eleven-paws-look.md diff --git a/.changeset/eleven-paws-look.md b/.changeset/eleven-paws-look.md deleted file mode 100644 index 833414c3..00000000 --- a/.changeset/eleven-paws-look.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Fix system colors diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 4576bc13..ca69742b 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.142 + +### Patch Changes + +- 07cf4070: Fix system colors + ## 0.0.141 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index f5befd12..0832c711 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.141", + "version": "0.0.142", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 236266ebb2b018ea563706cd41a57ab348bfd417 Mon Sep 17 00:00:00 2001 From: John Otander Date: Tue, 5 Jul 2022 20:52:57 -0600 Subject: [PATCH 063/418] Zero index theme values --- .changeset/metal-needles-walk.md | 5 +++++ packages/gui/src/components/schemas/theme.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/metal-needles-walk.md diff --git a/.changeset/metal-needles-walk.md b/.changeset/metal-needles-walk.md new file mode 100644 index 00000000..402bb3af --- /dev/null +++ b/.changeset/metal-needles-walk.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Zero index theme values diff --git a/packages/gui/src/components/schemas/theme.tsx b/packages/gui/src/components/schemas/theme.tsx index 735e382e..0d67bb4d 100644 --- a/packages/gui/src/components/schemas/theme.tsx +++ b/packages/gui/src/components/schemas/theme.tsx @@ -31,7 +31,7 @@ export function theme(path: string): DataTypeSchema { index: +value - 1, }) } - options={range(1, numOptions + 1).map((x) => x.toString())} + options={range(0, numOptions).map((x) => x.toString())} /> ) // return null From a788672d75de57af6b03aff22c782278650d7241 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 02:53:50 +0000 Subject: [PATCH 064/418] Version Packages --- .changeset/metal-needles-walk.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/metal-needles-walk.md diff --git a/.changeset/metal-needles-walk.md b/.changeset/metal-needles-walk.md deleted file mode 100644 index 402bb3af..00000000 --- a/.changeset/metal-needles-walk.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Zero index theme values diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index ca69742b..9563c2b5 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.143 + +### Patch Changes + +- 236266eb: Zero index theme values + ## 0.0.142 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 0832c711..40095895 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.142", + "version": "0.0.143", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From d2bf7579a0741ac80d89d902f61e3eb881630a1b Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 06:30:25 -0600 Subject: [PATCH 065/418] Pass theme to codegen --- .changeset/old-poets-explode.md | 5 +++++ packages/gui/src/components/html/Export.tsx | 5 +++-- packages/gui/src/components/html/editor.tsx | 2 +- 3 files changed, 9 insertions(+), 3 deletions(-) create mode 100644 .changeset/old-poets-explode.md diff --git a/.changeset/old-poets-explode.md b/.changeset/old-poets-explode.md new file mode 100644 index 00000000..859e5ace --- /dev/null +++ b/.changeset/old-poets-explode.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Pass theme to codegen diff --git a/packages/gui/src/components/html/Export.tsx b/packages/gui/src/components/html/Export.tsx index 5a64a76a..974859a8 100644 --- a/packages/gui/src/components/html/Export.tsx +++ b/packages/gui/src/components/html/Export.tsx @@ -26,8 +26,9 @@ const CODEGEN_DISPLAY_NAMES: Record = { type ExportProps = { value: HtmlNode + theme?: any } -export const Export = ({ value }: ExportProps) => { +export const Export = ({ value, theme }: ExportProps) => { const [src, setSrc] = useState(null) const [loading, setLoading] = useState(true) const [copied, setCopied] = useState(true) @@ -44,7 +45,7 @@ export const Export = ({ value }: ExportProps) => { gen = codegen.html } - gen(value).then((v: string) => { + gen(value, { theme }).then((v: string) => { setLoading(false) if (format === 'css') { diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index ea4867ac..04c21f80 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -259,7 +259,7 @@ export function HtmlEditor({ onChange }: HtmlEditorProps) {
- +
From d7589307f2b69ed449718d9593d83330aa991604 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 12:31:23 +0000 Subject: [PATCH 066/418] Version Packages --- .changeset/old-poets-explode.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/old-poets-explode.md diff --git a/.changeset/old-poets-explode.md b/.changeset/old-poets-explode.md deleted file mode 100644 index 859e5ace..00000000 --- a/.changeset/old-poets-explode.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Pass theme to codegen diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 9563c2b5..a3d32744 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.144 + +### Patch Changes + +- d2bf7579: Pass theme to codegen + ## 0.0.143 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 40095895..8f7c7159 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.143", + "version": "0.0.144", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 9b8ddd110b158ff91e9589e6d1efb774298f1776 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 08:07:53 -0600 Subject: [PATCH 067/418] Add a default theme --- apps/docs/data/default-theme.ts | 1536 ++++++------------------------- apps/docs/pages/html-editor.tsx | 27 +- 2 files changed, 280 insertions(+), 1283 deletions(-) diff --git a/apps/docs/data/default-theme.ts b/apps/docs/data/default-theme.ts index 8bb9d15a..f3de18c7 100644 --- a/apps/docs/data/default-theme.ts +++ b/apps/docs/data/default-theme.ts @@ -1,1282 +1,276 @@ -import { Theme } from '@compai/css-gui' - // https://components.ai/theme/asa9lvO69pQGyRn8ZAXL -export const defaultTheme: Theme = { - space: [ - { - unit: 'px', - id: '58d5c0a0-6a75-4392-bfdc-e8dfeeda70ef', - value: 0, - }, - { - id: '974b2e01-3213-4b1f-95b0-f878802cc9ff', - value: 2, - unit: 'px', - }, - { - unit: 'px', - value: 4, - id: 'ecdf306e-3251-4004-9af5-809a6a1038b1', - }, - { - id: '83b4c40c-af21-42b7-b9e8-51f2e5340d8f', - value: 8, - unit: 'px', - }, - { - id: '5faef71c-4826-460d-9da4-ca67dbc3338d', - unit: 'px', - value: 16, - }, - { - unit: 'px', - value: 32, - id: 'e9825590-d1ff-4e07-aec5-d205e69897a9', - }, - { - id: '938993bb-27a0-45d0-94e9-d420587acb5e', - value: 64, - unit: 'px', - }, - { - id: '23b9eb4b-b6c0-4052-8340-0c730e6a413c', - value: 128, - unit: 'px', - }, - { - unit: 'px', - value: 256, - id: '337abd5e-282f-4fcb-b3d9-1001c9e58b51', - }, - { - id: '36be9986-a610-41d6-9263-9a713e9f9ee0', - unit: 'px', - value: 512, - }, - ], - lineHeights: [ - { - id: 'd7bc4a9b-2d57-4dc2-9452-89f8ae1009e5', - name: 'solid', - value: 1, - unit: 'number', - }, - { - value: 1.2, - id: '8c5d8db3-6126-4ad7-bb8e-80f147fd0694', - name: 'heading', - unit: 'number', - }, - { - name: 'body', - value: 1.4, - id: '77c1d900-f4fc-4f44-bcd7-1f3fa8c3fbd2', - unit: 'number', - }, +export const defaultTheme: any = { + fontSizes: [ + '12px', + '16px', + '24px', + '32px', + '48px', + '64px', + '96px', + '128px', + '256px', ], - borderWidths: [ - { - id: 'ba623e1e-efb0-4763-9c08-1087d9ff6314', - unit: 'px', - value: 1, - }, - { - value: 2, - unit: 'px', - id: '0c18d989-9abb-4935-8976-8be94b5ce64a', - }, - { - unit: 'px', - id: '4597893f-545e-4b83-bf32-be446b6232e3', - value: 4, - }, - { - value: 8, - id: '15698313-6770-4fb2-8d36-390f0597b419', - unit: 'px', - }, + name: 'Subtle', + space: [ + 0, + '2px', + '4px', + '8px', + '16px', + '32px', + '64px', + '128px', + '256px', + '512px', ], - fontSizes: [ - { - id: '8a31d12c-5d8c-421d-a566-5a1b16d9633c', - unit: 'px', - value: 12, - }, - { - id: '982efd46-1bb5-447e-8e38-ff48170253c4', - value: 16, - unit: 'px', - }, - { - unit: 'px', - value: 24, - id: '97235cbe-e6a3-4f6a-bce9-18b6f5d0b551', - }, - { - value: 32, - unit: 'px', - id: 'd86f8c8b-1f99-4969-86e8-c28066b3db0d', - }, - { - value: 48, - unit: 'px', - id: '13729569-4cd7-49f8-aaf9-9f28d632508c', - }, - { - value: 64, - unit: 'px', - id: '8498c94f-066c-4186-b3aa-3120a15b4921', - }, - { - id: '037f7093-27e7-4a7b-b14a-722687d955c0', - value: 96, - unit: 'px', - }, - { - unit: 'px', - value: 128, - id: '98fd3a6e-bc02-4839-be76-2cc9cf7b117f', - }, - { - value: 256, - unit: 'px', - id: '6c57d38d-fe4e-481c-becd-0f963d2f9885', - }, + letterSpacings: { tracked: '0.1em', negative: '-0.05em', large: '0.25em' }, + lineHeights: { solid: 1, heading: 1.2, body: 1.4 }, + borderWidths: ['1px', '2px', '4px', '8px'], + fonts: [ + "-apple-system, BlinkMacSystemFont, 'avenir next', avenir, 'helvetica neue', helvetica, Ubuntu, roboto, noto, segoe ui, arial, sans-serif", + '"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace', + 'Inter', ], + borderRadius: [0, '4px', '8px', '16px', '32px', '64px', '9999999px'], + breakpoints: [], borderStyles: [], - fonts: [ - { - meta: { - primaryFont: '-apple-system', - weights: [ - { - active: false, - id: 'ceb718ee-f0d0-4aad-8363-68b7e3c952d1', - weight: '100', - }, - { - active: false, - weight: '200', - id: 'da2ef064-b0d4-48f1-a07b-453412003d64', - }, - { - weight: '300', - id: '6cf90307-8150-49b6-8825-18978b6fffed', - active: false, - }, - { - weight: '400', - id: '13bd1b78-6de0-4837-8a35-e223a1f58be2', - active: false, - }, - { - id: '78a808c5-5ebf-4103-b354-bf9ec64d78cb', - weight: '500', - active: false, - }, - { - weight: '600', - id: 'caf20cec-d4bb-4a80-8140-3bdf4c3070ca', - active: false, - }, - { - weight: '700', - id: '6aa934ed-0518-4fc7-a9c5-910db661f92e', - active: false, - }, - { - weight: '800', - id: 'aa173be6-add9-4add-8b57-1e9b8110ec57', - active: false, - }, - { - id: '93a5138a-b7a4-4c16-8dd1-5c7ca645487c', - weight: '900', - active: false, - }, - ], - }, - name: 'heading', - stack: - "-apple-system, BlinkMacSystemFont, 'avenir next', avenir, 'helvetica neue', helvetica, Ubuntu, roboto, noto, segoe ui, arial, sans-serif", - id: '70a1e9d0-0311-4164-80cb-c091f10d841f', - }, - { - stack: - "-apple-system, BlinkMacSystemFont, 'avenir next', avenir, 'helvetica neue', helvetica, Ubuntu, roboto, noto, segoe ui, arial, sans-serif", - name: 'body', - id: 'f237d226-cf79-4045-8c13-9591f68de238', - meta: { - weights: [ - { - id: '56d63179-f2f6-4987-8a85-4ff65b469787', - active: false, - weight: '100', - }, - { - weight: '200', - active: false, - id: '3ceb1359-b3ea-40dd-a364-d5560c93576e', - }, - { - weight: '300', - id: '7fb7abbd-c13f-47ac-8939-725681e1e57d', - active: false, - }, - { - weight: '400', - active: false, - id: '75b860fb-bc8b-40d4-95b7-e1c30071d073', - }, - { - weight: '500', - id: 'e0451c68-e9e7-40f7-b621-3394530dbb22', - active: false, - }, - { - id: '282c9d38-035b-4bc7-b196-912dd419001c', - active: false, - weight: '600', - }, - { - id: '34326a88-b6ed-4b60-8172-10e207f01a3b', - active: false, - weight: '700', - }, - { - weight: '800', - id: '7c94f91a-75ec-4586-a41e-76aaf8441feb', - active: false, - }, - { - id: '660e63aa-935a-461e-95e5-550dff750905', - weight: '900', - active: false, - }, - ], - primaryFont: '-apple-system', + colors: { + gray: [ + '#000000', + '#1c1c1c', + '#303030', + '#474747', + '#5d5d5d', + '#757575', + '#8c8c8c', + '#a3a3a3', + '#bababa', + '#d1d1d1', + '#e8e8e8', + '#ffffff', + ], + 'blue-gray': [ + '#0e0e11', + '#21222a', + '#343544', + '#484a5e', + '#5c5f78', + '#717490', + '#8789a6', + '#9c9eba', + '#b1b3cb', + '#c6c8db', + '#dcdce9', + '#f1f1f6', + ], + blue: [ + '#0d0e1a', + '#182142', + '#1e336d', + '#254797', + '#325bbd', + '#476fde', + '#6284f6', + '#809aff', + '#9fb0ff', + '#bcc6ff', + '#d9deff', + '#f4f5ff', + ], + indigo: [ + '#120c1d', + '#211b4d', + '#2f297f', + '#3e38b0', + '#5049dd', + '#675bff', + '#8170ff', + '#9d87ff', + '#b7a0ff', + '#d0baff', + '#e5d6ff', + '#f7f1ff', + ], + violet: [ + '#170a1b', + '#321545', + '#501b71', + '#6d239d', + '#8a2fc5', + '#a641e7', + '#be58ff', + '#d374ff', + '#e392ff', + '#f0b1ff', + '#f9d0ff', + '#fef0ff', + ], + magenta: [ + '#170915', + '#381436', + '#5b1859', + '#7f1e7c', + '#a0289d', + '#bf3abb', + '#d853d2', + '#ea70e4', + '#f78ff0', + '#ffaef8', + '#ffcefc', + '#ffeefe', + ], + red: [ + '#19090a', + '#3e131a', + '#651829', + '#8d1d38', + '#b22749', + '#d23a5b', + '#ec5370', + '#ff7086', + '#ff909e', + '#ffb0b9', + '#ffd0d4', + '#fff0f1', + ], + orange: [ + '#200d02', + '#431706', + '#691e0a', + '#8e280d', + '#b13514', + '#d14721', + '#ea5e36', + '#fd7950', + '#ff9670', + '#ffb495', + '#ffd2be', + '#fff0e9', + ], + gold: [ + '#160f05', + '#402e11', + '#6e4d14', + '#9c6c18', + '#c68a20', + '#eba62e', + '#ffbe44', + '#ffd15e', + '#ffe07c', + '#ffeb9b', + '#fff3bc', + '#fffade', + ], + yellow: [ + '#0d0c04', + '#332f11', + '#585315', + '#7f7719', + '#a49a20', + '#c5ba2c', + '#e1d43f', + '#f6e857', + '#fff673', + '#fffe90', + '#ffffae', + '#ffffcc', + ], + lime: [ + '#161708', + '#323711', + '#505a15', + '#6e7c19', + '#8b9c22', + '#a6b932', + '#bed049', + '#d1e264', + '#e1ee83', + '#edf6a3', + '#f6fbc4', + '#fcfee6', + ], + green: [ + '#071209', + '#102816', + '#133f21', + '#18572d', + '#216f3b', + '#32864b', + '#499c60', + '#66b178', + '#85c492', + '#a7d6af', + '#cae7cf', + '#eef7ef', + ], + teal: [ + '#07110f', + '#102722', + '#133d35', + '#18544a', + '#216b5e', + '#328173', + '#499789', + '#65ac9e', + '#85c0b3', + '#a7d3c9', + '#cae5de', + '#eef7f4', + ], + cyan: [ + '#081111', + '#112627', + '#143c3e', + '#185356', + '#226a6d', + '#338084', + '#4b969a', + '#67abae', + '#87bfc1', + '#a8d2d4', + '#cbe4e5', + '#eef6f7', + ], + modes: { + default: { + background: '#ffffff', + text: '#000000', + border: '#d1d1d1', + primary: '#325bbd', + accent: '#000000', + muted: '#757575', }, - }, - { - id: '3b997853-0e0d-42e9-9a70-6000a5963470', - meta: { - weights: [ - { - id: '96d11324-7d14-4671-bc37-5099806b43a5', - active: false, - weight: '100', - }, - { - weight: '200', - id: '7a112329-a269-41f0-a209-c2321c316aa3', - active: false, - }, - { - weight: '300', - active: false, - id: '2c20a725-77a4-400a-a711-3d8cc29e8b8d', - }, - { - id: '26d9bbe4-d472-4bc9-8d1e-1958f492c873', - weight: '400', - active: false, - }, - { - weight: '500', - id: '24215864-0fb0-4909-9e25-8e70b75a6244', - active: false, - }, - { - id: 'fadc3efb-bddb-4c8d-8154-794c963ee749', - weight: '600', - active: false, - }, - { - active: false, - id: 'bf23b5c9-0f08-4ee0-9f34-4f7a91588520', - weight: '700', - }, - { - weight: '800', - active: false, - id: 'b38d3098-5b52-46d2-ae25-4afe4e231dd8', - }, - { - id: '4c8e7059-6cf5-4681-9ac5-7ebd3730bb23', - active: false, - weight: '900', - }, - ], - primaryFont: 'SFMono-Regular', + dark: { + background: '#000000', + text: '#ffffff', + border: '#000000', + primary: '#476fde', + accent: '#ffffff', + muted: '#bababa', }, - stack: - '"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace', - name: 'mono', - }, - { - id: 'a866c078-4042-4583-94b4-8f28f94a159c', - name: 'Fenix', - stack: 'Fenix', - meta: { - primaryFont: 'Fenix', - weights: [ - { - active: false, - id: 'c482bed0-d789-49d9-9949-5c8751197fdf', - weight: '100', - }, - { - weight: '200', - id: 'd27455d4-da9c-47a1-940e-8c321d120706', - active: false, - }, - { - active: false, - id: '01bee9d4-fb6c-4c02-93aa-680bad91c5dd', - weight: '300', - }, - { - id: 'ac8c58f7-2c15-4a71-8281-ce5f2c1894b5', - weight: '400', - active: true, - }, - { - active: false, - id: 'c96fd4f3-bc87-4650-a57c-7f4b192be050', - weight: '500', - }, - { - active: false, - weight: '600', - id: '2f14dba8-4432-40e5-8eec-69f1796ffdf6', - }, - { - active: false, - weight: '700', - id: '512a3a2a-5cb8-4ea3-9a7c-7c1184da2ad0', - }, - { - active: false, - weight: '800', - id: '42fdcc76-7d57-4ab3-9324-6e28333d56b1', - }, - { - weight: '900', - id: '67a33239-83fc-4c10-8c59-52a914e6cca8', - active: false, - }, - ], + dim: { + background: '#474747', + text: '#bababa', + border: '#303030', + primary: '#bababa', + accent: '#5d5d5d', + muted: '#bababa', }, - }, - { - id: 'b390ca43-d5f3-4394-a802-fd366dc9c05c', - meta: { - primaryFont: 'Inter', - weights: [ - { - id: 'cb067b2e-a25f-4cfb-b16e-34a2333b20c0', - active: true, - weight: '100', - }, - { - weight: '200', - active: true, - id: '97152545-389a-4b6c-9b89-fff51e68c214', - }, - { - active: true, - id: 'fed420fb-290a-477b-8f30-eb6c5a845392', - weight: '300', - }, - { - weight: '400', - active: true, - id: '3c10c797-e07d-4b38-9f26-382f91a3eb4a', - }, - { - id: '8d9254f5-5a63-4ec8-b21c-77ec0ab8cace', - weight: '500', - active: true, - }, - { - weight: '600', - id: '45938ec5-807c-46cf-b2b8-517b0f459e6a', - active: true, - }, - { - id: '8ce95333-9aae-460b-a937-1efbd8d634dd', - active: true, - weight: '700', - }, - { - id: '55bf06a8-b931-4b8a-96a3-909842da28a0', - active: true, - weight: '800', - }, - { - weight: '900', - active: true, - id: 'e6bd057f-6d7a-473c-b29f-caeac5963dc9', - }, - ], + tomato: { + background: '#ffffff', + text: '#000000', + border: 'tomato', + primary: 'tomato', + accent: '#ff9670', + muted: '#757575', }, - name: 'Inter', - stack: 'Inter', - }, - ], - colors: [ - { - id: '676f89ae-fae2-431a-8576-bcac2ae60684', - name: 'gray', - colors: [ - { - value: '#000000', - id: '994f7c8f-aef5-489b-a544-d88a40ceb13d', - }, - { - id: 'e378c407-4949-4623-8e6d-46b51b1c801e', - value: '#1c1c1c', - }, - { - value: '#303030', - id: '85ac4df4-9025-4eaf-ae9d-b552dd63245e', - }, - { - id: 'bb5b9e33-0d96-470e-a836-b78a57e0f0b1', - value: '#474747', - }, - { - id: 'e33ef1f2-e24b-4d58-b54a-3326219c8a1b', - value: '#5d5d5d', - }, - { - id: 'ad0a1bff-23cd-44ed-9c62-e366b0bfd4c1', - value: '#757575', - }, - { - value: '#8c8c8c', - id: 'ea8cac04-081d-454f-ad4d-aae4be5d4683', - }, - { - id: '382d108d-a19d-4f3a-8d60-b530493a8ffc', - value: '#a3a3a3', - }, - { - value: '#bababa', - id: 'be8f6fbe-5ac1-4289-9c50-2e576408e0f1', - }, - { - id: '9d6fcc0d-baae-4c5e-8c03-ec0977be7e5d', - value: '#d1d1d1', - }, - { - id: '94918e4c-bd26-4325-b1e1-c1ac34bd55ca', - value: '#e8e8e8', - }, - { - value: '#ffffff', - id: '01806302-31fc-48d1-aa95-ab59c2019557', - }, - ], - }, - { - colors: [ - { - id: 'ebc22887-ad18-449e-9dac-74090c4c361a', - value: '#0e0e11', - }, - { - id: 'a14b6760-ce4e-48c8-a0d0-53cb20afe964', - value: '#21222a', - }, - { - id: 'ab087c80-4eed-4f0e-a21c-92aadafa2646', - value: '#343544', - }, - { - value: '#484a5e', - id: '7f3cf506-f63e-4985-b039-7992f0614fef', - }, - { - value: '#5c5f78', - id: 'd6618749-954b-412e-8fcf-59f3a2147766', - }, - { - id: 'd619306e-cbfd-43b8-acc5-5b3c27cdd37b', - value: '#717490', - }, - { - id: '73c8c94f-c738-42c4-9a71-3fd1e1624259', - value: '#8789a6', - }, - { - value: '#9c9eba', - id: 'fc5bbe63-1a36-431f-8482-a08ea1d8e387', - }, - { - id: 'be220929-ef59-4ae8-9d8c-d3cd6aa977d1', - value: '#b1b3cb', - }, - { - id: '88143b5d-f9a4-4311-8db6-82f7cb3462bf', - value: '#c6c8db', - }, - { - value: '#dcdce9', - id: '6c414d57-6aff-4759-a05a-5884082cc853', - }, - { - id: 'dbab9712-54e3-4923-8d37-8167f3c6a604', - value: '#f1f1f6', - }, - ], - name: 'blueGray', - id: 'ede541e8-f47a-49a1-986c-e94561f5ab6e', - }, - { - colors: [ - { - id: '22951c33-c96b-4e31-ba3a-018ebc86ebb0', - value: '#0d0e1a', - }, - { - value: '#182142', - id: '32ecb274-dc20-48e7-8122-73d825b85bde', - }, - { - id: 'add83b2e-d6b4-4452-bbc3-218bf3a9d83a', - value: '#1e336d', - }, - { - id: 'df432569-9c0d-4a2e-9d52-13be85f44ffa', - value: '#254797', - }, - { - id: '55863c15-36b1-4ce0-851c-03d69442aa28', - value: '#325bbd', - }, - { - id: 'b06e4108-57be-4313-b0c1-4fb957979762', - value: '#476fde', - }, - { - id: 'c0ae9fcc-922b-4dd3-aca5-444f0f76b9e8', - value: '#6284f6', - }, - { - id: '5c519758-18eb-449f-a7d9-41ff2b4572de', - value: '#809aff', - }, - { - value: '#9fb0ff', - id: '00087aae-03bb-4df5-9371-5c5fdcdc01a6', - }, - { - value: '#bcc6ff', - id: 'd521c703-de49-4d93-b452-f379eef24677', - }, - { - value: '#d9deff', - id: '33e7b08d-1c36-444a-a285-98a040859e21', - }, - { - value: '#f4f5ff', - id: '82716009-7f2f-463e-a956-614fe2909494', - }, - ], - id: 'faf999a6-b94b-49d9-9d76-849c1f27405a', - name: 'blue', - }, - { - id: '46099834-dc24-4836-b6bb-694af3484f81', - name: 'indigo', - colors: [ - { - value: '#120c1d', - id: '5fa282c2-583d-4452-9877-c90d1ea6c7ca', - }, - { - id: 'a508ddc5-3e98-4eb3-ab2c-202b03e6ac45', - value: '#211b4d', - }, - { - value: '#2f297f', - id: '42b92b7c-1279-4fca-930e-50851539dd20', - }, - { - id: '89c53ffb-4c04-44f5-9a46-fcf30dd05703', - value: '#3e38b0', - }, - { - value: '#5049dd', - id: '2b188162-6854-4bd9-8250-5f05c396bf50', - }, - { - value: '#675bff', - id: 'ec8f3796-51fc-4774-b834-e584579dba30', - }, - { - id: 'd35fc8e8-f557-4fad-b9cb-181ad1a3b671', - value: '#8170ff', - }, - { - id: '042ba1cc-1f16-4916-a819-c86658028bc3', - value: '#9d87ff', - }, - { - id: '3cbd0c05-fde7-481b-9816-3776434c6a24', - value: '#b7a0ff', - }, - { - id: 'f9a64b57-c430-4ded-a80e-1b5e4187411b', - value: '#d0baff', - }, - { - value: '#e5d6ff', - id: '4b35430f-f4a8-4386-958c-14139efdea89', - }, - { - value: '#f7f1ff', - id: 'c4db62f0-6aac-4aa5-a93f-bce970e4c648', - }, - ], - }, - { - name: 'violet', - colors: [ - { - id: '21e2165c-e503-4a31-96e0-bf2e55ef439b', - value: '#170a1b', - }, - { - id: '3ee72903-29dc-4d83-b78c-013b4908279b', - value: '#321545', - }, - { - value: '#501b71', - id: '254178dd-c278-42d8-ba9d-9264b23e2299', - }, - { - id: '1527bf46-5fd3-4ca4-9358-660a285aa963', - value: '#6d239d', - }, - { - id: 'd20756fb-c78f-4a43-835b-d8be92f411f4', - value: '#8a2fc5', - }, - { - value: '#a641e7', - id: 'f8327841-cb8f-4113-81ab-739b79652636', - }, - { - value: '#be58ff', - id: '0e245f0d-5d12-44c3-9098-ec93c2ca9c62', - }, - { - value: '#d374ff', - id: '9a31e914-5eee-41a9-bf7f-c1cb03f2b50d', - }, - { - id: 'a7e693a4-8aa4-48f2-8143-d7d4b0c4e4d0', - value: '#e392ff', - }, - { - value: '#f0b1ff', - id: 'b219c525-70bd-4b3d-929a-b447754a2fe6', - }, - { - value: '#f9d0ff', - id: 'd24fd0b2-0fde-4b13-b360-fa0c2bf01fb4', - }, - { - value: '#fef0ff', - id: '423ecf33-a980-487a-9428-48af043491cc', - }, - ], - id: '976722da-7882-4e0c-90fd-9dd4c1162057', - }, - { - id: '537d5e87-dd99-4210-bed9-af732d4d15b1', - colors: [ - { - id: '1b474ed6-b774-4339-a237-777884a9cb68', - value: '#170915', - }, - { - value: '#381436', - id: '333ac691-622c-418d-aff9-061b032270d5', - }, - { - id: '72bfde86-7b1f-4a31-b5c6-26921a35bea7', - value: '#5b1859', - }, - { - value: '#7f1e7c', - id: 'd7d8cd1c-f22a-455a-812b-c17a8004d9dc', - }, - { - id: '9f1a8f1f-02d1-4193-9b27-52b83d35eddd', - value: '#a0289d', - }, - { - value: '#bf3abb', - id: '26eb724e-fde5-47f8-8079-20cae82af85e', - }, - { - value: '#d853d2', - id: '4c16844b-6727-4fdd-a3aa-b5b2fa2c8c1b', - }, - { - value: '#ea70e4', - id: '536d5e5b-dfd0-47a2-96d1-118cf6608260', - }, - { - id: '6d47122e-d3e0-4d1a-8e05-1a0d81e4c723', - value: '#f78ff0', - }, - { - value: '#ffaef8', - id: 'd36cac2a-aa79-489c-ab77-b5477ac7826b', - }, - { - id: '84057845-db4b-4760-a067-50684320b38e', - value: '#ffcefc', - }, - { - value: '#ffeefe', - id: '74cd8468-6fe0-43e0-889d-46b621bc2c83', - }, - ], - name: 'magenta', - }, - { - name: 'red', - id: 'bf8f1a8f-fcaf-4bdd-a22a-1bac8a3c5956', - colors: [ - { - id: '6657684c-b22c-420c-b93e-0536532cc2b9', - value: '#19090a', - }, - { - id: '81e22113-dde3-453f-861d-6e7a854b1fc5', - value: '#3e131a', - }, - { - id: 'c919f6bb-b52f-4910-90fd-0f8788e09fcd', - value: '#651829', - }, - { - value: '#8d1d38', - id: 'c88e73af-9897-4ad9-a781-a10802ce1bf8', - }, - { - value: '#b22749', - id: '5ecec09b-9b68-4773-a5f0-203ed38f28fd', - }, - { - id: '64e7ed64-d29b-4edf-98c1-651cd35dee75', - value: '#d23a5b', - }, - { - id: '278faedc-4f31-458f-b045-eb0e666c972b', - value: '#ec5370', - }, - { - id: '91abfadb-c46f-4bb7-9f6f-d79d6e806d57', - value: '#ff7086', - }, - { - id: '6a493b21-6b82-477c-885e-85fa6798152f', - value: '#ff909e', - }, - { - id: 'ae728c4c-0db2-4213-8475-29967d269b1d', - value: '#ffb0b9', - }, - { - value: '#ffd0d4', - id: '35465458-b911-40b4-9a44-4547b9f27d2c', - }, - { - value: '#fff0f1', - id: '74fe8217-e90c-4548-a952-963d5615d04d', - }, - ], - }, - { - colors: [ - { - value: '#200d02', - id: '62de84dc-8b55-4d21-a907-df2b7e648972', - }, - { - id: '0e44d39a-d7cd-4717-b79d-1d8847b588e3', - value: '#431706', - }, - { - value: '#691e0a', - id: '01fc4564-a995-4536-898d-ed15b96ae4da', - }, - { - value: '#8e280d', - id: '8071d43e-7c2c-4eb2-80ca-1492068dac19', - }, - { - id: '56f73d5b-ea15-4226-8848-f7253b9d3d1b', - value: '#b13514', - }, - { - value: '#d14721', - id: '659fbf48-0845-47e1-8d02-9577ea410281', - }, - { - value: '#ea5e36', - id: 'bf9d17d5-4b0d-4ad4-9056-fa6286d16244', - }, - { - id: '2f229011-4cb3-4c1d-9993-882338eb37df', - value: '#fd7950', - }, - { - id: '1297d1de-4ac1-4d90-a452-a887699a854d', - value: '#ff9670', - }, - { - id: '3ce7b3eb-dc76-4cfc-b1cb-b869fc8153f1', - value: '#ffb495', - }, - { - id: '6e7d0c64-724d-4ad2-84c7-458602db0077', - value: '#ffd2be', - }, - { - id: '1c729b9f-2c09-4098-90da-c07fc4dd6fda', - value: '#fff0e9', - }, - ], - name: 'orange', - id: '4d5c2c0a-1782-4c74-a549-9437ea09e472', - }, - { - colors: [ - { - id: 'fa181129-4e85-4b2e-a12e-3283fa4154e8', - value: '#160f05', - }, - { - id: '79c72fba-0af8-4950-8210-13889bd6a8e0', - value: '#402e11', - }, - { - value: '#6e4d14', - id: 'c2ad3cfa-0116-4e61-94a9-f0256f44c22b', - }, - { - id: '0f352443-fbfd-42eb-96dd-79e462b99eb3', - value: '#9c6c18', - }, - { - id: 'c1325599-ce71-452b-b102-b630f9879fb4', - value: '#c68a20', - }, - { - id: '8712e418-d874-4c11-ad4d-a7d0d4cede86', - value: '#eba62e', - }, - { - id: 'bbc049ae-60ec-4649-8e11-147aba4e7c99', - value: '#ffbe44', - }, - { - value: '#ffd15e', - id: '35b05e85-ec88-41e4-b74a-33b9d6457114', - }, - { - value: '#ffe07c', - id: '3b736565-e325-4acc-8c58-f6065ef5c8ba', - }, - { - id: '8404df34-3da1-45c0-ad35-fc92b83926b2', - value: '#ffeb9b', - }, - { - id: '7ec762d1-33e3-4e58-9a91-3d7a8df98f2c', - value: '#fff3bc', - }, - { - value: '#fffade', - id: '0462ddb0-1538-43d9-90a3-cc11e0177dc7', - }, - ], - name: 'gold', - id: '09a65ee0-c8d9-4983-8f11-bb91a43fd423', - }, - { - colors: [ - { - id: 'fef27661-9135-4e7d-86ab-17520d665b54', - value: '#0d0c04', - }, - { - value: '#332f11', - id: '47a73e4a-fb2c-4c69-aefe-1f096e5805a0', - }, - { - value: '#585315', - id: 'e6a22935-c247-4114-838e-2524e449a60d', - }, - { - value: '#7f7719', - id: 'fa29b2e4-199c-4ac1-a9d0-372dc2606ad3', - }, - { - id: '9103bab7-b07e-4265-ad7d-9a7edac95559', - value: '#a49a20', - }, - { - id: '037029c3-aba5-4363-970c-d9a3bc3ec76e', - value: '#c5ba2c', - }, - { - id: 'e202afb8-cb2e-4b01-97ec-ff81530b0bba', - value: '#e1d43f', - }, - { - id: 'd62cb6e7-1212-453d-ab08-11286ae7da77', - value: '#f6e857', - }, - { - value: '#fff673', - id: '709802e6-310a-43db-953a-33bc10d9f556', - }, - { - value: '#fffe90', - id: 'c8dd03cb-5642-4ef2-b7f1-4ba882c79239', - }, - { - id: '548dac3d-1d4b-43a8-ad1e-9d4b476f7bd2', - value: '#ffffae', - }, - { - id: '7689ec0d-4c8f-47a4-af4a-bb30789a8231', - value: '#ffffcc', - }, - ], - id: '1176151b-839e-425c-9e49-cab3b85b6ae2', - name: 'yellow', - }, - { - id: 'b972212e-9a08-4944-9660-a9576fbbf288', - colors: [ - { - id: '210da771-db2e-4a69-9050-d93dbc6cf8b4', - value: '#161708', - }, - { - id: '16d94297-1828-4563-b44f-061d2aa8b31f', - value: '#323711', - }, - { - id: 'ab5bbf28-8895-4cae-8e49-c48c9933b966', - value: '#505a15', - }, - { - id: '5adaf95e-0a94-459a-b1c5-6142f77009ff', - value: '#6e7c19', - }, - { - value: '#8b9c22', - id: '40130f30-6f4d-45eb-971c-dcfab284942f', - }, - { - value: '#a6b932', - id: '6b72830d-c3eb-4b5a-a22a-61bb0254d48b', - }, - { - id: '141ce1b7-35f3-4efe-9f87-3a94b8eefd77', - value: '#bed049', - }, - { - value: '#d1e264', - id: 'fa5b7910-2496-4221-8abd-9f0155d6c7da', - }, - { - value: '#e1ee83', - id: 'dc154a93-646e-4bfc-a163-3a9a8111311c', - }, - { - value: '#edf6a3', - id: '7eae4872-7d2a-4c01-a0d3-81d4fac0faab', - }, - { - id: '6fbaa168-763a-4768-9a93-a072cdfbd38b', - value: '#f6fbc4', - }, - { - id: 'e9dc8a9d-b5ff-4808-94ab-6005d9c576e3', - value: '#fcfee6', - }, - ], - name: 'lime', - }, - { - id: 'b94db715-3882-474f-a890-c88aac4a1534', - name: 'green', - colors: [ - { - value: '#071209', - id: '4e9f3f19-f0f3-49c2-9c63-a93956e25f35', - }, - { - value: '#102816', - id: 'ef6f06e7-0d90-4bd5-a770-dbc5f9346848', - }, - { - id: 'c788fc76-c704-48a0-8cb9-9b3c161affdd', - value: '#133f21', - }, - { - id: 'febeecb1-48fd-4789-9a00-a45a86e8caaf', - value: '#18572d', - }, - { - id: 'b8a18152-01d3-432a-9961-bdfa0b9ceeef', - value: '#216f3b', - }, - { - value: '#32864b', - id: '788ba587-643c-42a8-9d13-ec1719c95733', - }, - { - value: '#499c60', - id: '05c5b798-4cc9-456b-aec0-20144f444369', - }, - { - id: 'd51bad40-05b0-4188-9e5e-c07e002e27b6', - value: '#66b178', - }, - { - id: '6073c2ef-28cf-4f69-aba0-a2d69cc6c17f', - value: '#85c492', - }, - { - value: '#a7d6af', - id: 'b85c1013-2265-4ae4-a595-1c608f4e627d', - }, - { - id: '05d744ab-2a0c-4425-b1ac-d726df3227e7', - value: '#cae7cf', - }, - { - value: '#eef7ef', - id: '34e2d535-845d-4bce-bd47-3dd5bb11da26', - }, - ], }, - { - id: '972ef60e-e7aa-484b-b651-4ab19659099c', - colors: [ - { - id: '4c15e14a-0803-4101-931f-3d501b7b3aba', - value: '#07110f', - }, - { - id: '30486ca0-3607-4dd6-b381-8615ee631450', - value: '#102722', - }, - { - value: '#133d35', - id: '607dcf2c-18b6-4800-a916-cf0cf8f44836', - }, - { - id: '2308379d-543b-4a60-8239-b5247306c294', - value: '#18544a', - }, - { - value: '#216b5e', - id: '43884516-f64d-4448-94cf-e5ce7690a05c', - }, - { - id: 'a6c56f5f-e506-492f-9a87-bf07a77f547d', - value: '#328173', - }, - { - id: '59639620-0d23-4db5-8c29-c02fc9b91709', - value: '#499789', - }, - { - id: '48058a9f-0148-41fc-b9f0-e3e820683277', - value: '#65ac9e', - }, - { - value: '#85c0b3', - id: 'e67295e1-9860-4173-8534-274efa611930', - }, - { - value: '#a7d3c9', - id: '26e4af86-28ec-4e55-a4a5-593651a28362', - }, - { - id: '63aa7c56-d270-472e-a80b-5ab1d06d813c', - value: '#cae5de', - }, - { - id: 'd2a4fb79-f99b-4eca-95c5-67d702681f79', - value: '#eef7f4', - }, - ], - name: 'teal', - }, - { - colors: [ - { - value: '#081111', - id: '66a2f872-37ea-44fa-927a-a0aa88c554f0', - }, - { - value: '#112627', - id: 'fa0313ed-4236-41f2-8797-19e5a1a06c01', - }, - { - id: '5748eac7-d905-4cfa-a1e9-2b3f867b03a3', - value: '#143c3e', - }, - { - id: 'da91f19d-71d2-42a4-b69b-8c7fcb145e6e', - value: '#185356', - }, - { - value: '#226a6d', - id: 'a464fe50-17ea-4731-8b17-2c89ec1eaf3d', - }, - { - value: '#338084', - id: 'a7503d87-4919-47cb-bdbf-4b1fbf334d79', - }, - { - id: '6bff1c61-8a6e-416f-b9a8-e662573aec1c', - value: '#4b969a', - }, - { - value: '#67abae', - id: 'cffdc97b-794a-40b8-b320-9729e6468df7', - }, - { - value: '#87bfc1', - id: 'eae73c5a-37dc-44ef-857d-d0da7e72bf49', - }, - { - id: '8b7c24a0-08e5-4981-9bd8-0ba211499c4d', - value: '#a8d2d4', - }, - { - id: '987fa1b0-0dd9-4f57-af88-fcb8b6b61016', - value: '#cbe4e5', - }, - { - id: '62682a6a-1b54-4262-a5db-6bc714d00ace', - value: '#eef6f7', - }, - ], - id: '795d336e-6e9b-4510-b3a8-4f85230a75c4', - name: 'cyan', - }, - ], - text: [ - { - name: 'heading', - id: '81522f2c-555a-4080-8f74-4c3ed90cff30', - styles: [ - { - value: 'body', - aliasId: 'f237d226-cf79-4045-8c13-9591f68de238', - id: '4330b346-a5c9-445b-be3c-07c5282350b1', - name: 'fontFamily', - }, - { - value: 700, - name: 'fontWeight', - id: '33014b4a-6ab4-4939-b9da-b2b45a9f921c', - }, - { - aliasId: 'd7bc4a9b-2d57-4dc2-9452-89f8ae1009e5', - unit: 'raw', - value: 1, - name: 'lineHeight', - id: 'fcf9c66b-d7de-450f-b64f-07f633ad4aaa', - }, - { - aliasId: '48c0dff6-0ba7-49f1-9961-8d78b43893d7', - name: 'letterSpacing', - unit: 'raw', - value: 2, - id: '647bbc4e-9bc8-4c03-8634-719253128616', - }, - { - value: 1, - unit: 'raw', - aliasId: '982efd46-1bb5-447e-8e38-ff48170253c4', - name: 'fontSize', - id: 'e09f4822-c782-4dd0-81e4-876fabd6c2ee', - }, - ], - }, - ], - borderRadius: [ - { - value: 0, - unit: 'px', - id: 'd3a18eec-caa5-4820-a38b-be1f965fd2f4', - }, - { - value: 4, - unit: 'px', - id: 'ba1db5fd-7072-42aa-9a13-d191334ae84a', - }, - { - unit: 'px', - value: 8, - id: '570a2b2a-7418-44ec-b8cb-5d46927a713f', - }, - { - unit: 'px', - id: '17acdfc2-32d3-4114-bfb4-562987fbd2b6', - value: 16, - }, - { - value: 32, - unit: 'px', - id: '980bf6c0-c74c-497b-b6c6-9101e47c1c08', - }, - { - value: 64, - unit: 'px', - id: '62de8f22-203a-40f1-a152-4a2c26c57e86', - }, - { - value: 9999999, - id: '9bc38b2b-dec8-4947-8137-fbbec8f5f219', - unit: 'px', - }, - ], - letterSpacings: [ - { - id: '0186ef74-ee18-46bf-adc1-53866c3ef91b', - value: 0.1, - unit: 'em', - name: 'tracked', - }, - { - id: '33e0203c-1c02-44d7-b484-c749b9bfc283', - name: 'negative', - unit: 'em', - value: -0.05, - }, - { - value: 0.25, - id: '48c0dff6-0ba7-49f1-9961-8d78b43893d7', - name: 'large', - unit: 'em', - }, - ], + }, + description: '', + durations: [], + boxShadows: {}, + textShadows: {}, + easingFunctions: {}, + gradients: {}, } diff --git a/apps/docs/pages/html-editor.tsx b/apps/docs/pages/html-editor.tsx index 4da20cff..66a49f37 100644 --- a/apps/docs/pages/html-editor.tsx +++ b/apps/docs/pages/html-editor.tsx @@ -1,5 +1,6 @@ import { HtmlEditor, HtmlRenderer, HtmlEditorProvider } from '@compai/css-gui' import { useState } from 'react' +import { defaultTheme } from '../data/default-theme' const initialValue: any = { tagName: 'div', @@ -31,7 +32,7 @@ const initialValue: any = { tagName: 'h1', attributes: {}, style: { - color: { type: 'theme', path: 'primary' }, + color: '#4e4fec', fontSize: { type: 'responsive', values: [ @@ -816,7 +817,7 @@ const initialValue: any = { }, ], ':hover': { - color: { type: 'theme', path: 'primaryHover' }, + color: '#4041c2', }, }, attributes: { @@ -860,7 +861,7 @@ const initialValue: any = { }, ], ':hover': { - backgroundColor: { type: 'theme', path: 'primaryHover' }, + backgroundColor: '#4041c2', }, }, children: [{ type: 'text', value: 'Primary Button' }], @@ -974,7 +975,7 @@ const initialValue: any = { }, ], ':hover': { - color: { type: 'theme', path: 'primary' }, + color: '#4e4fec', }, }, attributes: { @@ -1312,7 +1313,7 @@ const initialValue: any = { tagName: 'blockquote', style: { borderLeftWidth: { value: 4, unit: 'px' }, - borderLeftColor: { type: 'theme', path: 'primary' }, + borderLeftColor: '#4e4fec', borderLeftStyle: 'solid', marginLeft: { value: 0, unit: 'px' }, paddingLeft: { value: 32, unit: 'px' }, @@ -1494,7 +1495,7 @@ export default function HtmlEditorExample() { const [html, setHtml] = useState(initialValue) return ( - +
-
+
From 141b70c778cff683cd2bd5fdbd86e8ce46b86a4a Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 08:26:19 -0600 Subject: [PATCH 068/418] Pass theme to shorthands --- .changeset/poor-trees-pay.md | 5 +++++ packages/gui/src/components/schemas/object.tsx | 6 +++--- 2 files changed, 8 insertions(+), 3 deletions(-) create mode 100644 .changeset/poor-trees-pay.md diff --git a/.changeset/poor-trees-pay.md b/.changeset/poor-trees-pay.md new file mode 100644 index 00000000..069e434d --- /dev/null +++ b/.changeset/poor-trees-pay.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Pass theme to shorthands diff --git a/packages/gui/src/components/schemas/object.tsx b/packages/gui/src/components/schemas/object.tsx index 2f773d72..bd030d7e 100644 --- a/packages/gui/src/components/schemas/object.tsx +++ b/packages/gui/src/components/schemas/object.tsx @@ -25,17 +25,17 @@ export function objectSchema({ defaultValue: providedDefaultValue, parse, }: CreateObject): DataTypeSchema { - function stringify(value: T) { + function stringify(value: T, ...args) { if (providedStringify) { const stringifiedFields = mapValues(fields, (schema, key: keyof T) => { - return schema.stringify(value[key]) + return schema.stringify(value[key], ...args) }) as any return providedStringify(stringifiedFields) } // By default, join the stringified values with spaces in key order return keyOrder .map((key) => { - return fields[key].stringify(value[key]) + return fields[key].stringify(value[key], ...args) }) .join(separator) } From 6f28e1db7ea63ff53a805bf754ef7f02de3fc9b3 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 09:04:58 -0600 Subject: [PATCH 069/418] Add theme support for box side properties --- .changeset/little-plums-melt.md | 5 +++++ packages/gui/src/components/schemas/box-side.tsx | 8 +++++--- 2 files changed, 10 insertions(+), 3 deletions(-) create mode 100644 .changeset/little-plums-melt.md diff --git a/.changeset/little-plums-melt.md b/.changeset/little-plums-melt.md new file mode 100644 index 00000000..ae0f886a --- /dev/null +++ b/.changeset/little-plums-melt.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Add theme support for box side properties diff --git a/packages/gui/src/components/schemas/box-side.tsx b/packages/gui/src/components/schemas/box-side.tsx index 13241b3b..a7f133c3 100644 --- a/packages/gui/src/components/schemas/box-side.tsx +++ b/packages/gui/src/components/schemas/box-side.tsx @@ -23,10 +23,10 @@ export interface BoxSide { export function boxSideSchema({ itemSchema, }: CreateBoxSideSchema): DataTypeSchema> { - function stringify(value: BoxSide) { + function stringify(value: BoxSide, ...args) { const { stringify, defaultValue } = itemSchema if (isLinked(value)) { - return stringify(value.top) + return stringify(value.top, ...args) } const { top, @@ -34,7 +34,9 @@ export function boxSideSchema({ bottom = defaultValue, left = defaultValue, } = value - return [top, right, bottom, left].map(stringify as any).join(' ') + return [top, right, bottom, left] + .map((side) => stringify(side, ...args)) + .join(' ') } const defaultValue = { top: itemSchema.defaultValue, From 91ee229a0224e5296db4f5eff355d887e9f73ba6 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 15:05:48 +0000 Subject: [PATCH 070/418] Version Packages --- .changeset/little-plums-melt.md | 5 ----- .changeset/poor-trees-pay.md | 5 ----- packages/gui/CHANGELOG.md | 7 +++++++ packages/gui/package.json | 2 +- 4 files changed, 8 insertions(+), 11 deletions(-) delete mode 100644 .changeset/little-plums-melt.md delete mode 100644 .changeset/poor-trees-pay.md diff --git a/.changeset/little-plums-melt.md b/.changeset/little-plums-melt.md deleted file mode 100644 index ae0f886a..00000000 --- a/.changeset/little-plums-melt.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Add theme support for box side properties diff --git a/.changeset/poor-trees-pay.md b/.changeset/poor-trees-pay.md deleted file mode 100644 index 069e434d..00000000 --- a/.changeset/poor-trees-pay.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Pass theme to shorthands diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index a3d32744..719c391c 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,12 @@ # @compai/css-gui +## 0.0.145 + +### Patch Changes + +- 6f28e1db: Add theme support for box side properties +- 141b70c7: Pass theme to shorthands + ## 0.0.144 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 8f7c7159..1f8e4a68 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.144", + "version": "0.0.145", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 888a55feebead3b17f180f6d62b01b6ba213582e Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 09:18:10 -0600 Subject: [PATCH 071/418] Set default to current color --- .changeset/old-walls-care.md | 5 +++++ packages/gui/src/components/schemas/color.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/old-walls-care.md diff --git a/.changeset/old-walls-care.md b/.changeset/old-walls-care.md new file mode 100644 index 00000000..a28264da --- /dev/null +++ b/.changeset/old-walls-care.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Set default to current color diff --git a/packages/gui/src/components/schemas/color.ts b/packages/gui/src/components/schemas/color.ts index 10102e6f..d3dca34b 100644 --- a/packages/gui/src/components/schemas/color.ts +++ b/packages/gui/src/components/schemas/color.ts @@ -65,7 +65,7 @@ export function color({ defaultValue?: any } = {}) { return joinSchemas([ - keyword(['transparent', 'currentcolor'], { type: 'system' }), + keyword(['currentcolor', 'transparent'], { type: 'system' }), rawColor({ defaultValue }), themeColor, ]) From 33b34e95fd87021ccaa2c4d98e20c675b075a507 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 15:18:58 +0000 Subject: [PATCH 072/418] Version Packages --- .changeset/old-walls-care.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/old-walls-care.md diff --git a/.changeset/old-walls-care.md b/.changeset/old-walls-care.md deleted file mode 100644 index a28264da..00000000 --- a/.changeset/old-walls-care.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Set default to current color diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 719c391c..43a0e717 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.146 + +### Patch Changes + +- 888a55fe: Set default to current color + ## 0.0.145 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 1f8e4a68..7b1d0cdc 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.145", + "version": "0.0.146", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 7e8991b8f1ea142d759faeca653125fd26c82571 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 12:30:39 -0600 Subject: [PATCH 073/418] Only set default canvas styles in canvas mode --- .changeset/blue-dolphins-care.md | 5 +++++ packages/gui/src/components/html/Renderer.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/blue-dolphins-care.md diff --git a/.changeset/blue-dolphins-care.md b/.changeset/blue-dolphins-care.md new file mode 100644 index 00000000..e00e38b9 --- /dev/null +++ b/.changeset/blue-dolphins-care.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Only set default canvas styles in canvas mode diff --git a/packages/gui/src/components/html/Renderer.tsx b/packages/gui/src/components/html/Renderer.tsx index 7e5d4be1..3ead876e 100644 --- a/packages/gui/src/components/html/Renderer.tsx +++ b/packages/gui/src/components/html/Renderer.tsx @@ -45,7 +45,7 @@ function ElementRenderer({ value, canvas, path }: ElementRendererProps) { const sx = toCSSObject( { ...style, - ...DEFAULT_ELEMENT_STYLES_IN_CANVAS, + ...(canvas ? DEFAULT_ELEMENT_STYLES_IN_CANVAS : {}), }, theme ) From bc46d4fefb42b9871c1f83d019203eb8cfe6f470 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 18:31:46 +0000 Subject: [PATCH 074/418] Version Packages --- .changeset/blue-dolphins-care.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/blue-dolphins-care.md diff --git a/.changeset/blue-dolphins-care.md b/.changeset/blue-dolphins-care.md deleted file mode 100644 index e00e38b9..00000000 --- a/.changeset/blue-dolphins-care.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Only set default canvas styles in canvas mode diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 43a0e717..2939370a 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.147 + +### Patch Changes + +- 7e8991b8: Only set default canvas styles in canvas mode + ## 0.0.146 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 7b1d0cdc..cfa19f9c 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.146", + "version": "0.0.147", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 5bd603aa4eb6cb19bd763d364d9af51ea61a414c Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 13:59:38 -0600 Subject: [PATCH 075/418] Allow cursor to be overridden in canvas --- .changeset/cool-islands-argue.md | 5 +++++ packages/gui/src/components/html/Renderer.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/cool-islands-argue.md diff --git a/.changeset/cool-islands-argue.md b/.changeset/cool-islands-argue.md new file mode 100644 index 00000000..cfd0235f --- /dev/null +++ b/.changeset/cool-islands-argue.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Allow cursor to be overridden in canvas diff --git a/packages/gui/src/components/html/Renderer.tsx b/packages/gui/src/components/html/Renderer.tsx index 3ead876e..c7b84b7c 100644 --- a/packages/gui/src/components/html/Renderer.tsx +++ b/packages/gui/src/components/html/Renderer.tsx @@ -44,8 +44,8 @@ function ElementRenderer({ value, canvas, path }: ElementRendererProps) { const sx = toCSSObject( { - ...style, ...(canvas ? DEFAULT_ELEMENT_STYLES_IN_CANVAS : {}), + ...style, }, theme ) From 97d48aee4ad70180cdb0e95eb2848a763dcf546d Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 14:08:39 -0600 Subject: [PATCH 076/418] Fix translate 3d --- .changeset/fast-peaches-call.md | 5 +++++ packages/gui/src/components/schemas/transform.tsx | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/fast-peaches-call.md diff --git a/.changeset/fast-peaches-call.md b/.changeset/fast-peaches-call.md new file mode 100644 index 00000000..da2506ab --- /dev/null +++ b/.changeset/fast-peaches-call.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Fix translate3d diff --git a/packages/gui/src/components/schemas/transform.tsx b/packages/gui/src/components/schemas/transform.tsx index b5b4dbdf..87a665cd 100644 --- a/packages/gui/src/components/schemas/transform.tsx +++ b/packages/gui/src/components/schemas/transform.tsx @@ -17,7 +17,7 @@ const translateX = functionSchema('translateX', lengthPercentage()) const translateY = functionSchema('translateY', lengthPercentage()) const translateZ = functionSchema('translateZ', lengthPercentage()) const translate3d = functionSchema( - 'trnaslate3d', + 'translate3d', tupleSchema({ // TODO 'z' axis should be `length` only itemSchema: lengthPercentage(), From a3bc586701d3731c7acddfa607a3d056ed14c752 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 20:09:32 +0000 Subject: [PATCH 077/418] Version Packages --- .changeset/cool-islands-argue.md | 5 ----- .changeset/fast-peaches-call.md | 5 ----- packages/gui/CHANGELOG.md | 7 +++++++ packages/gui/package.json | 2 +- 4 files changed, 8 insertions(+), 11 deletions(-) delete mode 100644 .changeset/cool-islands-argue.md delete mode 100644 .changeset/fast-peaches-call.md diff --git a/.changeset/cool-islands-argue.md b/.changeset/cool-islands-argue.md deleted file mode 100644 index cfd0235f..00000000 --- a/.changeset/cool-islands-argue.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Allow cursor to be overridden in canvas diff --git a/.changeset/fast-peaches-call.md b/.changeset/fast-peaches-call.md deleted file mode 100644 index da2506ab..00000000 --- a/.changeset/fast-peaches-call.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Fix translate3d diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 2939370a..b71386d0 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,12 @@ # @compai/css-gui +## 0.0.148 + +### Patch Changes + +- 5bd603aa: Allow cursor to be overridden in canvas +- 97d48aee: Fix translate3d + ## 0.0.147 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index cfa19f9c..c892881f 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.147", + "version": "0.0.148", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 20d8faca83ef89d36ba8e60d07e0f254ca6b9909 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 14:31:27 -0600 Subject: [PATCH 078/418] Add a dev page --- apps/docs/pages/_app.tsx | 1 + apps/docs/pages/dev.tsx | 165 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 166 insertions(+) create mode 100644 apps/docs/pages/dev.tsx diff --git a/apps/docs/pages/_app.tsx b/apps/docs/pages/_app.tsx index de98fa1d..50226129 100644 --- a/apps/docs/pages/_app.tsx +++ b/apps/docs/pages/_app.tsx @@ -22,6 +22,7 @@ Router.events.on('routeChangeComplete', (url) => { const NO_NAV_PAGES: Record = { '/playground': true, '/html-editor': true, + '/dev': true, } const isNoNavPage = (router: NextRouter) => { if (router.pathname.startsWith('/library')) { diff --git a/apps/docs/pages/dev.tsx b/apps/docs/pages/dev.tsx new file mode 100644 index 00000000..b7620e9e --- /dev/null +++ b/apps/docs/pages/dev.tsx @@ -0,0 +1,165 @@ +import { HtmlEditor, HtmlRenderer, HtmlEditorProvider } from '@compai/css-gui' +import { useState } from 'react' +import { defaultTheme } from '../data/default-theme' + +const initialValue: any = { + tagName: 'div', + style: { + paddingTop: { + value: 128, + unit: 'px', + }, + paddingBottom: { + value: 128, + unit: 'px', + }, + }, + children: [ + { + tagName: 'header', + style: { + paddingLeft: { + value: 64, + unit: 'px', + }, + paddingRight: { + value: 64, + unit: 'px', + }, + }, + children: [ + { + tagName: 'h1', + attributes: {}, + style: { + color: '#4e4fec', + fontSize: { + type: 'responsive', + values: [ + { + value: 4, + unit: 'rem', + }, + { + value: 6, + unit: 'rem', + }, + { + value: 10, + unit: 'rem', + }, + ], + }, + fontWeight: '900', + fontFamily: 'Inter', + letterSpacing: { value: -8, unit: 'px' }, + marginTop: { + value: 0, + unit: 'px', + }, + marginBottom: { + value: 0, + unit: 'px', + }, + lineHeight: { + value: 1.25, + unit: 'number', + }, + }, + children: [{ type: 'text', value: 'CSS.GUI' }], + }, + { + tagName: 'h2', + attributes: {}, + style: { + marginBottom: { + value: 0, + unit: 'px', + }, + fontSize: { + value: 48, + unit: 'px', + }, + maxWidth: { + value: 40, + unit: 'em', + }, + lineHeight: { + value: 1.25, + unit: 'number', + }, + }, + children: [ + { + type: 'text', + value: + 'Quickly build components with custom styling panels. No coding required.', + }, + ], + }, + { + tagName: 'p', + style: { + marginBottom: { + value: 96, + unit: 'px', + }, + fontSize: { + value: 20, + unit: 'px', + }, + maxWidth: { + value: 40, + unit: 'em', + }, + }, + children: [ + { + type: 'text', + value: + 'Click anywhere on the canvas to start. Go ahead. Click away.', + }, + ], + }, + ], + }, + ], +} + +export default function HtmlEditorExample() { + const [html, setHtml] = useState(initialValue) + + return ( + + + + ) +} From 87d117be6f7e32b531561a8de30973a487c74a11 Mon Sep 17 00:00:00 2001 From: John Otander Date: Wed, 6 Jul 2022 14:39:17 -0600 Subject: [PATCH 079/418] Fix skew x/y --- .changeset/big-jobs-cough.md | 5 +++++ packages/gui/src/components/schemas/transform.tsx | 1 + 2 files changed, 6 insertions(+) create mode 100644 .changeset/big-jobs-cough.md diff --git a/.changeset/big-jobs-cough.md b/.changeset/big-jobs-cough.md new file mode 100644 index 00000000..10b1e4b2 --- /dev/null +++ b/.changeset/big-jobs-cough.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Fix skew x/y diff --git a/packages/gui/src/components/schemas/transform.tsx b/packages/gui/src/components/schemas/transform.tsx index 87a665cd..f446440f 100644 --- a/packages/gui/src/components/schemas/transform.tsx +++ b/packages/gui/src/components/schemas/transform.tsx @@ -69,6 +69,7 @@ const skew = functionSchema( tupleSchema({ itemSchema: angle(), labels: ['x', 'y'], + separator: ',', }) ) const skewX = functionSchema('skewX', angle()) From 091b934d1db716f51a1e3ef3bfa0341c7d4f9ba6 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 6 Jul 2022 20:40:09 +0000 Subject: [PATCH 080/418] Version Packages --- .changeset/big-jobs-cough.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/big-jobs-cough.md diff --git a/.changeset/big-jobs-cough.md b/.changeset/big-jobs-cough.md deleted file mode 100644 index 10b1e4b2..00000000 --- a/.changeset/big-jobs-cough.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Fix skew x/y diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index b71386d0..14095506 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.149 + +### Patch Changes + +- 87d117be: Fix skew x/y + ## 0.0.148 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index c892881f..6dd0a621 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.148", + "version": "0.0.149", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 000e4489757966bb02570bca5f380bc2b4b170a6 Mon Sep 17 00:00:00 2001 From: John Otander Date: Thu, 7 Jul 2022 12:33:11 -0600 Subject: [PATCH 081/418] Add polyline element --- .changeset/curvy-boxes-brush.md | 5 +++++ packages/gui/src/components/html/editor.tsx | 1 + packages/gui/src/components/html/types.ts | 1 + packages/gui/src/data/attributes.ts | 1 + 4 files changed, 8 insertions(+) create mode 100644 .changeset/curvy-boxes-brush.md diff --git a/.changeset/curvy-boxes-brush.md b/.changeset/curvy-boxes-brush.md new file mode 100644 index 00000000..fe92408d --- /dev/null +++ b/.changeset/curvy-boxes-brush.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Add polyline element diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index 04c21f80..5ac2af8c 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -119,6 +119,7 @@ const HTML_TAGS = [ HTMLTag.Rect, HTMLTag.Path, HTMLTag.Text, + HTMLTag.Polyline, ] interface HtmlEditorProps { diff --git a/packages/gui/src/components/html/types.ts b/packages/gui/src/components/html/types.ts index d98511ff..2e8668b1 100644 --- a/packages/gui/src/components/html/types.ts +++ b/packages/gui/src/components/html/types.ts @@ -114,4 +114,5 @@ export const enum HTMLTag { Path = 'path', Rect = 'rect', Text = 'text', + Polyline = 'polyline', } diff --git a/packages/gui/src/data/attributes.ts b/packages/gui/src/data/attributes.ts index 3bf0baf5..ec889707 100644 --- a/packages/gui/src/data/attributes.ts +++ b/packages/gui/src/data/attributes.ts @@ -240,4 +240,5 @@ export const ATTRIBUTE_MAP: Record = { rect: [...GLOBAL_ATTRIBUTES, 'width', 'height'], line: [...GLOBAL_ATTRIBUTES, 'x1', 'y1', 'x2', 'y2'], path: [...GLOBAL_ATTRIBUTES, 'd'], + polyline: [...GLOBAL_ATTRIBUTES, 'points'], } From fc460095e59968e56c0d0b39d1a75581516d7a2a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Thu, 7 Jul 2022 18:34:04 +0000 Subject: [PATCH 082/418] Version Packages --- .changeset/curvy-boxes-brush.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/curvy-boxes-brush.md diff --git a/.changeset/curvy-boxes-brush.md b/.changeset/curvy-boxes-brush.md deleted file mode 100644 index fe92408d..00000000 --- a/.changeset/curvy-boxes-brush.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Add polyline element diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 14095506..7713753b 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.150 + +### Patch Changes + +- 000e4489: Add polyline element + ## 0.0.149 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index 6dd0a621..e782779c 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.149", + "version": "0.0.150", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 7683e6b8936baf2c3c344997d2570e8c108f3637 Mon Sep 17 00:00:00 2001 From: John Otander Date: Thu, 7 Jul 2022 12:46:15 -0600 Subject: [PATCH 083/418] Fix box side theme selection --- .changeset/brown-glasses-crash.md | 5 +++++ packages/gui/src/components/schemas/theme.tsx | 4 ++-- 2 files changed, 7 insertions(+), 2 deletions(-) create mode 100644 .changeset/brown-glasses-crash.md diff --git a/.changeset/brown-glasses-crash.md b/.changeset/brown-glasses-crash.md new file mode 100644 index 00000000..55e5c9ce --- /dev/null +++ b/.changeset/brown-glasses-crash.md @@ -0,0 +1,5 @@ +--- +'@compai/css-gui': patch +--- + +Fix theme selection for box side diff --git a/packages/gui/src/components/schemas/theme.tsx b/packages/gui/src/components/schemas/theme.tsx index 0d67bb4d..53b50650 100644 --- a/packages/gui/src/components/schemas/theme.tsx +++ b/packages/gui/src/components/schemas/theme.tsx @@ -24,11 +24,11 @@ export function theme(path: string): DataTypeSchema { return ( props.onChange({ ...props.value, - index: +value - 1, + index: +value, }) } options={range(0, numOptions).map((x) => x.toString())} From 2fc289ee1301bff7ce7c9a59593bca5cfb81250e Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Thu, 7 Jul 2022 18:47:05 +0000 Subject: [PATCH 084/418] Version Packages --- .changeset/brown-glasses-crash.md | 5 ----- packages/gui/CHANGELOG.md | 6 ++++++ packages/gui/package.json | 2 +- 3 files changed, 7 insertions(+), 6 deletions(-) delete mode 100644 .changeset/brown-glasses-crash.md diff --git a/.changeset/brown-glasses-crash.md b/.changeset/brown-glasses-crash.md deleted file mode 100644 index 55e5c9ce..00000000 --- a/.changeset/brown-glasses-crash.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@compai/css-gui': patch ---- - -Fix theme selection for box side diff --git a/packages/gui/CHANGELOG.md b/packages/gui/CHANGELOG.md index 7713753b..a20bf494 100644 --- a/packages/gui/CHANGELOG.md +++ b/packages/gui/CHANGELOG.md @@ -1,5 +1,11 @@ # @compai/css-gui +## 0.0.151 + +### Patch Changes + +- 7683e6b8: Fix theme selection for box side + ## 0.0.150 ### Patch Changes diff --git a/packages/gui/package.json b/packages/gui/package.json index e782779c..ec3d110b 100644 --- a/packages/gui/package.json +++ b/packages/gui/package.json @@ -1,6 +1,6 @@ { "name": "@compai/css-gui", - "version": "0.0.150", + "version": "0.0.151", "type": "module", "module": "./dist/index.js", "types": "./dist/index.d.ts", From 5714fa3beb210a5cee56cb1f80e052e1669a6908 Mon Sep 17 00:00:00 2001 From: mrmrs Date: Thu, 7 Jul 2022 13:03:55 -0700 Subject: [PATCH 085/418] Adds sticky header for editing html elements on long big trees --- packages/gui/src/components/html/editor.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/gui/src/components/html/editor.tsx b/packages/gui/src/components/html/editor.tsx index 5ac2af8c..cd96f778 100644 --- a/packages/gui/src/components/html/editor.tsx +++ b/packages/gui/src/components/html/editor.tsx @@ -232,7 +232,7 @@ export function HtmlEditor({ onChange }: HtmlEditorProps) {
-
+
@@ -285,7 +285,7 @@ function NodeEditor({ const { value: fullValue, selected } = useHtmlEditor() const nodeType = value.type === 'text' ? 'text' : 'tag' return ( -