tldraw/dist-esm/lib/ui/components/StylePanel/DropdownPicker.mjs.map

A tiny little drawing editor.

{
  "version": 3,
  "sources": ["../../../../../src/lib/ui/components/StylePanel/DropdownPicker.tsx"],
  "sourcesContent": ["import { SharedStyle, StyleProp, useEditor } from '@tldraw/editor'\nimport * as React from 'react'\nimport { StyleValuesForUi } from '../../../styles'\nimport { TLUiTranslationKey } from '../../hooks/useTranslation/TLUiTranslationKey'\nimport { useTranslation } from '../../hooks/useTranslation/useTranslation'\nimport { TLUiIconType } from '../../icon-types'\nimport { TLUiButtonProps, TldrawUiButton } from '../primitives/Button/TldrawUiButton'\nimport { TldrawUiButtonIcon } from '../primitives/Button/TldrawUiButtonIcon'\nimport { TldrawUiButtonLabel } from '../primitives/Button/TldrawUiButtonLabel'\nimport {\n\tTldrawUiDropdownMenuContent,\n\tTldrawUiDropdownMenuItem,\n\tTldrawUiDropdownMenuRoot,\n\tTldrawUiDropdownMenuTrigger,\n} from '../primitives/TldrawUiDropdownMenu'\n\ninterface DropdownPickerProps<T extends string> {\n\tid: string\n\tlabel?: TLUiTranslationKey | Exclude<string, TLUiTranslationKey>\n\tuiType: string\n\tstylePanelType: string\n\tstyle: StyleProp<T>\n\tvalue: SharedStyle<T>\n\titems: StyleValuesForUi<T>\n\ttype: TLUiButtonProps['type']\n\tonValueChange(style: StyleProp<T>, value: T): void\n}\n\nfunction DropdownPickerInner<T extends string>({\n\tid,\n\tlabel,\n\tuiType,\n\tstylePanelType,\n\tstyle,\n\titems,\n\ttype,\n\tvalue,\n\tonValueChange,\n}: DropdownPickerProps<T>) {\n\tconst msg = useTranslation()\n\tconst editor = useEditor()\n\n\tconst icon = React.useMemo(\n\t\t() => items.find((item) => value.type === 'shared' && item.value === value.value)?.icon,\n\t\t[items, value]\n\t)\n\n\tconst stylePanelName = msg(`style-panel.${stylePanelType}` as TLUiTranslationKey)\n\n\tconst titleStr =\n\t\tvalue.type === 'mixed'\n\t\t\t? msg('style-panel.mixed')\n\t\t\t: stylePanelName + ' \u2014 ' + msg(`${uiType}-style.${value.value}` as TLUiTranslationKey)\n\tconst labelStr = label ? msg(label) : ''\n\n\treturn (\n\t\t<TldrawUiDropdownMenuRoot id={`style panel ${id}`}>\n\t\t\t<TldrawUiDropdownMenuTrigger>\n\t\t\t\t<TldrawUiButton type={type} data-testid={`style.${uiType}`} title={titleStr}>\n\t\t\t\t\t{labelStr && <TldrawUiButtonLabel>{labelStr}</TldrawUiButtonLabel>}\n\t\t\t\t\t<TldrawUiButtonIcon icon={(icon as TLUiIconType) ?? 'mixed'} />\n\t\t\t\t</TldrawUiButton>\n\t\t\t</TldrawUiDropdownMenuTrigger>\n\t\t\t<TldrawUiDropdownMenuContent side=\"left\" align=\"center\" alignOffset={0}>\n\t\t\t\t<div className=\"tlui-buttons__grid\">\n\t\t\t\t\t{items.map((item) => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<TldrawUiDropdownMenuItem key={item.value}>\n\t\t\t\t\t\t\t\t<TldrawUiButton\n\t\t\t\t\t\t\t\t\ttype=\"icon\"\n\t\t\t\t\t\t\t\t\tdata-testid={`style.${uiType}.${item.value}`}\n\t\t\t\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\t\t\t\tstylePanelName +\n\t\t\t\t\t\t\t\t\t\t' \u2014 ' +\n\t\t\t\t\t\t\t\t\t\tmsg(`${uiType}-style.${item.value}` as TLUiTranslationKey)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\teditor.markHistoryStoppingPoint('select style dropdown item')\n\t\t\t\t\t\t\t\t\t\tonValueChange(style, item.value)\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<TldrawUiButtonIcon icon={item.icon} />\n\t\t\t\t\t\t\t\t</TldrawUiButton>\n\t\t\t\t\t\t\t</TldrawUiDropdownMenuItem>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</div>\n\t\t\t</TldrawUiDropdownMenuContent>\n\t\t</TldrawUiDropdownMenuRoot>\n\t)\n}\n\n// need to export like this to get generics\nexport const DropdownPicker = React.memo(DropdownPickerInner) as typeof DropdownPickerInner\n"],
  "mappings": "AA0DI,SACc,KADd;AA1DJ,SAAiC,iBAAiB;AAClD,YAAY,WAAW;AAGvB,SAAS,sBAAsB;AAE/B,SAA0B,sBAAsB;AAChD,SAAS,0BAA0B;AACnC,SAAS,2BAA2B;AACpC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACM;AAcP,SAAS,oBAAsC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA2B;AAC1B,QAAM,MAAM,eAAe;AAC3B,QAAM,SAAS,UAAU;AAEzB,QAAM,OAAO,MAAM;AAAA,IAClB,MAAM,MAAM,KAAK,CAAC,SAAS,MAAM,SAAS,YAAY,KAAK,UAAU,MAAM,KAAK,GAAG;AAAA,IACnF,CAAC,OAAO,KAAK;AAAA,EACd;AAEA,QAAM,iBAAiB,IAAI,eAAe,cAAc,EAAwB;AAEhF,QAAM,WACL,MAAM,SAAS,UACZ,IAAI,mBAAmB,IACvB,iBAAiB,aAAQ,IAAI,GAAG,MAAM,UAAU,MAAM,KAAK,EAAwB;AACvF,QAAM,WAAW,QAAQ,IAAI,KAAK,IAAI;AAEtC,SACC,qBAAC,4BAAyB,IAAI,eAAe,EAAE,IAC9C;AAAA,wBAAC,+BACA,+BAAC,kBAAe,MAAY,eAAa,SAAS,MAAM,IAAI,OAAO,UACjE;AAAA,kBAAY,oBAAC,uBAAqB,oBAAS;AAAA,MAC5C,oBAAC,sBAAmB,MAAO,QAAyB,SAAS;AAAA,OAC9D,GACD;AAAA,IACA,oBAAC,+BAA4B,MAAK,QAAO,OAAM,UAAS,aAAa,GACpE,8BAAC,SAAI,WAAU,sBACb,gBAAM,IAAI,CAAC,SAAS;AACpB,aACC,oBAAC,4BACA;AAAA,QAAC;AAAA;AAAA,UACA,MAAK;AAAA,UACL,eAAa,SAAS,MAAM,IAAI,KAAK,KAAK;AAAA,UAC1C,OACC,iBACA,aACA,IAAI,GAAG,MAAM,UAAU,KAAK,KAAK,EAAwB;AAAA,UAE1D,SAAS,MAAM;AACd,mBAAO,yBAAyB,4BAA4B;AAC5D,0BAAc,OAAO,KAAK,KAAK;AAAA,UAChC;AAAA,UAEA,8BAAC,sBAAmB,MAAM,KAAK,MAAM;AAAA;AAAA,MACtC,KAf8B,KAAK,KAgBpC;AAAA,IAEF,CAAC,GACF,GACD;AAAA,KACD;AAEF;AAGO,MAAM,iBAAiB,MAAM,KAAK,mBAAmB;",
  "names": []
}