@makeswift/runtime 0.0.0-a500663 → 0.0.0-d8554fe

package/src/state/modules/react-components.tsx

@@ -1,47 +0,0 @@
-import type {
-  ClassAttributes,
-  ComponentClass,
-  PropsWithoutRef,
-  RefAttributes,
-  VoidFunctionComponent,
-} from 'react'
-
-import { Action, ActionTypes } from '../actions'
-
-export type ComponentType<P = Record<string, any>, T = any> =
-  | ComponentClass<PropsWithoutRef<P> & ClassAttributes<T>>
-  | VoidFunctionComponent<PropsWithoutRef<P> & RefAttributes<T>>
-
-export type State = Map<string, ComponentType>
-
-export function getInitialState({
-  reactComponents = new Map(),
-}: { reactComponents?: Map<string, ComponentType> } = {}): State {
-  return reactComponents
-}
-
-function getReactComponents(state: State): Map<string, ComponentType> {
-  return state
-}
-
-export function getReactComponent(state: State, type: string): ComponentType | null {
-  return getReactComponents(state).get(type) ?? null
-}
-
-export function reducer(state: State = getInitialState(), action: Action) {
-  switch (action.type) {
-    case ActionTypes.REGISTER_REACT_COMPONENT:
-      return new Map(state).set(action.payload.type, action.payload.component)
-
-    case ActionTypes.UNREGISTER_REACT_COMPONENT: {
-      const nextState = new Map(state)
-
-      const deleted = nextState.delete(action.payload.type)
-
-      return deleted ? nextState : state
-    }
-
-    default:
-      return state
-  }
-}

package/src/state/modules/read-only-documents.ts

@@ -1,51 +0,0 @@
-import type { Action } from '../actions'
-
-export type Data = undefined | null | boolean | number | string | Data[] | { [key: string]: Data }
-
-export type ElementData = { type: string; key: string; props: Record<string, Data> }
-
-export type ElementReference = { type: 'reference'; key: string; value: string }
-
-export type Element = ElementData | ElementReference
-
-export function isElementReference(element: Element): element is ElementReference {
-  return !('props' in element)
-}
-
-export type Document = {
-  rootElement: Element
-}
-
-export function createDocument(rootElement: Element): Document {
-  return { rootElement }
-}
-
-export type State = Map<string, Document>
-
-export function getInitialState({
-  rootElements = new Map(),
-}: { rootElements?: Map<string, Element> } = {}): State {
-  const initialState = new Map()
-
-  rootElements.forEach((rootElement, elementKey) => {
-    initialState.set(elementKey, createDocument(rootElement))
-  })
-
-  return initialState
-}
-
-function getDocuments(state: State): Map<string, Document> {
-  return state
-}
-
-export function getDocument(state: State, documentKey: string): Document | null {
-  return getDocuments(state).get(documentKey) ?? null
-}
-
-export function getDocumentRootElement(state: State, documentKey: string): Element | null {
-  return getDocument(state, documentKey)?.rootElement ?? null
-}
-
-export function reducer(state: State = getInitialState(), _action: Action): State {
-  return state
-}

package/src/state/modules/read-write-documents.ts

@@ -1,75 +0,0 @@
-import { Operation } from 'ot-json0'
-import { removeIn, setIn } from 'immutable'
-
-import * as ReadOnlyDocuments from './read-only-documents'
-import { Action, ActionTypes } from '../actions'
-
-export type { Document, Element, ElementData, ElementReference } from './read-only-documents'
-export { isElementReference } from './read-only-documents'
-export type { Operation }
-
-function apply(data: ReadOnlyDocuments.Element, operation: Operation): ReadOnlyDocuments.Element {
-  let applied = data
-
-  operation.forEach(component => {
-    // @ts-expect-error: `ld` isn't in all possible values of `component`
-    if (component.ld != null) applied = removeIn(applied, component.p)
-
-    // @ts-expect-error: `od` isn't in all possible values of `component`
-    if (component.od != null) applied = removeIn(applied, component.p)
-
-    // @ts-expect-error: `li` isn't in all possible values of `component`
-    if (component.li != null) applied = setIn(applied, component.p, component.li)
-
-    // @ts-expect-error: `oi` isn't in all possible values of `component`
-    if (component.oi != null) applied = setIn(applied, component.p, component.oi)
-  })
-
-  return applied
-}
-
-export type State = ReadOnlyDocuments.State
-
-export function getInitialState({
-  rootElements,
-}: {
-  rootElements?: Map<string, ReadOnlyDocuments.Element>
-} = {}): State {
-  return ReadOnlyDocuments.getInitialState({ rootElements })
-}
-
-function getReadOnlyDocumentsStateSlice(state: State): ReadOnlyDocuments.State {
-  return state
-}
-
-export function getDocumentRootElement(
-  state: State,
-  documentKey: string,
-): ReadOnlyDocuments.Element | null {
-  return ReadOnlyDocuments.getDocumentRootElement(
-    getReadOnlyDocumentsStateSlice(state),
-    documentKey,
-  )
-}
-
-export function reducer(state: State = getInitialState(), action: Action): State {
-  switch (action.type) {
-    case ActionTypes.CHANGE_DOCUMENT: {
-      const currentRootElement = getDocumentRootElement(state, action.payload.documentKey)
-
-      if (currentRootElement == null) return state
-
-      const nextRootElement = apply(currentRootElement, action.payload.operation)
-
-      return currentRootElement === nextRootElement
-        ? state
-        : new Map(state).set(
-            action.payload.documentKey,
-            ReadOnlyDocuments.createDocument(nextRootElement),
-          )
-    }
-
-    default:
-      return state
-  }
-}

