@almadar/ui 5.76.6 → 5.77.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4727,7 +4727,11 @@ var init_Switch = __esm({
4727
4727
  disabled,
4728
4728
  onClick: handleClick,
4729
4729
  className: cn(
4730
- "relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
4730
+ // Fixed rem sizes instead of spacing tokens: themes like atelier
4731
+ // redefine --space-11 to 68px, which makes w-11 enormous and leaves
4732
+ // the thumb stuck near the left edge. The switch geometry must stay
4733
+ // proportional regardless of a theme's density scale.
4734
+ "relative inline-flex h-[1.5rem] w-[2.75rem] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
4731
4735
  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
4732
4736
  isChecked ? "bg-primary" : "bg-muted",
4733
4737
  disabled && "cursor-not-allowed opacity-50"
@@ -4736,8 +4740,8 @@ var init_Switch = __esm({
4736
4740
  "span",
4737
4741
  {
4738
4742
  className: cn(
4739
- "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
4740
- isChecked ? "translate-x-5" : "translate-x-0"
4743
+ "pointer-events-none block h-[1.25rem] w-[1.25rem] rounded-full bg-background shadow-lg ring-0 transition-transform",
4744
+ isChecked ? "translate-x-[1.25rem]" : "translate-x-0"
4741
4745
  )
4742
4746
  }
4743
4747
  )
@@ -12149,318 +12153,14 @@ var init_useCanvasEffects = __esm({
12149
12153
  "use client";
12150
12154
  }
12151
12155
  });
12152
- function pickPath(entry) {
12153
- if (Array.isArray(entry.path)) {
12154
- return entry.path[Math.floor(Math.random() * entry.path.length)];
12155
- }
12156
- return entry.path;
12157
- }
12158
- function useGameAudio({
12159
- manifest,
12160
- baseUrl = "",
12161
- initialMuted = false,
12162
- initialVolume = 1
12163
- }) {
12164
- const [muted, setMutedState] = React107.useState(initialMuted);
12165
- const [masterVolume, setMasterVolumeState] = React107.useState(initialVolume);
12166
- const mutedRef = React107.useRef(muted);
12167
- const volumeRef = React107.useRef(masterVolume);
12168
- const manifestRef = React107.useRef(manifest);
12169
- mutedRef.current = muted;
12170
- volumeRef.current = masterVolume;
12171
- manifestRef.current = manifest;
12172
- const poolsRef = React107.useRef(/* @__PURE__ */ new Map());
12173
- const getOrCreateElement = React107.useCallback((key) => {
12174
- const entry = manifestRef.current[key];
12175
- if (!entry) return null;
12176
- let pool = poolsRef.current.get(key);
12177
- if (!pool) {
12178
- pool = [];
12179
- poolsRef.current.set(key, pool);
12180
- }
12181
- const maxSize = entry.poolSize ?? 1;
12182
- for (const audio of pool) {
12183
- if (audio.paused && (audio.ended || audio.currentTime === 0)) {
12184
- return audio;
12185
- }
12186
- }
12187
- if (pool.length < maxSize) {
12188
- const src = baseUrl + pickPath(entry);
12189
- const audio = new Audio(src);
12190
- audio.loop = entry.loop ?? false;
12191
- pool.push(audio);
12192
- return audio;
12193
- }
12194
- if (!entry.loop) {
12195
- let oldest = pool[0];
12196
- for (const audio of pool) {
12197
- if (audio.currentTime > oldest.currentTime) {
12198
- oldest = audio;
12199
- }
12200
- }
12201
- oldest.pause();
12202
- oldest.currentTime = 0;
12203
- return oldest;
12204
- }
12205
- return null;
12206
- }, [baseUrl]);
12207
- const play = React107.useCallback((key) => {
12208
- if (mutedRef.current) return;
12209
- const entry = manifestRef.current[key];
12210
- if (!entry) return;
12211
- const audio = getOrCreateElement(key);
12212
- if (!audio) return;
12213
- audio.volume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
12214
- if (!entry.loop) {
12215
- audio.currentTime = 0;
12216
- }
12217
- const promise = audio.play();
12218
- if (promise) {
12219
- promise.catch(() => {
12220
- });
12221
- }
12222
- }, [getOrCreateElement]);
12223
- const stop = React107.useCallback((key) => {
12224
- const pool = poolsRef.current.get(key);
12225
- if (!pool) return;
12226
- for (const audio of pool) {
12227
- audio.pause();
12228
- audio.currentTime = 0;
12229
- }
12230
- }, []);
12231
- const currentMusicKeyRef = React107.useRef(null);
12232
- const currentMusicElRef = React107.useRef(null);
12233
- const musicFadeRef = React107.useRef(null);
12234
- const pendingMusicKeyRef = React107.useRef(null);
12235
- const clearMusicFade = React107.useCallback(() => {
12236
- if (musicFadeRef.current) {
12237
- clearInterval(musicFadeRef.current);
12238
- musicFadeRef.current = null;
12239
- }
12240
- }, []);
12241
- const playMusic = React107.useCallback((key) => {
12242
- if (key === currentMusicKeyRef.current) return;
12243
- pendingMusicKeyRef.current = key;
12244
- const entry = manifestRef.current[key];
12245
- if (!entry) return;
12246
- const fadeDurationMs = entry.crossfadeDurationMs ?? 1500;
12247
- const stepMs = 50;
12248
- const totalSteps = Math.max(1, fadeDurationMs / stepMs);
12249
- const targetVolume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
12250
- clearMusicFade();
12251
- const src = baseUrl + (Array.isArray(entry.path) ? entry.path[0] : entry.path);
12252
- const incoming = new Audio(src);
12253
- incoming.loop = true;
12254
- incoming.volume = 0;
12255
- const outgoing = currentMusicElRef.current;
12256
- const outgoingStartVol = outgoing?.volume ?? 0;
12257
- currentMusicKeyRef.current = key;
12258
- currentMusicElRef.current = incoming;
12259
- if (!mutedRef.current) {
12260
- incoming.play().catch(() => {
12261
- currentMusicKeyRef.current = null;
12262
- currentMusicElRef.current = outgoing;
12263
- });
12264
- }
12265
- let step = 0;
12266
- musicFadeRef.current = setInterval(() => {
12267
- step++;
12268
- const progress = Math.min(step / totalSteps, 1);
12269
- incoming.volume = Math.min(1, targetVolume * progress);
12270
- if (outgoing) {
12271
- outgoing.volume = Math.max(0, outgoingStartVol * (1 - progress));
12272
- }
12273
- if (progress >= 1) {
12274
- clearMusicFade();
12275
- if (outgoing) {
12276
- outgoing.pause();
12277
- outgoing.src = "";
12278
- }
12279
- }
12280
- }, stepMs);
12281
- }, [baseUrl, clearMusicFade]);
12282
- const stopMusic = React107.useCallback((fadeDurationMs = 1e3) => {
12283
- const outgoing = currentMusicElRef.current;
12284
- if (!outgoing) return;
12285
- currentMusicKeyRef.current = null;
12286
- currentMusicElRef.current = null;
12287
- pendingMusicKeyRef.current = null;
12288
- clearMusicFade();
12289
- const startVolume = outgoing.volume;
12290
- const stepMs = 50;
12291
- const totalSteps = Math.max(1, fadeDurationMs / stepMs);
12292
- let step = 0;
12293
- musicFadeRef.current = setInterval(() => {
12294
- step++;
12295
- const progress = step / totalSteps;
12296
- outgoing.volume = Math.max(0, startVolume * (1 - progress));
12297
- if (progress >= 1) {
12298
- clearMusicFade();
12299
- outgoing.pause();
12300
- outgoing.src = "";
12301
- }
12302
- }, stepMs);
12303
- }, [clearMusicFade]);
12304
- const stopAll = React107.useCallback(() => {
12305
- for (const pool of poolsRef.current.values()) {
12306
- for (const audio of pool) {
12307
- audio.pause();
12308
- audio.currentTime = 0;
12309
- }
12310
- }
12311
- stopMusic(0);
12312
- }, [stopMusic]);
12313
- const setMuted = React107.useCallback((value) => {
12314
- setMutedState(value);
12315
- if (value) {
12316
- for (const [key, pool] of poolsRef.current.entries()) {
12317
- if (manifestRef.current[key]?.loop) {
12318
- for (const audio of pool) {
12319
- if (!audio.paused) audio.pause();
12320
- }
12321
- }
12322
- }
12323
- currentMusicElRef.current?.pause();
12324
- } else {
12325
- for (const [key, pool] of poolsRef.current.entries()) {
12326
- const entry = manifestRef.current[key];
12327
- if (entry?.loop && entry?.autostart) {
12328
- for (const audio of pool) {
12329
- if (audio.paused) audio.play().catch(() => {
12330
- });
12331
- }
12332
- }
12333
- }
12334
- const musicEl = currentMusicElRef.current;
12335
- if (musicEl) {
12336
- musicEl.play().catch(() => {
12337
- });
12338
- }
12339
- }
12340
- }, []);
12341
- const setMasterVolume = React107.useCallback((volume) => {
12342
- const clamped = Math.max(0, Math.min(1, volume));
12343
- setMasterVolumeState(clamped);
12344
- for (const [key, pool] of poolsRef.current.entries()) {
12345
- const entryVol = manifestRef.current[key]?.volume ?? 1;
12346
- for (const audio of pool) {
12347
- audio.volume = Math.min(1, entryVol * clamped);
12348
- }
12349
- }
12350
- if (!musicFadeRef.current && currentMusicElRef.current) {
12351
- const key = currentMusicKeyRef.current;
12352
- const entryVol = key ? manifestRef.current[key]?.volume ?? 1 : 1;
12353
- currentMusicElRef.current.volume = Math.min(1, entryVol * clamped);
12354
- }
12355
- }, []);
12356
- const unlockedRef = React107.useRef(false);
12357
- React107.useEffect(() => {
12358
- const autoKeys = Object.keys(manifest).filter((k) => manifest[k].autostart);
12359
- const hasPendingMusic = () => pendingMusicKeyRef.current !== null;
12360
- const hasAutoStart = autoKeys.length > 0;
12361
- if (!hasAutoStart && !hasPendingMusic()) return;
12362
- const unlock = () => {
12363
- if (unlockedRef.current) return;
12364
- unlockedRef.current = true;
12365
- if (!mutedRef.current) {
12366
- for (const key of autoKeys) {
12367
- play(key);
12368
- }
12369
- const pending = pendingMusicKeyRef.current;
12370
- if (pending && pending !== currentMusicKeyRef.current) {
12371
- playMusic(pending);
12372
- }
12373
- }
12374
- };
12375
- document.addEventListener("click", unlock, { once: true });
12376
- document.addEventListener("keydown", unlock, { once: true });
12377
- document.addEventListener("touchstart", unlock, { once: true });
12378
- return () => {
12379
- document.removeEventListener("click", unlock);
12380
- document.removeEventListener("keydown", unlock);
12381
- document.removeEventListener("touchstart", unlock);
12382
- };
12383
- }, [manifest, play, playMusic]);
12384
- React107.useEffect(() => {
12385
- return () => {
12386
- clearMusicFade();
12387
- for (const pool of poolsRef.current.values()) {
12388
- for (const audio of pool) {
12389
- audio.pause();
12390
- audio.src = "";
12391
- }
12392
- }
12393
- poolsRef.current.clear();
12394
- if (currentMusicElRef.current) {
12395
- currentMusicElRef.current.pause();
12396
- currentMusicElRef.current.src = "";
12397
- currentMusicElRef.current = null;
12398
- }
12399
- };
12400
- }, [clearMusicFade]);
12401
- return {
12402
- play,
12403
- stop,
12404
- stopAll,
12405
- playMusic,
12406
- stopMusic,
12407
- muted,
12408
- setMuted,
12409
- masterVolume,
12410
- setMasterVolume
12411
- };
12412
- }
12413
12156
  var init_useGameAudio = __esm({
12414
12157
  "components/game/shared/hooks/useGameAudio.ts"() {
12415
12158
  "use client";
12416
- useGameAudio.displayName = "useGameAudio";
12417
12159
  }
12418
12160
  });
12419
12161
  function useGameAudioContextOptional() {
12420
12162
  return React107.useContext(GameAudioContext);
12421
12163
  }
12422
- function GameAudioProvider({
12423
- manifest,
12424
- baseUrl = "",
12425
- children,
12426
- initialMuted = false
12427
- }) {
12428
- const eventBus = useEventBus();
12429
- const { play, stop, stopAll, playMusic, stopMusic, muted, setMuted, masterVolume, setMasterVolume } = useGameAudio({ manifest, baseUrl, initialMuted });
12430
- React107.useEffect(() => {
12431
- const unsubPlay = eventBus.on("UI:PLAY_SOUND", (event) => {
12432
- const key = event.payload?.key;
12433
- if (key) play(key);
12434
- });
12435
- const unsubStop = eventBus.on("UI:STOP_SOUND", (event) => {
12436
- const key = event.payload?.key;
12437
- if (key) {
12438
- stop(key);
12439
- } else {
12440
- stopAll();
12441
- }
12442
- });
12443
- const unsubChangeMusic = eventBus.on("UI:CHANGE_MUSIC", (event) => {
12444
- const key = event.payload?.key;
12445
- if (key) {
12446
- playMusic(key);
12447
- } else {
12448
- stopMusic();
12449
- }
12450
- });
12451
- const unsubStopMusic = eventBus.on("UI:STOP_MUSIC", () => {
12452
- stopMusic();
12453
- });
12454
- return () => {
12455
- unsubPlay();
12456
- unsubStop();
12457
- unsubChangeMusic();
12458
- unsubStopMusic();
12459
- };
12460
- }, [eventBus, play, stop, stopAll, playMusic, stopMusic]);
12461
- const value = { muted, setMuted, masterVolume, setMasterVolume, play, playMusic, stopMusic };
12462
- return /* @__PURE__ */ jsxRuntime.jsx(GameAudioContext.Provider, { value, children });
12463
- }
12464
12164
  var GameAudioContext;
12465
12165
  var init_GameAudioProvider = __esm({
12466
12166
  "components/game/shared/providers/GameAudioProvider.tsx"() {
@@ -12469,7 +12169,6 @@ var init_GameAudioProvider = __esm({
12469
12169
  init_useGameAudio();
12470
12170
  GameAudioContext = React107.createContext(null);
12471
12171
  GameAudioContext.displayName = "GameAudioContext";
12472
- GameAudioProvider.displayName = "GameAudioProvider";
12473
12172
  }
12474
12173
  });
12475
12174
  function GameAudioToggle({
@@ -27422,129 +27121,6 @@ var init_Breadcrumb = __esm({
27422
27121
  Breadcrumb.displayName = "Breadcrumb";
27423
27122
  }
27424
27123
  });
27425
- function useSafeEventBus2() {
27426
- try {
27427
- return useEventBus();
27428
- } catch {
27429
- return { emit: () => {
27430
- }, on: () => () => {
27431
- }, once: () => {
27432
- } };
27433
- }
27434
- }
27435
- var log8, lookStyles4, ButtonGroup;
27436
- var init_ButtonGroup = __esm({
27437
- "components/core/molecules/ButtonGroup.tsx"() {
27438
- "use client";
27439
- init_cn();
27440
- init_atoms();
27441
- init_useEventBus();
27442
- log8 = logger.createLogger("almadar:ui:button-group");
27443
- lookStyles4 = {
27444
- "right-aligned-buttons": "",
27445
- "floating-bar": "fixed bottom-section left-1/2 -translate-x-1/2 shadow-elevation-toast bg-card p-card-sm rounded-container",
27446
- "inline-row": "gap-2 inline-flex",
27447
- "dropdown-menu": "[&>button:not(:first-child)]:hidden",
27448
- "command-palette-trigger": "[&>button:not(:first-child)]:hidden"
27449
- };
27450
- ButtonGroup = ({
27451
- children,
27452
- primary,
27453
- secondary,
27454
- variant = "default",
27455
- orientation = "horizontal",
27456
- className,
27457
- // Filter-group pattern props (entity and filters are used for schema-driven filtering)
27458
- entity: _entity,
27459
- filters,
27460
- look = "right-aligned-buttons"
27461
- }) => {
27462
- const eventBus = useSafeEventBus2();
27463
- const variantClasses2 = {
27464
- default: "gap-0",
27465
- segmented: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0",
27466
- toggle: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0"
27467
- };
27468
- const orientationClasses = {
27469
- horizontal: "flex-row",
27470
- vertical: "flex-col [&>button:first-child]:rounded-t-lg [&>button:last-child]:rounded-b-lg [&>button:not(:first-child)]:border-t-0 [&>button:not(:first-child)]:border-l"
27471
- };
27472
- const handleActionClick = (action) => {
27473
- if (action.event) {
27474
- eventBus.emit("UI:DISPATCH", { event: action.event });
27475
- }
27476
- if (action.navigatesTo) {
27477
- eventBus.emit("UI:NAVIGATE", { url: action.navigatesTo });
27478
- }
27479
- };
27480
- const renderFormActions = () => {
27481
- const buttons = [];
27482
- if (secondary) {
27483
- secondary.forEach((action, index) => {
27484
- buttons.push(
27485
- /* @__PURE__ */ jsxRuntime.jsx(
27486
- Button,
27487
- {
27488
- type: action.actionType === "submit" ? "submit" : "button",
27489
- variant: action.variant || "ghost",
27490
- onClick: () => handleActionClick(action),
27491
- children: action.label
27492
- },
27493
- `secondary-${index}`
27494
- )
27495
- );
27496
- });
27497
- }
27498
- if (primary) {
27499
- const isSubmit = primary.actionType === "submit";
27500
- buttons.push(
27501
- /* @__PURE__ */ jsxRuntime.jsx(
27502
- Button,
27503
- {
27504
- type: isSubmit ? "submit" : "button",
27505
- variant: primary.variant || "primary",
27506
- onClick: () => handleActionClick(primary),
27507
- "data-testid": isSubmit ? "form-submit" : void 0,
27508
- children: primary.label
27509
- },
27510
- "primary"
27511
- )
27512
- );
27513
- }
27514
- return buttons;
27515
- };
27516
- const renderFilters = () => {
27517
- if (!filters || filters.length === 0) return null;
27518
- return filters.map((filter, index) => /* @__PURE__ */ jsxRuntime.jsx(
27519
- Button,
27520
- {
27521
- variant: "ghost",
27522
- onClick: () => {
27523
- log8.debug("Filter clicked", { field: filter.field });
27524
- },
27525
- children: filter.label
27526
- },
27527
- `filter-${filter.field}-${index}`
27528
- ));
27529
- };
27530
- return /* @__PURE__ */ jsxRuntime.jsx(
27531
- "div",
27532
- {
27533
- className: cn(
27534
- "inline-flex gap-2",
27535
- variantClasses2[variant],
27536
- orientationClasses[orientation],
27537
- lookStyles4[look],
27538
- className
27539
- ),
27540
- role: "group",
27541
- children: children || renderFilters() || renderFormActions()
27542
- }
27543
- );
27544
- };
27545
- ButtonGroup.displayName = "ButtonGroup";
27546
- }
27547
- });
27548
27124
  function useSwipeGesture(callbacks, options = {}) {
27549
27125
  const { threshold = 50, velocityThreshold = 0.3, preventDefault = false } = options;
27550
27126
  const startX = React107.useRef(0);
@@ -28354,7 +27930,7 @@ var init_CardGrid = __esm({
28354
27930
  CardGrid.displayName = "CardGrid";
28355
27931
  }
28356
27932
  });
28357
- function useSafeEventBus3() {
27933
+ function useSafeEventBus2() {
28358
27934
  try {
28359
27935
  return useEventBus();
28360
27936
  } catch {
@@ -28390,7 +27966,7 @@ var init_Carousel = __esm({
28390
27966
  const [activeIndex, setActiveIndex] = React107.useState(0);
28391
27967
  const scrollRef = React107.useRef(null);
28392
27968
  const autoPlayRef = React107.useRef(null);
28393
- const eventBus = useSafeEventBus3();
27969
+ const eventBus = useSafeEventBus2();
28394
27970
  const { t } = hooks.useTranslate();
28395
27971
  const safeItems = items ?? [];
28396
27972
  const totalSlides = safeItems.length;
@@ -31726,7 +31302,7 @@ function DataGrid({
31726
31302
  /* @__PURE__ */ jsxRuntime.jsx(
31727
31303
  Box,
31728
31304
  {
31729
- className: cn("grid", gapStyles5[gap], scrollX ? "grid-flow-col overflow-x-auto" : colsClass, lookStyles5[look], className),
31305
+ className: cn("grid", gapStyles5[gap], scrollX ? "grid-flow-col overflow-x-auto" : colsClass, lookStyles4[look], className),
31730
31306
  style: scrollX ? { gridAutoFlow: "column", gridAutoColumns: `minmax(${minCardWidth}px, 1fr)` } : gridTemplateColumns ? { gridTemplateColumns } : void 0,
31731
31307
  children: data.map((item, index) => {
31732
31308
  const itemData = item;
@@ -31921,7 +31497,7 @@ function DataGrid({
31921
31497
  ] })
31922
31498
  );
31923
31499
  }
31924
- var dataGridLog, BADGE_VARIANTS, gapStyles5, lookStyles5;
31500
+ var dataGridLog, BADGE_VARIANTS, gapStyles5, lookStyles4;
31925
31501
  var init_DataGrid = __esm({
31926
31502
  "components/core/molecules/DataGrid.tsx"() {
31927
31503
  "use client";
@@ -31956,7 +31532,7 @@ var init_DataGrid = __esm({
31956
31532
  lg: "gap-6",
31957
31533
  xl: "gap-8"
31958
31534
  };
31959
- lookStyles5 = {
31535
+ lookStyles4 = {
31960
31536
  dense: "gap-2 [&>*]:p-card-sm",
31961
31537
  spacious: "gap-8 [&>*]:p-card-lg",
31962
31538
  striped: "[&>*:nth-child(even)]:bg-muted/30",
@@ -32383,6 +31959,133 @@ var init_DataList = __esm({
32383
31959
  DataList.displayName = "DataList";
32384
31960
  }
32385
31961
  });
31962
+ var FormSection, FormLayout, FormActions;
31963
+ var init_FormSection = __esm({
31964
+ "components/core/molecules/FormSection.tsx"() {
31965
+ "use client";
31966
+ init_cn();
31967
+ init_atoms();
31968
+ init_Box();
31969
+ init_Typography();
31970
+ init_Button();
31971
+ init_Stack();
31972
+ init_Icon();
31973
+ init_useEventBus();
31974
+ FormSection = ({
31975
+ title,
31976
+ description,
31977
+ children,
31978
+ collapsible = false,
31979
+ defaultCollapsed = false,
31980
+ card = false,
31981
+ columns = 1,
31982
+ className
31983
+ }) => {
31984
+ const [collapsed, setCollapsed] = React107__namespace.default.useState(defaultCollapsed);
31985
+ const { t } = hooks.useTranslate();
31986
+ const eventBus = useEventBus();
31987
+ const gridClass = {
31988
+ 1: "grid-cols-1",
31989
+ 2: "grid-cols-1 md:grid-cols-2",
31990
+ 3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
31991
+ }[columns];
31992
+ React107__namespace.default.useCallback(() => {
31993
+ if (collapsible) {
31994
+ setCollapsed((prev) => !prev);
31995
+ eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
31996
+ }
31997
+ }, [collapsible, collapsed, eventBus]);
31998
+ const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
31999
+ (title || description) && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", className: "mb-4", children: [
32000
+ title && /* @__PURE__ */ jsxRuntime.jsxs(
32001
+ HStack,
32002
+ {
32003
+ justify: "between",
32004
+ align: "center",
32005
+ className: cn(collapsible && "cursor-pointer"),
32006
+ action: collapsible ? "TOGGLE_COLLAPSE" : void 0,
32007
+ children: [
32008
+ /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h3", weight: "semibold", children: title }),
32009
+ collapsible && /* @__PURE__ */ jsxRuntime.jsx(
32010
+ Button,
32011
+ {
32012
+ variant: "ghost",
32013
+ size: "sm",
32014
+ action: "TOGGLE_COLLAPSE",
32015
+ children: /* @__PURE__ */ jsxRuntime.jsx(
32016
+ Icon,
32017
+ {
32018
+ icon: LucideIcons2.ChevronDown,
32019
+ size: "sm",
32020
+ className: cn(
32021
+ "text-muted-foreground transition-transform",
32022
+ collapsed && "rotate-180"
32023
+ )
32024
+ }
32025
+ )
32026
+ }
32027
+ )
32028
+ ]
32029
+ }
32030
+ ),
32031
+ description && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", color: "secondary", children: description })
32032
+ ] }),
32033
+ (!collapsible || !collapsed) && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: cn("grid gap-4", gridClass), children })
32034
+ ] });
32035
+ if (card) {
32036
+ return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("p-6", className), children: content });
32037
+ }
32038
+ return /* @__PURE__ */ jsxRuntime.jsx(Box, { className, children: content });
32039
+ };
32040
+ FormSection.displayName = "FormSection";
32041
+ FormLayout = ({
32042
+ children,
32043
+ dividers = true,
32044
+ className
32045
+ }) => {
32046
+ return /* @__PURE__ */ jsxRuntime.jsx(
32047
+ VStack,
32048
+ {
32049
+ gap: "lg",
32050
+ className: cn(
32051
+ dividers && "[&>*+*]:pt-8 [&>*+*]:border-t [&>*+*]:border-border",
32052
+ className
32053
+ ),
32054
+ children
32055
+ }
32056
+ );
32057
+ };
32058
+ FormLayout.displayName = "FormLayout";
32059
+ FormActions = ({
32060
+ children,
32061
+ sticky = false,
32062
+ align = "right",
32063
+ className
32064
+ }) => {
32065
+ const alignClass2 = {
32066
+ left: "justify-start",
32067
+ right: "justify-end",
32068
+ between: "justify-between",
32069
+ center: "justify-center"
32070
+ }[align];
32071
+ return /* @__PURE__ */ jsxRuntime.jsx(
32072
+ HStack,
32073
+ {
32074
+ gap: "sm",
32075
+ align: "center",
32076
+ className: cn(
32077
+ "pt-6 border-t border-border",
32078
+ alignClass2,
32079
+ sticky && "sticky bottom-0 bg-card py-4 -mx-6 px-6 shadow-[0_-4px_6px_-1px_rgb(0,0,0,0.05)]",
32080
+ className
32081
+ ),
32082
+ children
32083
+ }
32084
+ );
32085
+ };
32086
+ FormActions.displayName = "FormActions";
32087
+ }
32088
+ });
32386
32089
  function fileIcon(name) {
32387
32090
  const ext = name.split(".").pop()?.toLowerCase() ?? "";
32388
32091
  switch (ext) {
@@ -32544,6 +32247,129 @@ var init_FormField = __esm({
32544
32247
  FormField.displayName = "FormField";
32545
32248
  }
32546
32249
  });
32250
+ function useSafeEventBus3() {
32251
+ try {
32252
+ return useEventBus();
32253
+ } catch {
32254
+ return { emit: () => {
32255
+ }, on: () => () => {
32256
+ }, once: () => {
32257
+ } };
32258
+ }
32259
+ }
32260
+ var log8, lookStyles5, ButtonGroup;
32261
+ var init_ButtonGroup = __esm({
32262
+ "components/core/molecules/ButtonGroup.tsx"() {
32263
+ "use client";
32264
+ init_cn();
32265
+ init_atoms();
32266
+ init_useEventBus();
32267
+ log8 = logger.createLogger("almadar:ui:button-group");
32268
+ lookStyles5 = {
32269
+ "right-aligned-buttons": "",
32270
+ "floating-bar": "fixed bottom-section left-1/2 -translate-x-1/2 shadow-elevation-toast bg-card p-card-sm rounded-container",
32271
+ "inline-row": "gap-2 inline-flex",
32272
+ "dropdown-menu": "[&>button:not(:first-child)]:hidden",
32273
+ "command-palette-trigger": "[&>button:not(:first-child)]:hidden"
32274
+ };
32275
+ ButtonGroup = ({
32276
+ children,
32277
+ primary,
32278
+ secondary,
32279
+ variant = "default",
32280
+ orientation = "horizontal",
32281
+ className,
32282
+ // Filter-group pattern props (entity and filters are used for schema-driven filtering)
32283
+ entity: _entity,
32284
+ filters,
32285
+ look = "right-aligned-buttons"
32286
+ }) => {
32287
+ const eventBus = useSafeEventBus3();
32288
+ const variantClasses2 = {
32289
+ default: "gap-0",
32290
+ segmented: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0",
32291
+ toggle: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0"
32292
+ };
32293
+ const orientationClasses = {
32294
+ horizontal: "flex-row",
32295
+ vertical: "flex-col [&>button:first-child]:rounded-t-lg [&>button:last-child]:rounded-b-lg [&>button:not(:first-child)]:border-t-0 [&>button:not(:first-child)]:border-l"
32296
+ };
32297
+ const handleActionClick = (action) => {
32298
+ if (action.event) {
32299
+ eventBus.emit("UI:DISPATCH", { event: action.event });
32300
+ }
32301
+ if (action.navigatesTo) {
32302
+ eventBus.emit("UI:NAVIGATE", { url: action.navigatesTo });
32303
+ }
32304
+ };
32305
+ const renderFormActions = () => {
32306
+ const buttons = [];
32307
+ if (secondary) {
32308
+ secondary.forEach((action, index) => {
32309
+ buttons.push(
32310
+ /* @__PURE__ */ jsxRuntime.jsx(
32311
+ Button,
32312
+ {
32313
+ type: action.actionType === "submit" ? "submit" : "button",
32314
+ variant: action.variant || "ghost",
32315
+ onClick: () => handleActionClick(action),
32316
+ children: action.label
32317
+ },
32318
+ `secondary-${index}`
32319
+ )
32320
+ );
32321
+ });
32322
+ }
32323
+ if (primary) {
32324
+ const isSubmit = primary.actionType === "submit";
32325
+ buttons.push(
32326
+ /* @__PURE__ */ jsxRuntime.jsx(
32327
+ Button,
32328
+ {
32329
+ type: isSubmit ? "submit" : "button",
32330
+ variant: primary.variant || "primary",
32331
+ onClick: () => handleActionClick(primary),
32332
+ "data-testid": isSubmit ? "form-submit" : void 0,
32333
+ children: primary.label
32334
+ },
32335
+ "primary"
32336
+ )
32337
+ );
32338
+ }
32339
+ return buttons;
32340
+ };
32341
+ const renderFilters = () => {
32342
+ if (!filters || filters.length === 0) return null;
32343
+ return filters.map((filter, index) => /* @__PURE__ */ jsxRuntime.jsx(
32344
+ Button,
32345
+ {
32346
+ variant: "ghost",
32347
+ onClick: () => {
32348
+ log8.debug("Filter clicked", { field: filter.field });
32349
+ },
32350
+ children: filter.label
32351
+ },
32352
+ `filter-${filter.field}-${index}`
32353
+ ));
32354
+ };
32355
+ return /* @__PURE__ */ jsxRuntime.jsx(
32356
+ "div",
32357
+ {
32358
+ className: cn(
32359
+ "inline-flex gap-2",
32360
+ variantClasses2[variant],
32361
+ orientationClasses[orientation],
32362
+ lookStyles5[look],
32363
+ className
32364
+ ),
32365
+ role: "group",
32366
+ children: children || renderFilters() || renderFormActions()
32367
+ }
32368
+ );
32369
+ };
32370
+ ButtonGroup.displayName = "ButtonGroup";
32371
+ }
32372
+ });
32547
32373
  function getOrCreateStore(query) {
32548
32374
  if (!queryStores.has(query)) {
32549
32375
  queryStores.set(query, {
@@ -51104,7 +50930,6 @@ var init_component_registry_generated = __esm({
51104
50930
  init_BranchingLogicBuilder();
51105
50931
  init_Breadcrumb();
51106
50932
  init_BuilderBoard();
51107
- init_ButtonGroup();
51108
50933
  init_CTABanner();
51109
50934
  init_CalendarGrid();
51110
50935
  init_Canvas2D();
@@ -51181,9 +51006,9 @@ var init_component_registry_generated = __esm({
51181
51006
  init_FlipContainer();
51182
51007
  init_FloatingActionButton();
51183
51008
  init_Form();
51009
+ init_FormSection();
51184
51010
  init_FormField();
51185
51011
  init_FormSectionHeader();
51186
- init_GameAudioProvider();
51187
51012
  init_GameAudioToggle();
51188
51013
  init_GameCard();
51189
51014
  init_GameHud();
@@ -51432,7 +51257,6 @@ var init_component_registry_generated = __esm({
51432
51257
  "Breadcrumb": Breadcrumb,
51433
51258
  "BuilderBoard": BuilderBoard,
51434
51259
  "Button": ButtonPattern,
51435
- "ButtonGroup": ButtonGroup,
51436
51260
  "ButtonPattern": ButtonPattern,
51437
51261
  "CTABanner": CTABanner,
51438
51262
  "CalendarGrid": CalendarGrid,
@@ -51512,9 +51336,10 @@ var init_component_registry_generated = __esm({
51512
51336
  "FlipContainer": FlipContainer,
51513
51337
  "FloatingActionButton": FloatingActionButton,
51514
51338
  "Form": Form,
51339
+ "FormActions": FormActions,
51515
51340
  "FormField": FormField,
51341
+ "FormLayout": FormLayout,
51516
51342
  "FormSectionHeader": FormSectionHeader,
51517
- "GameAudioProvider": GameAudioProvider,
51518
51343
  "GameAudioToggle": GameAudioToggle,
51519
51344
  "GameBoard3D": GameBoard3D,
51520
51345
  "GameCanvas3D": GameCanvas3D,