softable-pixels-web 1.1.11 → 1.1.13

package/dist/{ContextMenu-Csd8aqKT.js → ContextMenu-BTTCFutN.js}

@@ -240,7 +240,11 @@ var types_exports = {};
 function createContextMenuStyles(_props) {
 	return styled({ trigger: {
 		width: "fit-content",
-		height: "fit-content"
+		height: "fit-content",
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center",
+		cursor: "pointer"
 	} });
 }
 
@@ -302,4 +306,4 @@ const ContextMenu = (props) => {
 
 //#endregion
 export { types_exports as n, ContextMenu as t };
-//# sourceMappingURL=ContextMenu-Csd8aqKT.js.map
+//# sourceMappingURL=ContextMenu-BTTCFutN.js.map

package/dist/{ContextMenu-Csd8aqKT.js.map → ContextMenu-BTTCFutN.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu-Csd8aqKT.js","names":["floatingOptions: FloatingOptions","DividerRow: React.FC","close"],"sources":["../src/components/commons/toolkit/ContextMenu/components/Menu/components/ItemRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/ItemRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/components/CustomRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/CustomRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/components/DividerRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/DividerRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/index.tsx","../src/components/commons/toolkit/ContextMenu/utils/normalizeMenuOptions.ts","../src/components/commons/toolkit/ContextMenu/types.ts","../src/components/commons/toolkit/ContextMenu/styles.ts","../src/components/commons/toolkit/ContextMenu/index.tsx"],"sourcesContent":["// Types\nimport type { ItemRowProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createItemRowStyles<T>({ item, active }: ItemRowProps<T>) {\n  return styled({\n    button: {\n      width: '100%',\n      textAlign: 'left',\n\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: '0.5rem',\n\n      borderRadius: '0.5rem',\n\n      paddingInline: '0.5rem',\n      paddingBlock: '0.25rem',\n\n      userSelect: 'none',\n\n      backgroundColor:\n        item.disabled || active\n          ? 'var(--px-background-card-hover)'\n          : 'transparent',\n\n      __rules: {\n        '&:hover': {\n          transition: 'all 200ms',\n          backgroundColor: 'var(--px-background-card-hover) !important'\n        }\n      }\n    },\n    containerIcon: {\n      width: '1rem',\n      flexShrink: 0,\n      display: 'flex',\n      alignItems: 'center'\n    }\n  })\n}\n","// External Libraries\nimport { useEffect, useRef, useState } from 'react'\n\n// Components\nimport { Menu } from '../..'\nimport { Switch } from '@components/commons/toolkit/Switch'\nimport { Popover } from '@components/commons/toolkit/Popover'\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { ItemRowProps } from './types'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\n\n// Styles\nimport { createItemRowStyles } from './styles'\n\nexport const ItemRow = <T extends string>(props: ItemRowProps<T>) => {\n  const { item, depth, width, onHover, onSelect } = props\n  const isGroup = item.type === 'group'\n\n  const [subOpen, setSubOpen] = useState(false)\n  const closeTimer = useRef<number | null>(null)\n  const anchorRef = useRef<HTMLButtonElement | null>(null)\n  const floatingOptions: FloatingOptions = {\n    offsetX: 10,\n    offsetY: -4,\n    strategy: 'fixed',\n    keepInViewport: true,\n    placement: 'right-start'\n  }\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createItemRowStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.active]\n  })\n\n  // Functions\n  function handleMouseEnter() {\n    onHover(item.id, isGroup)\n\n    if (!isGroup) return\n    clearTimer()\n    setSubOpen(true)\n  }\n\n  function handleMouseLeave() {\n    if (!isGroup) return\n    scheduleClose()\n  }\n\n  function handleClick() {\n    if (isGroup) return\n    onSelect(item)\n  }\n\n  function clearTimer() {\n    if (closeTimer.current) window.clearTimeout(closeTimer.current)\n    closeTimer.current = null\n  }\n\n  function scheduleClose() {\n    clearTimer()\n    closeTimer.current = window.setTimeout(() => setSubOpen(false), 150)\n  }\n\n  function renderMenuType() {\n    if (item.type === 'switch') return <Switch checked={item.checked} />\n    else {\n      return (\n        <>\n          {item.shortcut ? <span>{item.shortcut}</span> : null}\n\n          {isGroup ? <span>›</span> : null}\n        </>\n      )\n    }\n  }\n\n  // UseEffects\n  // biome-ignore lint/correctness/useExhaustiveDependencies: <Not needed>\n  useEffect(() => {\n    return () => clearTimer()\n  }, [])\n\n  return (\n    <>\n      <button\n        ref={anchorRef}\n        type=\"button\"\n        role=\"menuitem\"\n        style={styles.button}\n        className={classes.button}\n        disabled={!!item.disabled}\n        aria-disabled={item.disabled || undefined}\n        onClick={handleClick}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n      >\n        {item.icon ? (\n          <span style={styles.containerIcon}>{item.icon ?? null}</span>\n        ) : null}\n\n        <Typography variant=\"b2\">{item.label}</Typography>\n\n        {renderMenuType()}\n      </button>\n\n      {isGroup ? (\n        <Popover\n          // biome-ignore lint/suspicious/noExplicitAny: <Not needed>\n          anchorRef={anchorRef as any}\n          open={subOpen}\n          closeOnOutsideClick={false}\n          closeOnEscape={false}\n          floatingOptions={floatingOptions}\n          onMouseEnter={() => {\n            clearTimer()\n            setSubOpen(true)\n          }}\n          onMouseLeave={() => {\n            scheduleClose()\n          }}\n          content={() => (\n            <Menu\n              width={width}\n              depth={depth + 1}\n              activeId={undefined}\n              items={item.children}\n              onHover={onHover}\n              onSelect={onSelect}\n            />\n          )}\n          onOpenChange={setSubOpen}\n        />\n      ) : null}\n    </>\n  )\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createCustomRowStyles() {\n  return styled({\n    container: {\n      padding: '0.25rem'\n    }\n  })\n}\n","// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { CustomRowProps } from './types'\n\n// Styles\nimport { createCustomRowStyles } from './styles'\n\nexport const CustomRow = <T extends string>(props: CustomRowProps<T>) => {\n  const { item, close } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createCustomRowStyles)\n\n  return <div style={styles.container}>{item.render({ close })}</div>\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createDividerRowStyles() {\n  return styled({\n    container: {\n      border: 0,\n      display: 'flex',\n      marginBlock: '0.1rem',\n      borderTop: '1px solid var(--px-border-primary)'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createDividerRowStyles } from './styles'\n\nexport const DividerRow: React.FC = props => {\n  // Hooks\n  const { styles } = useThemedStyles(props, createDividerRowStyles)\n\n  return <hr style={styles.container} />\n}\n","// Types\nimport type { MenuProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createMenuStyles<T>({ width }: MenuProps<T>) {\n  return styled({\n    container: {\n      width,\n      flexShrink: 0\n    }\n  })\n}\n","// Components\nimport { ItemRow } from './components/ItemRow'\nimport { CustomRow } from './components/CustomRow'\nimport { DividerRow } from './components/DividerRow'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { MenuProps } from './types'\n\n// Styles\nimport { createMenuStyles } from './styles'\n\nexport const Menu = <T extends string>(props: MenuProps<T>) => {\n  const { items, depth, activeId, width = 240, onHover, onSelect } = props\n\n  const { styles } = useThemedStyles(props, createMenuStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.items, p.width, p.activeId, p.onSelect, p.onHover]\n  })\n\n  // Functions\n  function renderItems() {\n    return items.map(item => {\n      if (item.type === 'divider') return <DividerRow key={item.id} />\n      if (item.type === 'custom')\n        return <CustomRow key={item.id} item={item} close={close} />\n\n      return (\n        <ItemRow\n          key={item.id}\n          item={item}\n          depth={depth}\n          width={width}\n          active={activeId === item.id}\n          onHover={onHover}\n          onSelect={onSelect}\n        />\n      )\n    })\n  }\n\n  return (\n    <div style={styles.container} role={depth === 0 ? 'menu' : undefined}>\n      {renderItems()}\n    </div>\n  )\n}\n","// Types\nimport type { MenuOption, MenuOptionInput } from '../types'\n\nexport function normalizeMenuOptions<T>(\n  options: MenuOptionInput<T>[]\n): MenuOption<T>[] {\n  return options.map(opt => {\n    if ('children' in opt) {\n      return {\n        id: opt.id,\n        label: opt.label,\n        icon: opt.icon,\n        shortcut: opt.shortcut,\n        disabled: opt.disabled,\n        className: opt.className,\n        type: 'group' as const,\n        children: normalizeMenuOptions(opt.children)\n      }\n    }\n    return opt as MenuOption<T>\n  })\n}\n","// External Libraries\nimport type { ReactNode } from 'react'\n\n// Hooks\nimport type { Placement } from '@hooks/useFloating/types'\n\n// Styles\nimport type { createContextMenuStyles } from './styles'\n\ninterface BaseOption<T> {\n  id: T\n  icon?: ReactNode\n  label?: ReactNode\n  disabled?: boolean\n  className?: string\n  shortcut?: ReactNode\n  closeOnSelect?: boolean\n}\n\nexport type MenuActionOption<T> = BaseOption<T> & {\n  type: 'action'\n  closeOnSelect?: boolean\n}\n\nexport type MenuSwitchOption<T> = BaseOption<T> & {\n  type: 'switch'\n  checked: boolean\n  closeOnSelect?: boolean\n  onCheckedChange: (next: boolean) => void\n}\n\nexport interface MenuDividerOption<T> {\n  id: T\n  type: 'divider'\n}\n\nexport interface MenuCustomOption<T> extends BaseOption<T> {\n  type: 'custom'\n  render: (ctx: { close: () => void }) => ReactNode\n}\n\nexport interface MenuGroupInput<T> extends BaseOption<T> {\n  type?: 'group'\n  children: MenuOptionInput<T>[]\n}\n\nexport type MenuOptionInput<T> =\n  | MenuGroupInput<T>\n  | MenuActionOption<T>\n  | MenuSwitchOption<T>\n  | MenuCustomOption<T>\n  | MenuDividerOption<T>\n\nexport interface MenuGroup<T> extends BaseOption<T> {\n  type: 'group'\n  children: MenuOption<T>[]\n}\n\nexport type MenuOption<T> =\n  | MenuGroup<T>\n  | MenuActionOption<T>\n  | MenuSwitchOption<T>\n  | MenuCustomOption<T>\n  | MenuDividerOption<T>\n\nexport interface ContextMenuProps<T> {\n  trigger: ReactNode\n  options: MenuOptionInput<T>[]\n\n  offsetX?: number\n  offsetY?: number\n  columnWidth?: number\n  placement?: Placement\n\n  onSelect: (actionId: T) => void\n\n  styles?: Partial<ReturnType<typeof createContextMenuStyles>>\n}\n","// Types\nimport type { ContextMenuProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createContextMenuStyles<T>(_props: ContextMenuProps<T>) {\n  return styled({\n    trigger: {\n      width: 'fit-content',\n      height: 'fit-content'\n    }\n  })\n}\n","// External Libraries\nimport { useMemo } from 'react'\n\n// Components\nimport { Popover } from '../Popover'\nimport { Menu } from './components/Menu'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Utils\nimport { normalizeMenuOptions } from './utils'\n\n// Types\nimport type { ContextMenuProps, MenuOption } from './types'\nimport type { PopoverTriggerRenderProps } from '../Popover/types'\n\nexport * as T from './types'\n\n// Styles\nimport { createContextMenuStyles } from './styles'\n\nexport const ContextMenu = <T extends string>(props: ContextMenuProps<T>) => {\n  const {\n    trigger,\n    options,\n    offsetX = 0,\n    offsetY = 8,\n    columnWidth = 240,\n    placement = 'bottom-start',\n    onSelect\n  } = props\n\n  const items = useMemo(() => normalizeMenuOptions(options), [options])\n  const floatingOptions = useMemo(\n    () => ({\n      offsetX,\n      offsetY,\n      placement\n    }),\n    [offsetX, offsetY, placement]\n  )\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createContextMenuStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.options, p.columnWidth, p.placement]\n  })\n\n  // Functions\n  function handleSelect(item: MenuOption<T>, close: () => void) {\n    if (item.type === 'action') {\n      onSelect(item.id)\n      if (item.closeOnSelect ?? true) close()\n    }\n\n    if (item.type === 'switch') {\n      item.onCheckedChange(!item.checked)\n      if (item.closeOnSelect ?? false) close()\n    }\n  }\n\n  function renderTrigger({\n    ref,\n    onClick,\n    'aria-expanded': ariaExpanded\n  }: PopoverTriggerRenderProps) {\n    return (\n      <button\n        // biome-ignore lint/suspicious/noExplicitAny: <Not needed>\n        ref={ref as any}\n        type=\"button\"\n        style={styles.trigger}\n        aria-expanded={ariaExpanded}\n        onClick={onClick}\n      >\n        {trigger}\n      </button>\n    )\n  }\n\n  return (\n    <Popover\n      floatingOptions={floatingOptions}\n      trigger={renderTrigger}\n      content={({ close }) => (\n        <Menu\n          depth={0}\n          items={items}\n          onHover={() => {}}\n          width={columnWidth}\n          onSelect={item => handleSelect(item as MenuOption<T>, close)}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"ContextMenu-BTTCFutN.js","names":["floatingOptions: FloatingOptions","DividerRow: React.FC","close"],"sources":["../src/components/commons/toolkit/ContextMenu/components/Menu/components/ItemRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/ItemRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/components/CustomRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/CustomRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/components/DividerRow/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/components/DividerRow/index.tsx","../src/components/commons/toolkit/ContextMenu/components/Menu/styles.ts","../src/components/commons/toolkit/ContextMenu/components/Menu/index.tsx","../src/components/commons/toolkit/ContextMenu/utils/normalizeMenuOptions.ts","../src/components/commons/toolkit/ContextMenu/types.ts","../src/components/commons/toolkit/ContextMenu/styles.ts","../src/components/commons/toolkit/ContextMenu/index.tsx"],"sourcesContent":["// Types\nimport type { ItemRowProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createItemRowStyles<T>({ item, active }: ItemRowProps<T>) {\n  return styled({\n    button: {\n      width: '100%',\n      textAlign: 'left',\n\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: '0.5rem',\n\n      borderRadius: '0.5rem',\n\n      paddingInline: '0.5rem',\n      paddingBlock: '0.25rem',\n\n      userSelect: 'none',\n\n      backgroundColor:\n        item.disabled || active\n          ? 'var(--px-background-card-hover)'\n          : 'transparent',\n\n      __rules: {\n        '&:hover': {\n          transition: 'all 200ms',\n          backgroundColor: 'var(--px-background-card-hover) !important'\n        }\n      }\n    },\n    containerIcon: {\n      width: '1rem',\n      flexShrink: 0,\n      display: 'flex',\n      alignItems: 'center'\n    }\n  })\n}\n","// External Libraries\nimport { useEffect, useRef, useState } from 'react'\n\n// Components\nimport { Menu } from '../..'\nimport { Switch } from '@components/commons/toolkit/Switch'\nimport { Popover } from '@components/commons/toolkit/Popover'\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { ItemRowProps } from './types'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\n\n// Styles\nimport { createItemRowStyles } from './styles'\n\nexport const ItemRow = <T extends string>(props: ItemRowProps<T>) => {\n  const { item, depth, width, onHover, onSelect } = props\n  const isGroup = item.type === 'group'\n\n  const [subOpen, setSubOpen] = useState(false)\n  const closeTimer = useRef<number | null>(null)\n  const anchorRef = useRef<HTMLButtonElement | null>(null)\n  const floatingOptions: FloatingOptions = {\n    offsetX: 10,\n    offsetY: -4,\n    strategy: 'fixed',\n    keepInViewport: true,\n    placement: 'right-start'\n  }\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createItemRowStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.active]\n  })\n\n  // Functions\n  function handleMouseEnter() {\n    onHover(item.id, isGroup)\n\n    if (!isGroup) return\n    clearTimer()\n    setSubOpen(true)\n  }\n\n  function handleMouseLeave() {\n    if (!isGroup) return\n    scheduleClose()\n  }\n\n  function handleClick() {\n    if (isGroup) return\n    onSelect(item)\n  }\n\n  function clearTimer() {\n    if (closeTimer.current) window.clearTimeout(closeTimer.current)\n    closeTimer.current = null\n  }\n\n  function scheduleClose() {\n    clearTimer()\n    closeTimer.current = window.setTimeout(() => setSubOpen(false), 150)\n  }\n\n  function renderMenuType() {\n    if (item.type === 'switch') return <Switch checked={item.checked} />\n    else {\n      return (\n        <>\n          {item.shortcut ? <span>{item.shortcut}</span> : null}\n\n          {isGroup ? <span>›</span> : null}\n        </>\n      )\n    }\n  }\n\n  // UseEffects\n  // biome-ignore lint/correctness/useExhaustiveDependencies: <Not needed>\n  useEffect(() => {\n    return () => clearTimer()\n  }, [])\n\n  return (\n    <>\n      <button\n        ref={anchorRef}\n        type=\"button\"\n        role=\"menuitem\"\n        style={styles.button}\n        className={classes.button}\n        disabled={!!item.disabled}\n        aria-disabled={item.disabled || undefined}\n        onClick={handleClick}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n      >\n        {item.icon ? (\n          <span style={styles.containerIcon}>{item.icon ?? null}</span>\n        ) : null}\n\n        <Typography variant=\"b2\">{item.label}</Typography>\n\n        {renderMenuType()}\n      </button>\n\n      {isGroup ? (\n        <Popover\n          // biome-ignore lint/suspicious/noExplicitAny: <Not needed>\n          anchorRef={anchorRef as any}\n          open={subOpen}\n          closeOnOutsideClick={false}\n          closeOnEscape={false}\n          floatingOptions={floatingOptions}\n          onMouseEnter={() => {\n            clearTimer()\n            setSubOpen(true)\n          }}\n          onMouseLeave={() => {\n            scheduleClose()\n          }}\n          content={() => (\n            <Menu\n              width={width}\n              depth={depth + 1}\n              activeId={undefined}\n              items={item.children}\n              onHover={onHover}\n              onSelect={onSelect}\n            />\n          )}\n          onOpenChange={setSubOpen}\n        />\n      ) : null}\n    </>\n  )\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createCustomRowStyles() {\n  return styled({\n    container: {\n      padding: '0.25rem'\n    }\n  })\n}\n","// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { CustomRowProps } from './types'\n\n// Styles\nimport { createCustomRowStyles } from './styles'\n\nexport const CustomRow = <T extends string>(props: CustomRowProps<T>) => {\n  const { item, close } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createCustomRowStyles)\n\n  return <div style={styles.container}>{item.render({ close })}</div>\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createDividerRowStyles() {\n  return styled({\n    container: {\n      border: 0,\n      display: 'flex',\n      marginBlock: '0.1rem',\n      borderTop: '1px solid var(--px-border-primary)'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createDividerRowStyles } from './styles'\n\nexport const DividerRow: React.FC = props => {\n  // Hooks\n  const { styles } = useThemedStyles(props, createDividerRowStyles)\n\n  return <hr style={styles.container} />\n}\n","// Types\nimport type { MenuProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createMenuStyles<T>({ width }: MenuProps<T>) {\n  return styled({\n    container: {\n      width,\n      flexShrink: 0\n    }\n  })\n}\n","// Components\nimport { ItemRow } from './components/ItemRow'\nimport { CustomRow } from './components/CustomRow'\nimport { DividerRow } from './components/DividerRow'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { MenuProps } from './types'\n\n// Styles\nimport { createMenuStyles } from './styles'\n\nexport const Menu = <T extends string>(props: MenuProps<T>) => {\n  const { items, depth, activeId, width = 240, onHover, onSelect } = props\n\n  const { styles } = useThemedStyles(props, createMenuStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.items, p.width, p.activeId, p.onSelect, p.onHover]\n  })\n\n  // Functions\n  function renderItems() {\n    return items.map(item => {\n      if (item.type === 'divider') return <DividerRow key={item.id} />\n      if (item.type === 'custom')\n        return <CustomRow key={item.id} item={item} close={close} />\n\n      return (\n        <ItemRow\n          key={item.id}\n          item={item}\n          depth={depth}\n          width={width}\n          active={activeId === item.id}\n          onHover={onHover}\n          onSelect={onSelect}\n        />\n      )\n    })\n  }\n\n  return (\n    <div style={styles.container} role={depth === 0 ? 'menu' : undefined}>\n      {renderItems()}\n    </div>\n  )\n}\n","// Types\nimport type { MenuOption, MenuOptionInput } from '../types'\n\nexport function normalizeMenuOptions<T>(\n  options: MenuOptionInput<T>[]\n): MenuOption<T>[] {\n  return options.map(opt => {\n    if ('children' in opt) {\n      return {\n        id: opt.id,\n        label: opt.label,\n        icon: opt.icon,\n        shortcut: opt.shortcut,\n        disabled: opt.disabled,\n        className: opt.className,\n        type: 'group' as const,\n        children: normalizeMenuOptions(opt.children)\n      }\n    }\n    return opt as MenuOption<T>\n  })\n}\n","// External Libraries\nimport type { ReactNode } from 'react'\n\n// Hooks\nimport type { Placement } from '@hooks/useFloating/types'\n\n// Styles\nimport type { createContextMenuStyles } from './styles'\n\ninterface BaseOption<T> {\n  id: T\n  icon?: ReactNode\n  label?: ReactNode\n  disabled?: boolean\n  className?: string\n  shortcut?: ReactNode\n  closeOnSelect?: boolean\n}\n\nexport type MenuActionOption<T> = BaseOption<T> & {\n  type: 'action'\n  closeOnSelect?: boolean\n}\n\nexport type MenuSwitchOption<T> = BaseOption<T> & {\n  type: 'switch'\n  checked: boolean\n  closeOnSelect?: boolean\n  onCheckedChange: (next: boolean) => void\n}\n\nexport interface MenuDividerOption<T> {\n  id: T\n  type: 'divider'\n}\n\nexport interface MenuCustomOption<T> extends BaseOption<T> {\n  type: 'custom'\n  render: (ctx: { close: () => void }) => ReactNode\n}\n\nexport interface MenuGroupInput<T> extends BaseOption<T> {\n  type?: 'group'\n  children: MenuOptionInput<T>[]\n}\n\nexport type MenuOptionInput<T> =\n  | MenuGroupInput<T>\n  | MenuActionOption<T>\n  | MenuSwitchOption<T>\n  | MenuCustomOption<T>\n  | MenuDividerOption<T>\n\nexport interface MenuGroup<T> extends BaseOption<T> {\n  type: 'group'\n  children: MenuOption<T>[]\n}\n\nexport type MenuOption<T> =\n  | MenuGroup<T>\n  | MenuActionOption<T>\n  | MenuSwitchOption<T>\n  | MenuCustomOption<T>\n  | MenuDividerOption<T>\n\nexport interface ContextMenuProps<T> {\n  trigger: ReactNode\n  options: MenuOptionInput<T>[]\n\n  offsetX?: number\n  offsetY?: number\n  columnWidth?: number\n  placement?: Placement\n\n  onSelect: (actionId: T) => void\n\n  styles?: Partial<ReturnType<typeof createContextMenuStyles>>\n}\n","// Types\nimport type { ContextMenuProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createContextMenuStyles<T>(_props: ContextMenuProps<T>) {\n  return styled({\n    trigger: {\n      width: 'fit-content',\n      height: 'fit-content',\n\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      cursor: 'pointer'\n    }\n  })\n}\n","// External Libraries\nimport { useMemo } from 'react'\n\n// Components\nimport { Popover } from '../Popover'\nimport { Menu } from './components/Menu'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Utils\nimport { normalizeMenuOptions } from './utils'\n\n// Types\nimport type { ContextMenuProps, MenuOption } from './types'\nimport type { PopoverTriggerRenderProps } from '../Popover/types'\n\nexport * as T from './types'\n\n// Styles\nimport { createContextMenuStyles } from './styles'\n\nexport const ContextMenu = <T extends string>(props: ContextMenuProps<T>) => {\n  const {\n    trigger,\n    options,\n    offsetX = 0,\n    offsetY = 8,\n    columnWidth = 240,\n    placement = 'bottom-start',\n    onSelect\n  } = props\n\n  const items = useMemo(() => normalizeMenuOptions(options), [options])\n  const floatingOptions = useMemo(\n    () => ({\n      offsetX,\n      offsetY,\n      placement\n    }),\n    [offsetX, offsetY, placement]\n  )\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createContextMenuStyles, {\n    applyCommonProps: true,\n    override: props.styles,\n    pick: p => [p.options, p.columnWidth, p.placement]\n  })\n\n  // Functions\n  function handleSelect(item: MenuOption<T>, close: () => void) {\n    if (item.type === 'action') {\n      onSelect(item.id)\n      if (item.closeOnSelect ?? true) close()\n    }\n\n    if (item.type === 'switch') {\n      item.onCheckedChange(!item.checked)\n      if (item.closeOnSelect ?? false) close()\n    }\n  }\n\n  function renderTrigger({\n    ref,\n    onClick,\n    'aria-expanded': ariaExpanded\n  }: PopoverTriggerRenderProps) {\n    return (\n      <button\n        // biome-ignore lint/suspicious/noExplicitAny: <Not needed>\n        ref={ref as any}\n        type=\"button\"\n        style={styles.trigger}\n        aria-expanded={ariaExpanded}\n        onClick={onClick}\n      >\n        {trigger}\n      </button>\n    )\n  }\n\n  return (\n    <Popover\n      floatingOptions={floatingOptions}\n      trigger={renderTrigger}\n      content={({ close }) => (\n        <Menu\n          depth={0}\n          items={items}\n          onHover={() => {}}\n          width={columnWidth}\n          onSelect={item => handleSelect(item as MenuOption<T>, close)}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":"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"}

package/dist/button.d.ts

@@ -1,3 +1,3 @@
 import "./types-DbQDtnbC.js";
-import { t as Button } from "./index-CzEEfYGt.js";
+import { t as Button } from "./index-9C4mXvTd.js";
 export { Button };

package/dist/context-menu.d.ts

@@ -1,2 +1,2 @@
-import { n as types_d_exports, t as ContextMenu } from "./index-f_SVHVSD.js";
+import { n as types_d_exports, t as ContextMenu } from "./index-CMO76g6X.js";
 export { ContextMenu, types_d_exports as T };

package/dist/context-menu.js

@@ -4,6 +4,6 @@ import "./useDismiss-B13eSwzv.js";
 import "./useFloating-CmbluyFe.js";
 import "./Popover-BupmR_Yj.js";
 import "./Typography-C3d8okRT.js";
-import { n as types_exports, t as ContextMenu } from "./ContextMenu-Csd8aqKT.js";
+import { n as types_exports, t as ContextMenu } from "./ContextMenu-BTTCFutN.js";
 
 export { ContextMenu, types_exports as T };

package/dist/{index-CzEEfYGt.d.ts → index-9C4mXvTd.d.ts}

@@ -1,5 +1,5 @@
 import { i as PaddingProps } from "./styleProps-DUR9j3g2.js";
-import { n as StylesOf } from "./useThemedStyles-Cqb6BuHm.js";
+import { r as TypeStyles } from "./useThemedStyles-Cqb6BuHm.js";
 import { n as TypographyVariant } from "./types-DbQDtnbC.js";
 import React, { MouseEvent, ReactNode } from "react";
 
@@ -60,11 +60,11 @@ interface ButtonProps extends PaddingProps {
   labelVariant?: TypographyVariant;
   /** Size of the button */
   size?: ButtonSize | (string & {});
-  /** Font size of the button label */
-  fontSize?: string;
   /** Icon displayed before the label */
   startIcon?: ReactNode;
-  styles?: StylesOf<typeof createButtonStyles>;
+  /** Font size of the button label */
+  fontSize?: string;
+  styles?: TypeStyles<typeof createButtonStyles>;
   /** Icon displayed after the label */
   endIcon?: ReactNode;
   /**
@@ -116,4 +116,4 @@ interface ButtonProps extends PaddingProps {
 declare const Button: React.FC<ButtonProps>;
 //#endregion
 export { Button as t };
-//# sourceMappingURL=index-CzEEfYGt.d.ts.map
+//# sourceMappingURL=index-9C4mXvTd.d.ts.map

package/dist/{index-f_SVHVSD.d.ts → index-CMO76g6X.d.ts}

@@ -1,6 +1,6 @@
 import { n as Placement } from "./types-BvquWQ1G.js";
 import { ReactNode } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region rolldown:runtime
 //#endregion
@@ -9,6 +9,10 @@ declare function createContextMenuStyles<T>(_props: ContextMenuProps<T>): {
   trigger: {
     width: string;
     height: string;
+    display: "flex";
+    alignItems: "center";
+    justifyContent: "center";
+    cursor: "pointer";
   };
 };
 declare namespace types_d_exports {
@@ -65,7 +69,7 @@ interface ContextMenuProps<T> {
 }
 //#endregion
 //#region src/components/commons/toolkit/ContextMenu/index.d.ts
-declare const ContextMenu: <T extends string>(props: ContextMenuProps<T>) => react_jsx_runtime0.JSX.Element;
+declare const ContextMenu: <T extends string>(props: ContextMenuProps<T>) => react_jsx_runtime1.JSX.Element;
 //#endregion
 export { types_d_exports as n, ContextMenu as t };
-//# sourceMappingURL=index-f_SVHVSD.d.ts.map
+//# sourceMappingURL=index-CMO76g6X.d.ts.map

package/dist/{index-BEYuns0J.d.ts → index-tuCoYmWd.d.ts}

@@ -1,6 +1,6 @@
 import { t as CommonStyleProps } from "./styleProps-DUR9j3g2.js";
 import { ReactNode } from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/TabSwitch/styles.d.ts
 declare function createTabSwitchStyles<T>(props: TabSwitchProps<T>): {
@@ -41,7 +41,7 @@ interface TabSwitchProps<T> extends CommonStyleProps {
 }
 //#endregion
 //#region src/components/commons/toolkit/TabSwitch/index.d.ts
-declare const TabSwitch: <T>(props: TabSwitchProps<T>) => react_jsx_runtime1.JSX.Element;
+declare const TabSwitch: <T>(props: TabSwitchProps<T>) => react_jsx_runtime0.JSX.Element;
 //#endregion
 export { SwitchOption as n, TabSwitchProps as r, TabSwitch as t };
-//# sourceMappingURL=index-BEYuns0J.d.ts.map
+//# sourceMappingURL=index-tuCoYmWd.d.ts.map

package/dist/index.d.ts

@@ -1,6 +1,6 @@
-import { n as types_d_exports, t as ContextMenu } from "./index-f_SVHVSD.js";
+import { n as types_d_exports, t as ContextMenu } from "./index-CMO76g6X.js";
 import "./types-DbQDtnbC.js";
-import { t as Button } from "./index-CzEEfYGt.js";
+import { t as Button } from "./index-9C4mXvTd.js";
 import { t as IconButton } from "./index-Ca7r_UeJ.js";
 import { t as Input } from "./index-Bcu8I591.js";
 import { t as TextArea } from "./index-C7Mip6Lj.js";
@@ -9,7 +9,7 @@ import { t as Checkbox } from "./index-OWMf00jk.js";
 import { InfoSummary, InfoSummaryItem, InfoSummaryProps } from "./info-summary.js";
 import { t as Popover } from "./index-Dd5yjyJK.js";
 import { t as Switch } from "./index-DewFmT68.js";
-import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-BEYuns0J.js";
+import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-tuCoYmWd.js";
 import { Typography } from "./typography.js";
 import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-CCiP7SPG.js";
 import { useDismiss } from "./use-dismiss.js";

package/dist/index.js

@@ -10,7 +10,7 @@ import { n as useTheme, t as ThemeProvider } from "./ThemeContext-C4vgT3aV.js";
 import { t as TabSwitch } from "./TabSwitch-CPf5sVyP.js";
 import { t as CheckItem } from "./CheckItem-DibKGIhC.js";
 import { t as InfoSummary } from "./InfoSummary-BsAWbXEg.js";
-import { n as types_exports, t as ContextMenu } from "./ContextMenu-Csd8aqKT.js";
+import { n as types_exports, t as ContextMenu } from "./ContextMenu-BTTCFutN.js";
 import { t as Button } from "./Button-4H6aUA5C.js";
 import { t as IconButton } from "./IconButton-CdC3tmC8.js";
 import "./Label-BF8xMYbk.js";

package/dist/tab-switch.d.ts

@@ -1,2 +1,2 @@
-import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-BEYuns0J.js";
+import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-tuCoYmWd.js";
 export { SwitchOption, TabSwitch, TabSwitchProps };

package/dist/typography.d.ts

@@ -1,8 +1,8 @@
 import { t as TypographyProps } from "./types-DbQDtnbC.js";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/Typography/index.d.ts
-declare function Typography(props: TypographyProps): react_jsx_runtime2.JSX.Element;
+declare function Typography(props: TypographyProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { Typography };
 //# sourceMappingURL=typography.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "softable-pixels-web",
-  "version": "1.1.11",
+  "version": "1.1.13",
   "description": "",
   "keywords": [],
   "author": "softable",