package/src/state/react-builder-preview.ts

@@ -1,271 +0,0 @@
-import {
-  applyMiddleware,
-  combineReducers,
-  createStore,
-  Dispatch as ReduxDispatch,
-  Middleware,
-  MiddlewareAPI,
-  PreloadedState,
-  Store as ReduxStore,
-} from 'redux'
-import thunk, { ThunkAction, ThunkDispatch } from 'redux-thunk'
-import deepEqual from '../utils/deepEqual'
-
-import * as Documents from './modules/read-write-documents'
-import * as ReactComponents from './modules/react-components'
-import * as BoxModels from './modules/box-models'
-import * as ComponentsMeta from './modules/components-meta'
-import * as PropControllers from './modules/prop-controllers'
-import {
-  Action,
-  changeDocumentElementSize,
-  registerComponent,
-  registerMeasurable,
-  unregisterMeasurable,
-} from './actions'
-import { ActionTypes } from './actions'
-
-export type { Operation } from './modules/read-write-documents'
-export type { BoxModelHandle } from './modules/box-models'
-export { createBox, getBox, parse } from './modules/box-models'
-
-const reducer = combineReducers({
-  documents: Documents.reducer,
-  reactComponents: ReactComponents.reducer,
-  boxModels: BoxModels.reducer,
-  componentsMeta: ComponentsMeta.reducer,
-  propControllers: PropControllers.reducer,
-})
-
-export type State = ReturnType<typeof reducer>
-
-function getBoxModelsStateSlice(state: State): BoxModels.State {
-  return state.boxModels
-}
-
-function getMeasurables(state: State): Map<string, BoxModels.Measurable> {
-  return BoxModels.getMeasurables(getBoxModelsStateSlice(state))
-}
-
-function getBoxModels(state: State): Map<string, BoxModels.BoxModel> {
-  return BoxModels.getBoxModels(getBoxModelsStateSlice(state))
-}
-
-function getBoxModel(state: State, elementKey: string): BoxModels.BoxModel | null {
-  return BoxModels.getBoxModel(getBoxModelsStateSlice(state), elementKey)
-}
-
-function getComponentsMetaStateSlice(state: State): ComponentsMeta.State {
-  return state.componentsMeta
-}
-
-function getComponentsMeta(state: State): Map<string, ComponentsMeta.ComponentMeta> {
-  return ComponentsMeta.getComponentsMeta(getComponentsMetaStateSlice(state))
-}
-
-function getPropControllersStateSlice(state: State): PropControllers.State {
-  return state.propControllers
-}
-
-function getComponentPropControllerDescriptors(
-  state: State,
-  componentType: string,
-): Record<string, PropControllers.PropControllerDescriptor> | null {
-  return PropControllers.getComponentPropControllerDescriptors(
-    getPropControllersStateSlice(state),
-    componentType,
-  )
-}
-
-function measureElements(): ThunkAction<void, State, unknown, Action> {
-  return (dispatch, getState) => {
-    const measurables = getMeasurables(getState())
-    const currentBoxModels = getBoxModels(getState())
-    const measuredBoxModels = new Map(
-      Array.from(measurables.entries())
-        .map(([elementKey, measurable]) => {
-          const boxModel = BoxModels.measure(measurable)
-
-          return boxModel ? ([elementKey, boxModel] as const) : null
-        })
-        .filter((entry): entry is NonNullable<typeof entry> => entry != null),
-    )
-    const changedBoxModels = new Map<string, BoxModels.BoxModel | null>()
-
-    currentBoxModels.forEach((_boxModel, elementKey) => {
-      if (!measuredBoxModels.has(elementKey)) changedBoxModels.set(elementKey, null)
-    })
-
-    measuredBoxModels.forEach((measuredBoxModel, elementKey) => {
-      const currentBoxModel = getBoxModel(getState(), elementKey)
-
-      if (currentBoxModel == null || !deepEqual(currentBoxModel, measuredBoxModel)) {
-        changedBoxModels.set(elementKey, measuredBoxModel)
-      }
-    })
-
-    if (changedBoxModels.size > 0) {
-      dispatch({
-        type: ActionTypes.CHANGE_ELEMENT_BOX_MODELS,
-        payload: { changedElementBoxModels: changedBoxModels },
-      })
-    }
-  }
-}
-
-export function startMeasuringElements(): ThunkAction<() => void, State, unknown, Action> {
-  return dispatch => {
-    let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest)
-
-    return () => {
-      cancelAnimationFrame(animationFrameHandle)
-    }
-
-    function handleAnimationFrameRequest() {
-      dispatch(measureElements())
-
-      animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest)
-    }
-  }
-}
-
-export type Size = {
-  offsetWidth: number
-  offsetHeight: number
-  clientWidth: number
-  clientHeight: number
-  scrollWidth: number
-  scrollHeight: number
-  scrollTop: number
-  scrollLeft: number
-}
-
-function getElementSize(element: HTMLElement): Size {
-  return {
-    offsetWidth: element.offsetWidth,
-    offsetHeight: element.offsetHeight,
-    clientWidth: element.clientWidth,
-    clientHeight: element.clientHeight,
-    scrollWidth: element.scrollWidth,
-    scrollHeight: element.scrollHeight,
-    scrollTop: element.scrollTop,
-    scrollLeft: element.scrollLeft,
-  }
-}
-
-function startMeasuringDocumentElement(): ThunkAction<() => void, unknown, unknown, Action> {
-  return dispatch => {
-    let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest)
-    let lastSize: Size
-
-    return () => {
-      cancelAnimationFrame(animationFrameHandle)
-    }
-
-    function handleAnimationFrameRequest() {
-      const nextSize = getElementSize(window.document.documentElement)
-
-      if (!deepEqual(lastSize, nextSize)) {
-        lastSize = nextSize
-
-        dispatch(changeDocumentElementSize(nextSize))
-      }
-
-      animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest)
-    }
-  }
-}
-
-export function initialize(): ThunkAction<() => void, State, unknown, Action> {
-  return dispatch => {
-    const stopMeasuringElements = dispatch(startMeasuringElements())
-    const stopMeasuringDocumentElement = dispatch(startMeasuringDocumentElement())
-
-    return () => {
-      stopMeasuringElements()
-      stopMeasuringDocumentElement()
-    }
-  }
-}
-
-export type Dispatch = ThunkDispatch<State, unknown, Action>
-
-function measureBoxModelsMiddleware(): Middleware<Dispatch, State, Dispatch> {
-  return ({ dispatch }: MiddlewareAPI<Dispatch>) => (next: ReduxDispatch<Action>) => {
-    return (action: Action): Action => {
-      switch (action.type) {
-        case ActionTypes.CHANGE_COMPONENT_HANDLE: {
-          if (BoxModels.isMeasurable(action.payload.componentHandle)) {
-            dispatch(registerMeasurable(action.payload.elementKey, action.payload.componentHandle))
-          } else {
-            dispatch(unregisterMeasurable(action.payload.elementKey))
-          }
-
-          break
-        }
-
-        case ActionTypes.UNMOUNT_COMPONENT:
-          dispatch(unregisterMeasurable(action.payload.elementKey))
-          break
-      }
-
-      return next(action)
-    }
-  }
-}
-
-export function messageChannelMiddleware(): Middleware<Dispatch, State, Dispatch> {
-  return ({ dispatch, getState }: MiddlewareAPI<Dispatch, State>) => (
-    next: ReduxDispatch<Action>,
-  ) => {
-    const messageChannel = new MessageChannel()
-
-    window.parent.postMessage(messageChannel.port2, '*', [messageChannel.port2])
-
-    messageChannel.port1.onmessage = (event: MessageEvent<Action>) => dispatch(event.data)
-
-    const state = getState()
-    const registeredComponentsMeta = getComponentsMeta(state)
-
-    registeredComponentsMeta.forEach((componentMeta, componentType) => {
-      const propControllerDescriptors = getComponentPropControllerDescriptors(state, componentType)
-
-      if (propControllerDescriptors != null) {
-        messageChannel.port1.postMessage(
-          registerComponent(componentType, componentMeta, propControllerDescriptors),
-        )
-      }
-    })
-
-    return (action: Action): Action => {
-      switch (action.type) {
-        case ActionTypes.CHANGE_ELEMENT_BOX_MODELS:
-        case ActionTypes.MOUNT_COMPONENT:
-        case ActionTypes.UNMOUNT_COMPONENT:
-        case ActionTypes.REGISTER_COMPONENT:
-        case ActionTypes.UNREGISTER_COMPONENT:
-        case ActionTypes.CHANGE_DOCUMENT_ELEMENT_SIZE:
-          messageChannel.port1.postMessage(action)
-          break
-
-        case ActionTypes.CHANGE_DOCUMENT_ELEMENT_SCROLL_TOP:
-          window.document.documentElement.scrollTop = action.payload.scrollTop
-          break
-      }
-
-      return next(action)
-    }
-  }
-}
-
-export type Store = ReduxStore<State, Action> & { dispatch: Dispatch }
-
-export function configureStore({
-  preloadedState,
-}: { preloadedState?: PreloadedState<State> } = {}): Store {
-  return createStore(
-    reducer,
-    preloadedState,
-    applyMiddleware(thunk, measureBoxModelsMiddleware(), messageChannelMiddleware()),
-  )
-}

