Moku/Work
1
0
Fork 0
Code Issues Pull Requests Activity

Feat: Prepare frontend future model

Browse Source
This commit is contained in:
MangoPig
2026-06-18 16:58:31 +01:00
parent fcf96590bb
commit 25c6934801
13 changed files with 342 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
Frontend/src/components/shell/WorkspaceMobileActionSheet/WorkspaceMobileActionSheet.tsx
View File

@@ -76,32 +76,32 @@ export const WorkspaceMobileActionSheet = (props: WorkspaceMobileActionSheetProp
return (
<Portal>
<div class={styles.layer}>
<button class={styles.backdrop} type="button" aria-label="Close action sheet" onClick={props.onClose} />
<div class={styles.layer} data-ui="workspace-mobile-action-sheet" data-target-kind={target.kind} data-item-type={target.kind === "item" ? target.itemType : undefined}>
<button class={styles.backdrop} type="button" aria-label="Close action sheet" data-slot="mobile-action-sheet-backdrop" onClick={props.onClose} />
<section class={styles.sheet} aria-label={`${target.label} actions`}>
<div class={styles.handle} aria-hidden="true" />
<section class={styles.sheet} aria-label={`${target.label} actions`} data-slot="mobile-action-sheet-panel">
<div class={styles.handle} data-slot="mobile-action-sheet-handle" aria-hidden="true" />
<header class={styles.header}>
<div class={styles.headerCopy}>
<header class={styles.header} data-slot="mobile-action-sheet-header">
<div class={styles.headerCopy} data-slot="mobile-action-sheet-header-copy">
<span class={styles.eyebrow}>{getWorkspaceContextMenuEyebrow(target)}</span>
<strong class={styles.title}>{target.label}</strong>
</div>
<button class={styles.closeButton} type="button" aria-label="Close action sheet" onClick={props.onClose}>
<button class={styles.closeButton} type="button" aria-label="Close action sheet" data-slot="mobile-action-sheet-close" onClick={props.onClose}>
<X size={18} strokeWidth={2} />
</button>
</header>
<div class={styles.sectionList}>
<div class={styles.sectionList} data-slot="mobile-action-sheet-sections">
<For each={sections}>
{(section): JSX.Element => (
<section class={styles.section}>
<section class={styles.section} data-slot="mobile-action-sheet-section" data-section-id={section.id}>
<Show when={section.label}>
<span class={styles.sectionLabel}>{section.label}</span>
</Show>
<div class={styles.actionList}>
<div class={styles.actionList} data-slot="mobile-action-sheet-action-list">
<For each={section.items}>
{(action): JSX.Element => (
<button
@@ -110,6 +110,9 @@ export const WorkspaceMobileActionSheet = (props: WorkspaceMobileActionSheetProp
[styles.action]: true,
[styles.actionDanger]: action.tone === "danger",
}}
data-slot="mobile-action-sheet-action"
data-action-id={action.id}
data-tone={action.tone ?? "default"}
onClick={() => handleActionSelect(action, target)}
>
<span class={styles.actionLabel}>{action.label}</span>