| import React from 'react'; | |
| import ReactDOM from 'react-dom'; | |
| function WrapperStyle(props) { | |
| return ( | |
| <div style={{padding: "10px", border: "10px solid red"}}> | |
| {props.children} | |
| </div> | |
| ) | |
| } |
| // utilities from https://github.com/ksandin/toolbelt/blob/master/types/common.d.ts | |
| type Identity<T> = { id: T }; | |
| type SubTypeKeys<Base, Condition> = { | |
| [Key in keyof Base]: Base[Key] extends Condition ? Key : never | |
| }[keyof Base]; | |
| type SubTypeKeysRecursive<Base, Condition> = SubTypeKeys<Base, Condition> | { | |
| [Key in keyof Base]: Base[Key] extends object ? | |
| [SubTypeKeysRecursive<Base[Key], Condition>] extends [never] ? never : Key : | |
| never |
| // lets suppose | |
| type F<T> = [T] // Note: this does not support any mapped types here, more specifically we can NOT test T for any types as we have placeholders in there | |
| // instead of writing this | |
| class HasGeneric<A, B = F<A>, C = F<B>, D = F<C>> { | |
| useA: A | |
| useB: B | |
| useC: B | |
| useD: B |
| // First Some Helpers | |
| // This is used as workaround for recursive types | |
| // e.g. type F<T> = { [indirect]: T extends string ? F<T> : never }[indirect] is valid | |
| declare const indirect: unique symbol; | |
| // We use this to do some basic counting on the type level; if you need functions of arity 10+, you need to extend this | |
| type Succ = { | |
| 0: 1, |
| const append = (a) => (e) => React.createElement(React.Fragment, {}, e, a) | |
| const id = (a) => a | |
| const when = (cond, action) => cond ? action : id | |
| function compose(...args) { } | |
| function nicer(type) { | |
| return compose( | |
| when(type === "edit", append(<div></div>)), | |
| when(false, (e) => <div><span>{e}</span></div>), |
| type CSSProperty = { | |
| width: string | |
| height: string | |
| } | |
| // Placeholder | |
| type Theme = string | |
| type StylesheetGroup = { | |
| [s: string]: CSSProperty |
| let my_number_var: number; | |
| function ffi(var_from_js: unknown) { | |
| // forces you to do this | |
| if(typeof var_from_js === "number") | |
| my_number_var = var_from_js | |
| else | |
| throw new Error("invalid use of api") | |
| } |
| const oldConcat = Array.prototype.concat; | |
| Array.prototype.concat = function (...args) { | |
| return oldConcat.apply(this, args.map(x => x == null ? [] : x)) | |
| } | |
| // now this works | |
| // Note: only works when actually transpiling to [1,2,3].concat(false && [4,5,6]) | |
| // does not actually work in chrome console |
| // how keyof works | |
| type P1 = keyof ({ a: string } | { b: string }) // => "a" & "b" (aka never) | |
| type P2 = keyof ({ a: string } & { b: string }) // => "a" | "b" | |
| type P3 = ({ a: string } | { b: string }) extends infer P ? P extends object ? keyof P : never : never | |
| // => "a" | "b" | |
| // in P3, the conditional type forces branching so that expression keyof P is applied for each part of the union rather than the whole | |
| // the reason why this works as it does: | |
| // a function is given as argument { a: string } | { b: string }, then keyof cannot be statically determined |
so