feat(sw): integrated improvement 0.2.0 (popup content, header open, tool buttons)
SW package 0.2.0 integrated improvement (Task A, steps 1-8). All new props are
optional; existing SW Stories are pixel-identical to the previous build (28/28).
- Build reproducibility: dist text normalized to LF, dist/build-info.json
(commit, dirty, tool versions, no timestamp), packages/sw/.gitattributes
(eol=lf). LF checkouts give identical dist and tarball.
- SWHeader: documentOpenPlacement ("menu" default | "header": Open right of
the logo in the existing document-button look, reusing onDocumentOpen and
documentOpenLabel, no duplicate Open in the dropdown), leading slot,
hiddenControls sub-items documentNew / documentOpen / layerFreeze /
layerLock. Open moves into More on measured overflow (with hysteresis).
- showNew / showOpen (SWHeaderDocumentTitle), showFreeze / showLock (layer
menu, field, property window list).
- SWToolButton (text / pill / document) and SWToolGroup (radio selection),
reusing the existing toggle, pill and file-name looks.
- SWPopup / SWPopupSection / SWPopupRow on the shared property window frame;
SWHeaderPropertyPanel gains children, title, autoFocus and optional
selection / properties / groups. Escape stack for several popups.
- Field dropdowns inside a popup use the shared fixed overlay
(useSWFixedDropdownPosition), so the scrolling body no longer clips them.
- AI guide, examples E/F, README, Storybook (SW/Header/Options, SW/Tool,
SW/Popup) and verification record docs/sw/sw-integrated-improvement-2026-10-19.md.
- Regression scripts rescoped for the intended changes (unused-removal 81/81,
overview 52/54 with the two pre-existing historical assertions).
Known limitation (unresolved): tools / leading content (incl. SWToolGroup)
does not move into More. With a wide tool bar the configured fields shrink
instead; in Example F the document name and layer field reach 0px at 390px.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
5faa1f1ffe
commit
55179b4577
138 files changed
+17194
-162
No files matched your search
@@ -0,0 +1,40 @@
|
||||
// Example E — the SW popup frame with project content (no Header). SWPopup keeps the property window design;
|
||||
// children are free: SWPopupSection / SWPopupRow rows with SWHeaderInput, and an existing SW dropdown.
|
||||
import { useId, useState } from "react"
|
||||
import { SWHeaderLayerMenu, SWHeaderInput, SWPopup, SWPopupRow, SWPopupSection, SWTheme } from "@hm-design/sw"
|
||||
import { layers } from "./sample-data"
|
||||
|
||||
export function ExampleECustomPopup({ onEvent }: { onEvent?: (name: string) => void }) {
|
||||
const [open, setOpen] = useState(true)
|
||||
const nameId = useId()
|
||||
const [name, setName] = useState("평면도-01")
|
||||
const [scale, setScale] = useState("100")
|
||||
const [x, setX] = useState("1200.5")
|
||||
const [activeLayerId, setActiveLayerId] = useState("0")
|
||||
if (!open) return <button type="button" onClick={() => setOpen(true)}>설정 열기</button>
|
||||
return (
|
||||
<SWTheme>
|
||||
<SWPopup title="도면 설정" onClose={() => { setOpen(false); onEvent?.("popup:close") }}>
|
||||
<SWPopupSection title="도면">
|
||||
<SWPopupRow label="이름" htmlFor={nameId}>
|
||||
<SWHeaderInput id={nameId} value={name} onCommit={next => { setName(next); onEvent?.(`name:${next}`) }} />
|
||||
</SWPopupRow>
|
||||
<SWPopupRow label="축척" unit="%" numeric>
|
||||
<SWHeaderInput aria-label="축척" valueType="number" value={scale} onCommit={next => { setScale(next); onEvent?.(`scale:${next}`) }} />
|
||||
</SWPopupRow>
|
||||
</SWPopupSection>
|
||||
<SWPopupSection title="객체 정보">
|
||||
<SWPopupRow label="타입" readOnly><SWHeaderInput aria-label="타입" value="Line" readOnly /></SWPopupRow>
|
||||
<SWPopupRow label="X" unit="mm" numeric>
|
||||
<SWHeaderInput aria-label="X" valueType="number" value={x} onCommit={next => { setX(next); onEvent?.(`x:${next}`) }} />
|
||||
</SWPopupRow>
|
||||
</SWPopupSection>
|
||||
<SWPopupSection title="레이어">
|
||||
{/* Inside a popup the dropdown opens as a fixed overlay, so the scrolling body never clips it. */}
|
||||
<SWHeaderLayerMenu value={{ name: "0" }} layers={layers} activeLayerId={activeLayerId}
|
||||
onLayerSelect={layer => { setActiveLayerId(layer.id); onEvent?.(`layer:${layer.id}`) }} />
|
||||
</SWPopupSection>
|
||||
</SWPopup>
|
||||
</SWTheme>
|
||||
)
|
||||
}
|
||||
Reference in new issue
Block a user