package/src/state/react-page.ts

@@ -1,73 +0,0 @@
-import {
-  applyMiddleware,
-  combineReducers,
-  createStore,
-  PreloadedState,
-  Store as ReduxStore,
-} from 'redux'
-import thunk, { ThunkDispatch } from 'redux-thunk'
-
-import * as Documents from './modules/read-only-documents'
-import * as ReactComponents from './modules/react-components'
-import * as ComponentsMeta from './modules/components-meta'
-import * as PropControllers from './modules/prop-controllers'
-import { Action } from './actions'
-
-export type {
-  Data,
-  Document,
-  Element,
-  ElementData,
-  ElementReference,
-} from './modules/read-only-documents'
-export { isElementReference } from './modules/read-only-documents'
-export type { ComponentType } from './modules/react-components'
-
-const reducer = combineReducers({
-  documents: Documents.reducer,
-  reactComponents: ReactComponents.reducer,
-  componentsMeta: ComponentsMeta.reducer,
-  propControllers: PropControllers.reducer,
-})
-
-export type State = ReturnType<typeof reducer>
-
-function getDocumentsStateSlice(state: State): Documents.State {
-  return state.documents
-}
-
-export function getDocumentRootElement(
-  state: State,
-  documentKey: string,
-): Documents.Element | null {
-  return Documents.getDocumentRootElement(getDocumentsStateSlice(state), documentKey)
-}
-
-function getReactComponentsStateSlice(state: State): ReactComponents.State {
-  return state.reactComponents
-}
-
-export function getReactComponent(
-  state: State,
-  type: string,
-): ReactComponents.ComponentType | null {
-  return ReactComponents.getReactComponent(getReactComponentsStateSlice(state), type)
-}
-
-export type Dispatch = ThunkDispatch<State, unknown, Action>
-
-export type Store = ReduxStore<State, Action> & { dispatch: Dispatch }
-
-export function configureStore({
-  rootElements,
-  preloadedState,
-}: {
-  rootElements?: Map<string, Documents.Element>
-  preloadedState?: PreloadedState<State>
-} = {}): Store {
-  return createStore(
-    reducer,
-    { ...preloadedState, documents: Documents.getInitialState({ rootElements }) },
-    applyMiddleware(thunk),
-  )
-}

