UNPKG

@tldraw/tlschema

Version:

tldraw infinite canvas SDK (schema).

8 lines (7 loc) 6.8 kB
{ "version": 3, "sources": ["../../src/styles/StyleProp.ts"], "sourcesContent": ["import { T } from '@tldraw/validate'\n\n/**\n * A `StyleProp` is a property of a shape that follows some special rules.\n *\n * 1. The same value can be set on lots of shapes at the same time.\n *\n * 2. The last used value is automatically saved and applied to new shapes.\n *\n * For example, {@link DefaultColorStyle} is a style prop used by tldraw's default shapes to set\n * their color. If you try selecting several shapes on tldraw.com and changing their color, you'll\n * see that the color is applied to all of them. Then, if you draw a new shape, it'll have the same\n * color as the one you just set.\n *\n * You can use styles in your own shapes by either defining your own (see {@link StyleProp.define}\n * and {@link StyleProp.defineEnum}) or using tldraw's default ones, like {@link DefaultColorStyle}.\n * When you define a shape, pass a `props` object describing all of your shape's properties, using\n * `StyleProp`s for the ones you want to be styles. See the\n * {@link https://github.com/tldraw/tldraw/tree/main/apps/examples | custom styles example}\n * for more.\n *\n * @public\n */\nexport class StyleProp<Type> implements T.Validatable<Type> {\n\t/**\n\t * Define a new {@link StyleProp}.\n\t *\n\t * @param uniqueId - Each StyleProp must have a unique ID. We recommend you prefix this with\n\t * your app/library name.\n\t * @param options -\n\t * - `defaultValue`: The default value for this style prop.\n\t *\n\t * - `type`: Optionally, describe what type of data you expect for this style prop.\n\t *\n\t * @example\n\t * ```ts\n\t * import {T} from '@tldraw/validate'\n\t * import {StyleProp} from '@tldraw/tlschema'\n\t *\n\t * const MyLineWidthProp = StyleProp.define('myApp:lineWidth', {\n\t * defaultValue: 1,\n\t * type: T.number,\n\t * })\n\t * ```\n\t * @public\n\t */\n\tstatic define<Type>(\n\t\tuniqueId: string,\n\t\toptions: { defaultValue: Type; type?: T.Validatable<Type> }\n\t) {\n\t\tconst { defaultValue, type = T.any } = options\n\t\treturn new StyleProp<Type>(uniqueId, defaultValue, type)\n\t}\n\n\t/**\n\t * Define a new {@link StyleProp} as a list of possible values.\n\t *\n\t * @param uniqueId - Each StyleProp must have a unique ID. We recommend you prefix this with\n\t * your app/library name.\n\t * @param options -\n\t * - `defaultValue`: The default value for this style prop.\n\t *\n\t * - `values`: An array of possible values of this style prop.\n\t *\n\t * @example\n\t * ```ts\n\t * import {StyleProp} from '@tldraw/tlschema'\n\t *\n\t * const MySizeProp = StyleProp.defineEnum('myApp:size', {\n\t * defaultValue: 'medium',\n\t * values: ['small', 'medium', 'large'],\n\t * })\n\t * ```\n\t */\n\tstatic defineEnum<const Values extends readonly unknown[]>(\n\t\tuniqueId: string,\n\t\toptions: { defaultValue: Values[number]; values: Values }\n\t) {\n\t\tconst { defaultValue, values } = options\n\t\treturn new EnumStyleProp<Values[number]>(uniqueId, defaultValue, values)\n\t}\n\n\t/** @internal */\n\tprotected constructor(\n\t\treadonly id: string,\n\t\tpublic defaultValue: Type,\n\t\treadonly type: T.Validatable<Type>\n\t) {}\n\n\tsetDefaultValue(value: Type) {\n\t\tthis.defaultValue = value\n\t}\n\n\tvalidate(value: unknown) {\n\t\treturn this.type.validate(value)\n\t}\n\n\tvalidateUsingKnownGoodVersion(prevValue: Type, newValue: unknown) {\n\t\tif (this.type.validateUsingKnownGoodVersion) {\n\t\t\treturn this.type.validateUsingKnownGoodVersion(prevValue, newValue)\n\t\t} else {\n\t\t\treturn this.validate(newValue)\n\t\t}\n\t}\n}\n\n/**\n * See {@link StyleProp} & {@link StyleProp.defineEnum}\n *\n * @public\n */\nexport class EnumStyleProp<T> extends StyleProp<T> {\n\t/** @internal */\n\tconstructor(id: string, defaultValue: T, values: readonly T[]) {\n\t\tsuper(id, defaultValue, T.literalEnum(...values))\n\t\tthis.values = [...values]\n\t}\n\n\treadonly values: T[]\n\n\t/**\n\t * Add new values to this enum style prop at runtime. This is useful for extending\n\t * the built-in styles with custom values (e.g. adding custom colors). Be sure to\n\t * also modify the associated types.\n\t *\n\t * @param newValues - The new values to add.\n\t *\n\t * @public\n\t */\n\taddValues(...newValues: T[]): void {\n\t\tfor (const v of newValues) {\n\t\t\tif (!this.values.includes(v)) {\n\t\t\t\tthis.values.push(v)\n\t\t\t}\n\t\t}\n\t\t// Rebuild the validator with the updated values\n\t\t;(this as any).type = T.literalEnum(...this.values)\n\t}\n\n\t/**\n\t * Remove values from this enum style prop at runtime. This is useful for narrowing\n\t * the built-in styles with custom values (e.g. adding custom colors). Be sure to\n\t * also modify the associated types.\n\t *\n\t * @param valuesToRemove - The values to remove.\n\t *\n\t * @public\n\t */\n\tremoveValues(...valuesToRemove: T[]): void {\n\t\tfor (const v of valuesToRemove) {\n\t\t\tif (this.values.includes(v)) {\n\t\t\t\tthis.values.splice(this.values.indexOf(v), 1)\n\t\t\t}\n\t\t}\n\t\t// Rebuild the validator with the updated values\n\t\t;(this as any).type = T.literalEnum(...this.values)\n\t}\n}\n\n/**\n * @public\n */\nexport type StylePropValue<T extends StyleProp<any>> = T extends StyleProp<infer U> ? U : never\n"], "mappings": "AAAA,SAAS,SAAS;AAuBX,MAAM,UAA+C;AAAA;AAAA,EA4DjD,YACA,IACF,cACE,MACR;AAHQ;AACF;AACE;AAAA,EACP;AAAA,EAHO;AAAA,EACF;AAAA,EACE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAxCV,OAAO,OACN,UACA,SACC;AACD,UAAM,EAAE,cAAc,OAAO,EAAE,IAAI,IAAI;AACvC,WAAO,IAAI,UAAgB,UAAU,cAAc,IAAI;AAAA,EACxD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAsBA,OAAO,WACN,UACA,SACC;AACD,UAAM,EAAE,cAAc,OAAO,IAAI;AACjC,WAAO,IAAI,cAA8B,UAAU,cAAc,MAAM;AAAA,EACxE;AAAA,EASA,gBAAgB,OAAa;AAC5B,SAAK,eAAe;AAAA,EACrB;AAAA,EAEA,SAAS,OAAgB;AACxB,WAAO,KAAK,KAAK,SAAS,KAAK;AAAA,EAChC;AAAA,EAEA,8BAA8B,WAAiB,UAAmB;AACjE,QAAI,KAAK,KAAK,+BAA+B;AAC5C,aAAO,KAAK,KAAK,8BAA8B,WAAW,QAAQ;AAAA,IACnE,OAAO;AACN,aAAO,KAAK,SAAS,QAAQ;AAAA,IAC9B;AAAA,EACD;AACD;AAOO,MAAM,sBAAyB,UAAa;AAAA;AAAA,EAElD,YAAY,IAAY,cAAiB,QAAsB;AAC9D,UAAM,IAAI,cAAc,EAAE,YAAY,GAAG,MAAM,CAAC;AAChD,SAAK,SAAS,CAAC,GAAG,MAAM;AAAA,EACzB;AAAA,EAES;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWT,aAAa,WAAsB;AAClC,eAAW,KAAK,WAAW;AAC1B,UAAI,CAAC,KAAK,OAAO,SAAS,CAAC,GAAG;AAC7B,aAAK,OAAO,KAAK,CAAC;AAAA,MACnB;AAAA,IACD;AAEA;AAAC,IAAC,KAAa,OAAO,EAAE,YAAY,GAAG,KAAK,MAAM;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,gBAAgB,gBAA2B;AAC1C,eAAW,KAAK,gBAAgB;AAC/B,UAAI,KAAK,OAAO,SAAS,CAAC,GAAG;AAC5B,aAAK,OAAO,OAAO,KAAK,OAAO,QAAQ,CAAC,GAAG,CAAC;AAAA,MAC7C;AAAA,IACD;AAEA;AAAC,IAAC,KAAa,OAAO,EAAE,YAAY,GAAG,KAAK,MAAM;AAAA,EACnD;AACD;", "names": [] }