{
  "version": 3,
  "sources": ["../../../../../src/lib/ui/components/primitives/layout.tsx"],
  "sourcesContent": ["import classNames from 'classnames'\nimport { Slot } from 'radix-ui'\nimport { HTMLAttributes, ReactNode, createContext, forwardRef, useContext } from 'react'\n\n/** @public */\nexport interface TldrawUiOrientationContext {\n\torientation: 'horizontal' | 'vertical'\n\ttooltipSide: 'top' | 'right' | 'bottom' | 'left'\n}\n\nconst TldrawUiOrientationContext = createContext<TldrawUiOrientationContext>({\n\torientation: 'horizontal',\n\ttooltipSide: 'bottom',\n})\n\n/** @public */\nexport interface TldrawUiOrientationProviderProps {\n\tchildren: ReactNode\n\torientation: 'horizontal' | 'vertical'\n\ttooltipSide?: 'top' | 'right' | 'bottom' | 'left'\n}\n/** @public @react */\nexport function TldrawUiOrientationProvider({\n\tchildren,\n\torientation,\n\ttooltipSide,\n}: TldrawUiOrientationProviderProps) {\n\tconst prevContext = useTldrawUiOrientation()\n\t// generally, we want tooltip side to cascade down through the layout - apart from when the\n\t// orientation changes. If the tooltip side is \"bottom\", and then I include some vertical layout\n\t// elements, keeping the tooltip side as bottom will cause the tooltip to overlap elements\n\t// stacked on top of each other. In the absence of a tooltip side, we pick a default side based\n\t// on the orientation whenever the orientation changes.\n\tconst tooltipSideToUse =\n\t\ttooltipSide ??\n\t\t(orientation === prevContext.orientation\n\t\t\t? prevContext.tooltipSide\n\t\t\t: orientation === 'horizontal'\n\t\t\t\t? 'bottom'\n\t\t\t\t: 'right')\n\n\treturn (\n\t\t<TldrawUiOrientationContext.Provider value={{ orientation, tooltipSide: tooltipSideToUse }}>\n\t\t\t{children}\n\t\t</TldrawUiOrientationContext.Provider>\n\t)\n}\n\n/** @public */\nexport function useTldrawUiOrientation() {\n\treturn useContext(TldrawUiOrientationContext)\n}\n\n/** @public */\nexport interface TLUiLayoutProps extends HTMLAttributes<HTMLDivElement> {\n\tchildren: ReactNode\n\ttooltipSide?: 'top' | 'right' | 'bottom' | 'left'\n\tasChild?: boolean\n}\n\nfunction createLayout(\n\tdisplayName: string,\n\torientation: 'horizontal' | 'vertical',\n\tlayoutClassName: string\n) {\n\tconst Layout = forwardRef<HTMLDivElement, TLUiLayoutProps>(\n\t\t({ asChild, className, tooltipSide, ...props }, ref) => {\n\t\t\tconst Component = asChild ? Slot.Root : 'div'\n\t\t\treturn (\n\t\t\t\t<TldrawUiOrientationProvider orientation={orientation} tooltipSide={tooltipSide}>\n\t\t\t\t\t<Component ref={ref} className={classNames(layoutClassName, className)} {...props} />\n\t\t\t\t</TldrawUiOrientationProvider>\n\t\t\t)\n\t\t}\n\t)\n\tLayout.displayName = displayName\n\treturn Layout\n}\n\n/**\n * A row, usually of UI controls like buttons, select dropdown, checkboxes, etc.\n *\n * @public @react\n */\nexport const TldrawUiRow = createLayout('TldrawUiRow', 'horizontal', 'tlui-row')\n\n/**\n * A column, usually of UI controls like buttons, select dropdown, checkboxes, etc.\n *\n * @public @react\n */\nexport const TldrawUiColumn = createLayout('TldrawUiColumn', 'vertical', 'tlui-column')\n\n/**\n * A tight grid 4 elements wide, usually of UI controls like buttons, select dropdown, checkboxes,\n * etc.\n *\n * @public @react */\nexport const TldrawUiGrid = createLayout('TldrawUiGrid', 'horizontal', 'tlui-grid')\n"],
  "mappings": "AA0CE;AA1CF,OAAO,gBAAgB;AACvB,SAAS,YAAY;AACrB,SAAoC,eAAe,YAAY,kBAAkB;AAQjF,MAAM,6BAA6B,cAA0C;AAAA,EAC5E,aAAa;AAAA,EACb,aAAa;AACd,CAAC;AASM,SAAS,4BAA4B;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AACD,GAAqC;AACpC,QAAM,cAAc,uBAAuB;AAM3C,QAAM,mBACL,gBACC,gBAAgB,YAAY,cAC1B,YAAY,cACZ,gBAAgB,eACf,WACA;AAEL,SACC,oBAAC,2BAA2B,UAA3B,EAAoC,OAAO,EAAE,aAAa,aAAa,iBAAiB,GACvF,UACF;AAEF;AAGO,SAAS,yBAAyB;AACxC,SAAO,WAAW,0BAA0B;AAC7C;AASA,SAAS,aACR,aACA,aACA,iBACC;AACD,QAAM,SAAS;AAAA,IACd,CAAC,EAAE,SAAS,WAAW,aAAa,GAAG,MAAM,GAAG,QAAQ;AACvD,YAAM,YAAY,UAAU,KAAK,OAAO;AACxC,aACC,oBAAC,+BAA4B,aAA0B,aACtD,8BAAC,aAAU,KAAU,WAAW,WAAW,iBAAiB,SAAS,GAAI,GAAG,OAAO,GACpF;AAAA,IAEF;AAAA,EACD;AACA,SAAO,cAAc;AACrB,SAAO;AACR;AAOO,MAAM,cAAc,aAAa,eAAe,cAAc,UAAU;AAOxE,MAAM,iBAAiB,aAAa,kBAAkB,YAAY,aAAa;AAO/E,MAAM,eAAe,aAAa,gBAAgB,cAAc,WAAW;",
  "names": []
}