package/src/style.css

@@ -1,8 +0,0 @@
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
-}

package/src/utils/deepEqual.ts

@@ -1,33 +0,0 @@
-import shallowEqual from "./shallowEqual";
-
-const { hasOwnProperty } = Object.prototype;
-
-const deepEqual = (a: unknown, b: unknown): boolean => {
-  if (shallowEqual(a, b)) return true;
-
-  if (
-    typeof a !== "object" ||
-    a === null ||
-    typeof b !== "object" ||
-    b === null
-  )
-    return false;
-
-  const keysA = Object.keys(a);
-  const keysB = Object.keys(b);
-
-  if (keysA.length !== keysB.length) return false;
-
-  for (let i = 0; i < keysA.length; i += 1) {
-    if (
-      !hasOwnProperty.call(b, keysA[i]) ||
-      // @ts-expect-error: {}[string] is OK.
-      !deepEqual(a[keysA[i]], b[keysA[i]])
-    )
-      return false;
-  }
-
-  return true;
-};
-
-export default deepEqual;

package/src/utils/is.ts

@@ -1,5 +0,0 @@
-export default function is(x: unknown, y: unknown): boolean {
-  if (x === y) return x !== 0 || y !== 0 || 1 / x === 1 / y;
-
-  return x !== x && y !== y;
-}

