quickwin 1.0.1 → 1.1.0

package/lib/react-qw/layout.ts

@@ -1,111 +1,111 @@
-export type JustifyContent = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly'
-
-export interface FlexStyle {
-  flexDirection?: 'row' | 'column'
-  justifyContent?: JustifyContent
-  alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch'
-  gap?: number
-  padding?: number
-  paddingTop?: number
-  paddingRight?: number
-  paddingBottom?: number
-  paddingLeft?: number
-}
-
-interface ChildStyle {
-  width?: number | 'auto'; height?: number | 'auto'
-  flexGrow?: number
-  alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'stretch'
-}
-
-interface ChildInfo {
-  style: ChildStyle
-}
-
-export interface LayoutResult {
-  x: number; y: number; width: number; height: number
-}
-
-const DEFAULT_W = 100
-const DEFAULT_H = 30
-
-export function calculateFlexLayout(
-  flex: FlexStyle,
-  parentW: number,
-  parentH: number,
-  children: ChildInfo[]
-): LayoutResult[] {
-  const dir = flex.flexDirection || 'column'
-  const gap = flex.gap ?? 0
-  const justify = flex.justifyContent || 'flex-start'
-  const align = flex.alignItems || 'stretch'
-  const isRow = dir === 'row'
-  const n = children.length
-
-  const mainSize: 'w' | 'h' = isRow ? 'w' : 'h'
-  const crossSize: 'w' | 'h' = isRow ? 'h' : 'w'
-  const mainPos: 'x' | 'y' = isRow ? 'x' : 'y'
-  const crossPos: 'x' | 'y' = isRow ? 'y' : 'x'
-  const mainDim: 'width' | 'height' = isRow ? 'width' : 'height'
-  const crossDim: 'width' | 'height' = isRow ? 'height' : 'width'
-  const pt = flex.paddingTop ?? flex.padding ?? 0
-  const pr = flex.paddingRight ?? flex.padding ?? 0
-  const pb = flex.paddingBottom ?? flex.padding ?? 0
-  const pl = flex.paddingLeft ?? flex.padding ?? 0
-  const mainPadding = isRow ? pl + pr : pt + pb
-  const crossPadding = isRow ? pt + pb : pl + pr
-  const parentMain = (isRow ? parentW : parentH) - mainPadding
-  const parentCross = (isRow ? parentH : parentW) - crossPadding
-
-  const sizes = children.map(c => ({
-    w: typeof c.style.width === 'number' ? c.style.width : DEFAULT_W,
-    h: typeof c.style.height === 'number' ? c.style.height : DEFAULT_H,
-  }))
-
-  const flexGrows = children.map(c => c.style.flexGrow ?? 0)
-  const totalGrow = flexGrows.reduce((s, g) => s + g, 0)
-
-  const baseMain = sizes.reduce((s, c) => s + c[mainSize], 0)
-  let freeGrow = parentMain - baseMain - Math.max(0, n - 1) * gap
-  if (totalGrow > 0 && freeGrow > 0) {
-    for (let i = 0; i < n; i++) {
-      sizes[i]![mainSize] += freeGrow * flexGrows[i]! / totalGrow
-    }
-  }
-
-  const totalMain = sizes.reduce((s, c) => s + c[mainSize], 0)
-  const free = parentMain - totalMain - Math.max(0, n - 1) * gap
-  let offset = 0, extraGap = 0
-  if (justify === 'flex-end') offset = free
-  else if (justify === 'center') offset = Math.max(0, free / 2)
-  else if (justify === 'space-between' && n > 1) extraGap = free / (n - 1)
-  else if (justify === 'space-around') { extraGap = free / n; offset = extraGap / 2 }
-  else if (justify === 'space-evenly') { extraGap = free / (n + 1); offset = extraGap }
-
-  let cursor = offset
-  return sizes.map((sz, i) => {
-    const childCrossBase = sz[crossSize]
-    const childAlign = children[i]!.style.alignSelf ?? 'auto'
-    const effectiveAlign = childAlign === 'auto' ? align : childAlign
-    let childMain = sz[mainSize]
-    let childCross = childCrossBase
-    const res: LayoutResult = { x: 0, y: 0, width: 0, height: 0 }
-    res[mainPos] = cursor
-    res[crossPos] = 0
-    res[mainDim] = childMain
-    res[crossDim] = childCross
-    if (effectiveAlign === 'stretch') {
-      const hasExplicitCross = typeof children[i]!.style[crossDim] === 'number'
-      if (!hasExplicitCross) {
-        res[crossDim] = parentCross
-        res[crossPos] = 0
-      }
-    } else if (effectiveAlign === 'flex-end') {
-      res[crossPos] = parentCross - childCross
-    } else if (effectiveAlign === 'center') {
-      res[crossPos] = Math.max(0, (parentCross - childCross) / 2)
-    }
-    cursor += childMain + gap + extraGap
-    return res
-  })
-}
+export type JustifyContent = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly'
+
+export interface FlexStyle {
+  flexDirection?: 'row' | 'column'
+  justifyContent?: JustifyContent
+  alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch'
+  gap?: number
+  padding?: number
+  paddingTop?: number
+  paddingRight?: number
+  paddingBottom?: number
+  paddingLeft?: number
+}
+
+interface ChildStyle {
+  width?: number | 'auto'; height?: number | 'auto'
+  flexGrow?: number
+  alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'stretch'
+}
+
+interface ChildInfo {
+  style: ChildStyle
+}
+
+export interface LayoutResult {
+  x: number; y: number; width: number; height: number
+}
+
+const DEFAULT_W = 100
+const DEFAULT_H = 30
+
+export function calculateFlexLayout(
+  flex: FlexStyle,
+  parentW: number,
+  parentH: number,
+  children: ChildInfo[]
+): LayoutResult[] {
+  const dir = flex.flexDirection || 'column'
+  const gap = flex.gap ?? 0
+  const justify = flex.justifyContent || 'flex-start'
+  const align = flex.alignItems || 'stretch'
+  const isRow = dir === 'row'
+  const n = children.length
+
+  const mainSize: 'w' | 'h' = isRow ? 'w' : 'h'
+  const crossSize: 'w' | 'h' = isRow ? 'h' : 'w'
+  const mainPos: 'x' | 'y' = isRow ? 'x' : 'y'
+  const crossPos: 'x' | 'y' = isRow ? 'y' : 'x'
+  const mainDim: 'width' | 'height' = isRow ? 'width' : 'height'
+  const crossDim: 'width' | 'height' = isRow ? 'height' : 'width'
+  const pt = flex.paddingTop ?? flex.padding ?? 0
+  const pr = flex.paddingRight ?? flex.padding ?? 0
+  const pb = flex.paddingBottom ?? flex.padding ?? 0
+  const pl = flex.paddingLeft ?? flex.padding ?? 0
+  const mainPadding = isRow ? pl + pr : pt + pb
+  const crossPadding = isRow ? pt + pb : pl + pr
+  const parentMain = (isRow ? parentW : parentH) - mainPadding
+  const parentCross = (isRow ? parentH : parentW) - crossPadding
+
+  const sizes = children.map(c => ({
+    w: typeof c.style.width === 'number' ? c.style.width : DEFAULT_W,
+    h: typeof c.style.height === 'number' ? c.style.height : DEFAULT_H,
+  }))
+
+  const flexGrows = children.map(c => c.style.flexGrow ?? 0)
+  const totalGrow = flexGrows.reduce((s, g) => s + g, 0)
+
+  const baseMain = sizes.reduce((s, c) => s + c[mainSize], 0)
+  let freeGrow = parentMain - baseMain - Math.max(0, n - 1) * gap
+  if (totalGrow > 0 && freeGrow > 0) {
+    for (let i = 0; i < n; i++) {
+      sizes[i]![mainSize] += freeGrow * flexGrows[i]! / totalGrow
+    }
+  }
+
+  const totalMain = sizes.reduce((s, c) => s + c[mainSize], 0)
+  const free = parentMain - totalMain - Math.max(0, n - 1) * gap
+  let offset = 0, extraGap = 0
+  if (justify === 'flex-end') offset = free
+  else if (justify === 'center') offset = Math.max(0, free / 2)
+  else if (justify === 'space-between' && n > 1) extraGap = free / (n - 1)
+  else if (justify === 'space-around') { extraGap = free / n; offset = extraGap / 2 }
+  else if (justify === 'space-evenly') { extraGap = free / (n + 1); offset = extraGap }
+
+  let cursor = offset
+  return sizes.map((sz, i) => {
+    const childCrossBase = sz[crossSize]
+    const childAlign = children[i]!.style.alignSelf ?? 'auto'
+    const effectiveAlign = childAlign === 'auto' ? align : childAlign
+    let childMain = sz[mainSize]
+    let childCross = childCrossBase
+    const res: LayoutResult = { x: 0, y: 0, width: 0, height: 0 }
+    res[mainPos] = cursor
+    res[crossPos] = 0
+    res[mainDim] = childMain
+    res[crossDim] = childCross
+    if (effectiveAlign === 'stretch') {
+      const hasExplicitCross = typeof children[i]!.style[crossDim] === 'number'
+      if (!hasExplicitCross) {
+        res[crossDim] = parentCross
+        res[crossPos] = 0
+      }
+    } else if (effectiveAlign === 'flex-end') {
+      res[crossPos] = parentCross - childCross
+    } else if (effectiveAlign === 'center') {
+      res[crossPos] = Math.max(0, (parentCross - childCross) / 2)
+    }
+    cursor += childMain + gap + extraGap
+    return res
+  })
+}

