{
  "version": 3,
  "sources": ["../../../../../src/lib/ui/components/StylePanel/DefaultStylePanel.tsx"],
  "sourcesContent": ["import {\n\tReadonlySharedStyleMap,\n\tuseEditor,\n\tusePassThroughWheelEvents,\n\tuseValue,\n} from '@tldraw/editor'\nimport classNames from 'classnames'\nimport { ReactNode, memo, useEffect, useRef } from 'react'\nimport { useRelevantStyles } from '../../hooks/useRelevantStyles'\nimport { DefaultStylePanelContent } from './DefaultStylePanelContent'\nimport { StylePanelContextProvider } from './StylePanelContext'\n\n/** @public */\nexport interface TLUiStylePanelProps {\n\tisMobile?: boolean\n\tstyles?: ReadonlySharedStyleMap | null\n\tchildren?: ReactNode\n}\n\n/** @public @react */\nexport const DefaultStylePanel = memo(function DefaultStylePanel({\n\tisMobile,\n\tstyles,\n\tchildren,\n}: TLUiStylePanelProps) {\n\tconst editor = useEditor()\n\tconst enhancedA11yMode = useValue('enhancedA11yMode', () => editor.user.getEnhancedA11yMode(), [\n\t\teditor,\n\t])\n\n\tconst ref = useRef<HTMLDivElement>(null)\n\tusePassThroughWheelEvents(ref)\n\n\tconst defaultStyles = useRelevantStyles()\n\tif (styles === undefined) {\n\t\tstyles = defaultStyles\n\t}\n\n\tuseEffect(() => {\n\t\tconst elm = ref.current as HTMLDivElement | null\n\t\tif (!elm) return\n\n\t\tfunction handlePointerMove(event: PointerEvent) {\n\t\t\t// Mark the event as handled so the canvas's pointermove listener\n\t\t\t// (on document.body) ignores it. We use markEventAsHandled instead\n\t\t\t// of stopPropagation to avoid interfering with Radix UI's internal\n\t\t\t// pointer capture handling, which breaks slider drags on Safari.\n\t\t\teditor.markEventAsHandled(event)\n\t\t}\n\n\t\tfunction handleKeyDown(event: KeyboardEvent) {\n\t\t\tif (\n\t\t\t\tevent.key === 'Escape' &&\n\t\t\t\tref.current?.contains(editor.getContainerDocument().activeElement)\n\t\t\t) {\n\t\t\t\tevent.stopPropagation()\n\t\t\t\teditor.getContainer().focus()\n\t\t\t}\n\t\t}\n\n\t\telm.addEventListener('pointermove', handlePointerMove)\n\t\telm.addEventListener('keydown', handleKeyDown, { capture: true })\n\t\treturn () => {\n\t\t\telm.removeEventListener('pointermove', handlePointerMove)\n\t\t\telm.removeEventListener('keydown', handleKeyDown, { capture: true })\n\t\t}\n\t}, [editor])\n\n\treturn (\n\t\tstyles && (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-testid=\"style.panel\"\n\t\t\t\tclassName={classNames('tlui-style-panel', { 'tlui-style-panel__wrapper': !isMobile })}\n\t\t\t\tdata-ismobile={isMobile}\n\t\t\t\tdata-enhanced-a11y-mode={enhancedA11yMode}\n\t\t\t>\n\t\t\t\t<StylePanelContextProvider styles={styles}>\n\t\t\t\t\t{children ?? <DefaultStylePanelContent />}\n\t\t\t\t</StylePanelContextProvider>\n\t\t\t</div>\n\t\t)\n\t)\n})\n"],
  "mappings": "AA8EkB;AA9ElB;AAAA,EAEC;AAAA,EACA;AAAA,EACA;AAAA,OACM;AACP,OAAO,gBAAgB;AACvB,SAAoB,MAAM,WAAW,cAAc;AACnD,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AACzC,SAAS,iCAAiC;AAUnC,MAAM,oBAAoB,KAAK,SAASA,mBAAkB;AAAA,EAChE;AAAA,EACA;AAAA,EACA;AACD,GAAwB;AACvB,QAAM,SAAS,UAAU;AACzB,QAAM,mBAAmB,SAAS,oBAAoB,MAAM,OAAO,KAAK,oBAAoB,GAAG;AAAA,IAC9F;AAAA,EACD,CAAC;AAED,QAAM,MAAM,OAAuB,IAAI;AACvC,4BAA0B,GAAG;AAE7B,QAAM,gBAAgB,kBAAkB;AACxC,MAAI,WAAW,QAAW;AACzB,aAAS;AAAA,EACV;AAEA,YAAU,MAAM;AACf,UAAM,MAAM,IAAI;AAChB,QAAI,CAAC,IAAK;AAEV,aAAS,kBAAkB,OAAqB;AAK/C,aAAO,mBAAmB,KAAK;AAAA,IAChC;AAEA,aAAS,cAAc,OAAsB;AAC5C,UACC,MAAM,QAAQ,YACd,IAAI,SAAS,SAAS,OAAO,qBAAqB,EAAE,aAAa,GAChE;AACD,cAAM,gBAAgB;AACtB,eAAO,aAAa,EAAE,MAAM;AAAA,MAC7B;AAAA,IACD;AAEA,QAAI,iBAAiB,eAAe,iBAAiB;AACrD,QAAI,iBAAiB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AAChE,WAAO,MAAM;AACZ,UAAI,oBAAoB,eAAe,iBAAiB;AACxD,UAAI,oBAAoB,WAAW,eAAe,EAAE,SAAS,KAAK,CAAC;AAAA,IACpE;AAAA,EACD,GAAG,CAAC,MAAM,CAAC;AAEX,SACC,UACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,eAAY;AAAA,MACZ,WAAW,WAAW,oBAAoB,EAAE,6BAA6B,CAAC,SAAS,CAAC;AAAA,MACpF,iBAAe;AAAA,MACf,2BAAyB;AAAA,MAEzB,8BAAC,6BAA0B,QACzB,sBAAY,oBAAC,4BAAyB,GACxC;AAAA;AAAA,EACD;AAGH,CAAC;",
  "names": ["DefaultStylePanel"]
}