package/src/utils/shallowEqual.ts

@@ -1,30 +0,0 @@
-import is from "./is";
-
-const { hasOwnProperty } = Object.prototype;
-
-const shallowEqual = (a: unknown, b: unknown): boolean => {
-  if (is(a, b)) return true;
-
-  if (
-    typeof a !== "object" ||
-    a === null ||
-    typeof b !== "object" ||
-    b === null
-  )
-    return false;
-
-  const keysA = Object.keys(a);
-  const keysB = Object.keys(b);
-
-  if (keysA.length !== keysB.length) return false;
-
-  for (let i = 0; i < keysA.length; i += 1) {
-    // @ts-expect-error: {}[string] is OK.
-    if (!hasOwnProperty.call(b, keysA[i]) || !is(a[keysA[i]], b[keysA[i]]))
-      return false;
-  }
-
-  return true;
-};
-
-export default shallowEqual;

package/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

package/tsconfig.json

@@ -1,23 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ESNext",
-    "useDefineForClassFields": true,
-    "module": "ESNext",
-    "lib": ["ESNext", "DOM"],
-    "moduleResolution": "Node",
-    "strict": true,
-    "sourceMap": true,
-    "resolveJsonModule": true,
-    "esModuleInterop": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "skipLibCheck": true,
-    "declaration": true,
-    "declarationMap": true,
-    "declarationDir": "dist/types",
-    "emitDeclarationOnly": true,
-    "jsx": "react-jsx"
-  },
-  "include": ["./src", "./types"]
-}

package/types/ot-json0.d.ts

@@ -1,35 +0,0 @@
-declare module 'ot-json0' {
-  type JSONData = null | boolean | number | string | Array<JSONData> | { [ey: string]: JSONData }
-
-  type ReadOnlyJSONData =
-    | null
-    | boolean
-    | number
-    | string
-    | ReadonlyArray<ReadOnlyJSONData>
-    | { readonly [key: string]: ReadOnlyJSONData }
-
-  export type Snapshot = JSONData
-
-  export type ReadOnlySnapshot = ReadOnlyJSONData
-
-  type Path = Array<string | number>
-
-  type OperationComponent =
-    | { p: Path; li: ReadOnlySnapshot }
-    | { p: Path; ld: ReadOnlySnapshot }
-    | { p: Path; ld: ReadOnlySnapshot; li: ReadOnlySnapshot }
-    | { p: Path; oi: ReadOnlySnapshot }
-    | { p: Path; od: ReadOnlySnapshot }
-    | { p: Path; od: ReadOnlySnapshot; oi: ReadOnlySnapshot }
-
-  export type Operation = ReadonlyArray<OperationComponent>
-
-  type Type = {
-    apply(snapshot: Snapshot, op: Operation): Snapshot
-    invert(op: Operation): Operation
-    compose(op1: Operation, op2: Operation): Operation
-  }
-
-  export const type: Type
-}

package/vite.config.ts

@@ -1,28 +0,0 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import * as path from 'path'
-
-export default defineConfig({
-  plugins: [react()],
-  build: {
-    emptyOutDir: false,
-    sourcemap: true,
-    minify: false,
-    // @ts-expect-error: we provide `build.rollupOptions.input` so `build.lib.entry` isn't required.
-    lib: { formats: ['es', 'cjs'] },
-    rollupOptions: {
-      input: {
-        main: path.resolve(__dirname, 'src'),
-        ['prop-controllers']: path.resolve(__dirname, 'src', 'prop-controllers'),
-        react: path.resolve(__dirname, 'src', 'react'),
-        ['box-model']: path.resolve(__dirname, 'src', 'box-model'),
-        components: path.resolve(__dirname, 'src', 'components'),
-      },
-      output: {
-        entryFileNames: '[name].[format].js',
-        chunkFileNames: '[name].[format].js',
-      },
-      external: ['react', 'styled-components'],
-    },
-  },
-})