package/lib/react-qw/props.ts

@@ -1,36 +1,36 @@
-import * as gui from 'gui'
-import type { Instance, Props } from './reconciler.js'
-
-export function applyProps(
-  instance: Instance,
-  newProps: Props,
-  _oldProps: Props,
-) {
-  const hwnd = instance.hwnd!
-  instance.props = newProps
-
-  const textVal = 'text' in newProps ? newProps.text : (
-    typeof newProps.children === 'string' ? newProps.children :
-    typeof newProps.children === 'number' ? String(newProps.children) : undefined
-  )
-  if (textVal !== undefined) {
-    let cursor = -1
-    if (instance.type === 'EDIT') {
-      const sel = gui.SendMessage(hwnd, gui.EditMsg.GETSEL, 0, 0)
-      cursor = sel >>> 16
-    }
-    gui.SetWindowText(hwnd, textVal)
-    if (instance.type === 'EDIT' && cursor >= 0) {
-      gui.SendMessage(hwnd, gui.EditMsg.SETSEL, cursor, cursor)
-    }
-  }
-  if ('disabled' in newProps) {
-    gui.EnableWindow(hwnd, !newProps.disabled)
-  }
-  if ('hidden' in newProps) {
-    gui.ShowWindow(hwnd, newProps.hidden ? gui.ShowWindowCmd.HIDE : gui.ShowWindowCmd.SHOW)
-  }
-  if ('visible' in newProps) {
-    gui.ShowWindow(hwnd, newProps.visible ? gui.ShowWindowCmd.SHOW : gui.ShowWindowCmd.HIDE)
-  }
-}
+import * as gui from 'gui'
+import type { Instance, Props } from './reconciler.js'
+
+export function applyProps(
+  instance: Instance,
+  newProps: Props,
+  _oldProps: Props,
+) {
+  const hwnd = instance.hwnd!
+  instance.props = newProps
+
+  const textVal = 'text' in newProps ? newProps.text : (
+    typeof newProps.children === 'string' ? newProps.children :
+    typeof newProps.children === 'number' ? String(newProps.children) : undefined
+  )
+  if (textVal !== undefined) {
+    let cursor = -1
+    if (instance.type === 'EDIT') {
+      const sel = gui.SendMessage(hwnd, gui.EditMsg.GETSEL, 0, 0)
+      cursor = sel >>> 16
+    }
+    gui.SetWindowText(hwnd, textVal)
+    if (instance.type === 'EDIT' && cursor >= 0) {
+      gui.SendMessage(hwnd, gui.EditMsg.SETSEL, cursor, cursor)
+    }
+  }
+  if ('disabled' in newProps) {
+    gui.EnableWindow(hwnd, !newProps.disabled)
+  }
+  if ('hidden' in newProps) {
+    gui.ShowWindow(hwnd, newProps.hidden ? gui.ShowWindowCmd.HIDE : gui.ShowWindowCmd.SHOW)
+  }
+  if ('visible' in newProps) {
+    gui.ShowWindow(hwnd, newProps.visible ? gui.ShowWindowCmd.SHOW : gui.ShowWindowCmd.HIDE)
+  }
+}