{
  "version": 3,
  "sources": ["../../../../../src/lib/shapes/arrow/components/ArrowTextLabel.tsx"],
  "sourcesContent": ["import { TLArrowShape, TLShapeId, VecLike, stopEventPropagation } from '@tldraw/editor'\nimport * as React from 'react'\nimport { TextHelpers } from '../../shared/TextHelpers'\nimport { ARROW_LABEL_FONT_SIZES, TEXT_PROPS } from '../../shared/default-shape-constants'\nimport { useEditableText } from '../../shared/useEditableText'\n\nexport const ArrowTextLabel = React.memo(function ArrowTextLabel({\n\tid,\n\ttext,\n\tsize,\n\tfont,\n\tposition,\n\twidth,\n\tlabelColor,\n}: { id: TLShapeId; position: VecLike; width?: number; labelColor: string } & Pick<\n\tTLArrowShape['props'],\n\t'text' | 'size' | 'font'\n>) {\n\tconst {\n\t\trInput,\n\t\tisEditing,\n\t\thandleFocus,\n\t\thandleBlur,\n\t\thandleKeyDown,\n\t\thandleChange,\n\t\tisEmpty,\n\t\thandleInputPointerDown,\n\t\thandleDoubleClick,\n\t} = useEditableText(id, 'arrow', text)\n\n\tconst finalText = TextHelpers.normalizeTextForDom(text)\n\tconst hasText = finalText.trim().length > 0\n\n\tif (!isEditing && !hasText) {\n\t\treturn null\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"tl-arrow-label\"\n\t\t\tdata-font={font}\n\t\t\tdata-align={'center'}\n\t\t\tdata-hastext={!isEmpty}\n\t\t\tdata-isediting={isEditing}\n\t\t\tstyle={{\n\t\t\t\ttextAlign: 'center',\n\t\t\t\tfontSize: ARROW_LABEL_FONT_SIZES[size],\n\t\t\t\tlineHeight: ARROW_LABEL_FONT_SIZES[size] * TEXT_PROPS.lineHeight + 'px',\n\t\t\t\ttransform: `translate(${position.x}px, ${position.y}px)`,\n\t\t\t\tcolor: labelColor,\n\t\t\t}}\n\t\t>\n\t\t\t<div className=\"tl-arrow-label__inner\">\n\t\t\t\t<p style={{ width: width ? width : '9px' }}>\n\t\t\t\t\t{text ? TextHelpers.normalizeTextForDom(text) : ' '}\n\t\t\t\t</p>\n\t\t\t\t{isEditing && (\n\t\t\t\t\t// Consider replacing with content-editable\n\t\t\t\t\t<textarea\n\t\t\t\t\t\tref={rInput}\n\t\t\t\t\t\tclassName=\"tl-text tl-text-input\"\n\t\t\t\t\t\tname=\"text\"\n\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\tautoComplete=\"false\"\n\t\t\t\t\t\tautoCapitalize=\"false\"\n\t\t\t\t\t\tautoCorrect=\"false\"\n\t\t\t\t\t\tautoSave=\"false\"\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tplaceholder=\"\"\n\t\t\t\t\t\tspellCheck=\"true\"\n\t\t\t\t\t\twrap=\"off\"\n\t\t\t\t\t\tdir=\"auto\"\n\t\t\t\t\t\tdatatype=\"wysiwyg\"\n\t\t\t\t\t\tdefaultValue={text}\n\t\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\t\tonContextMenu={stopEventPropagation}\n\t\t\t\t\t\tonPointerDown={handleInputPointerDown}\n\t\t\t\t\t\tonDoubleClick={handleDoubleClick}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t)\n})\n"],
  "mappings": "AAoDG,SACC,KADD;AApDH,SAA2C,4BAA4B;AACvE,YAAY,WAAW;AACvB,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB,kBAAkB;AACnD,SAAS,uBAAuB;AAEzB,MAAM,iBAAiB,MAAM,KAAK,SAASA,gBAAe;AAAA,EAChE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAGG;AACF,QAAM;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,IAAI,gBAAgB,IAAI,SAAS,IAAI;AAErC,QAAM,YAAY,YAAY,oBAAoB,IAAI;AACtD,QAAM,UAAU,UAAU,KAAK,EAAE,SAAS;AAE1C,MAAI,CAAC,aAAa,CAAC,SAAS;AAC3B,WAAO;AAAA,EACR;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAU;AAAA,MACV,aAAW;AAAA,MACX,cAAY;AAAA,MACZ,gBAAc,CAAC;AAAA,MACf,kBAAgB;AAAA,MAChB,OAAO;AAAA,QACN,WAAW;AAAA,QACX,UAAU,uBAAuB,IAAI;AAAA,QACrC,YAAY,uBAAuB,IAAI,IAAI,WAAW,aAAa;AAAA,QACnE,WAAW,aAAa,SAAS,CAAC,OAAO,SAAS,CAAC;AAAA,QACnD,OAAO;AAAA,MACR;AAAA,MAEA,+BAAC,SAAI,WAAU,yBACd;AAAA,4BAAC,OAAE,OAAO,EAAE,OAAO,QAAQ,QAAQ,MAAM,GACvC,iBAAO,YAAY,oBAAoB,IAAI,IAAI,KACjD;AAAA,QACC;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACA,KAAK;AAAA,YACL,WAAU;AAAA,YACV,MAAK;AAAA,YACL,UAAU;AAAA,YACV,cAAa;AAAA,YACb,gBAAe;AAAA,YACf,aAAY;AAAA,YACZ,UAAS;AAAA,YACT,WAAS;AAAA,YACT,aAAY;AAAA,YACZ,YAAW;AAAA,YACX,MAAK;AAAA,YACL,KAAI;AAAA,YACJ,UAAS;AAAA,YACT,cAAc;AAAA,YACd,SAAS;AAAA,YACT,UAAU;AAAA,YACV,WAAW;AAAA,YACX,QAAQ;AAAA,YACR,eAAe;AAAA,YACf,eAAe;AAAA,YACf,eAAe;AAAA;AAAA,QAChB;AAAA,SAEF;AAAA;AAAA,EACD;AAEF,CAAC;",
  "names": ["ArrowTextLabel"]
}