@cambly/syntax-core 10.16.0 → 10.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Avatar/Avatar.cjs +3 -3
- package/dist/Avatar/Avatar.css +21 -13
- package/dist/Avatar/Avatar.css.map +1 -1
- package/dist/Avatar/Avatar.d.ts +2 -1
- package/dist/Avatar/Avatar.js +2 -2
- package/dist/AvatarGroup/AvatarGroup.cjs +2 -2
- package/dist/AvatarGroup/AvatarGroup.d.ts +2 -1
- package/dist/AvatarGroup/AvatarGroup.js +1 -1
- package/dist/Badge/Badge.cjs +3 -3
- package/dist/Badge/Badge.css +49 -48
- package/dist/Badge/Badge.css.map +1 -1
- package/dist/Badge/Badge.js +2 -2
- package/dist/Button/Button.cjs +3 -3
- package/dist/Button/Button.css +49 -48
- package/dist/Button/Button.css.map +1 -1
- package/dist/Button/Button.d.ts +0 -2
- package/dist/Button/Button.js +2 -2
- package/dist/Checkbox/Checkbox.cjs +3 -3
- package/dist/Checkbox/Checkbox.css +72 -65
- package/dist/Checkbox/Checkbox.css.map +1 -1
- package/dist/Checkbox/Checkbox.js +2 -2
- package/dist/Chip/Chip.cjs +3 -3
- package/dist/Chip/Chip.css +49 -48
- package/dist/Chip/Chip.css.map +1 -1
- package/dist/Chip/Chip.js +2 -2
- package/dist/Dialog/Dialog.cjs +3 -2
- package/dist/Dialog/Dialog.js +2 -1
- package/dist/Dialog/ModalDialog.cjs +3 -3
- package/dist/Dialog/ModalDialog.js +2 -2
- package/dist/Heading/Heading.cjs +3 -3
- package/dist/Heading/Heading.css +49 -48
- package/dist/Heading/Heading.css.map +1 -1
- package/dist/Heading/Heading.js +2 -2
- package/dist/LinkButton/LinkButton.cjs +3 -3
- package/dist/LinkButton/LinkButton.css +49 -48
- package/dist/LinkButton/LinkButton.css.map +1 -1
- package/dist/LinkButton/LinkButton.js +2 -2
- package/dist/Modal/Modal.cjs +4 -4
- package/dist/Modal/Modal.css +49 -48
- package/dist/Modal/Modal.css.map +1 -1
- package/dist/Modal/Modal.d.ts +5 -1
- package/dist/Modal/Modal.js +3 -3
- package/dist/Popover/Popover.cjs +4 -4
- package/dist/Popover/Popover.js +3 -3
- package/dist/RadioButton/RadioButton.cjs +3 -3
- package/dist/RadioButton/RadioButton.css +49 -48
- package/dist/RadioButton/RadioButton.css.map +1 -1
- package/dist/RadioButton/RadioButton.js +2 -2
- package/dist/RichSelect/RichSelectBox.cjs +9 -9
- package/dist/RichSelect/RichSelectBox.css +49 -48
- package/dist/RichSelect/RichSelectBox.css.map +1 -1
- package/dist/RichSelect/RichSelectBox.js +8 -8
- package/dist/RichSelect/RichSelectChip.cjs +4 -4
- package/dist/RichSelect/RichSelectChip.css +49 -48
- package/dist/RichSelect/RichSelectChip.css.map +1 -1
- package/dist/RichSelect/RichSelectChip.js +3 -3
- package/dist/RichSelect/RichSelectList.cjs +14 -14
- package/dist/RichSelect/RichSelectList.css +67 -76
- package/dist/RichSelect/RichSelectList.css.map +1 -1
- package/dist/RichSelect/RichSelectList.js +13 -13
- package/dist/RichSelect/RichSelectRadioButton.cjs +4 -4
- package/dist/RichSelect/RichSelectRadioButton.css +49 -48
- package/dist/RichSelect/RichSelectRadioButton.css.map +1 -1
- package/dist/RichSelect/RichSelectRadioButton.js +3 -3
- package/dist/RichSelect/RichSelectSection.cjs +3 -3
- package/dist/RichSelect/RichSelectSection.css +49 -48
- package/dist/RichSelect/RichSelectSection.css.map +1 -1
- package/dist/RichSelect/RichSelectSection.js +2 -2
- package/dist/SelectList/SelectList.cjs +4 -4
- package/dist/SelectList/SelectList.css +67 -76
- package/dist/SelectList/SelectList.css.map +1 -1
- package/dist/SelectList/SelectList.js +3 -3
- package/dist/TextArea/TextArea.cjs +3 -3
- package/dist/TextArea/TextArea.css +76 -97
- package/dist/TextArea/TextArea.css.map +1 -1
- package/dist/TextArea/TextArea.js +2 -2
- package/dist/TextField/TextField.cjs +3 -3
- package/dist/TextField/TextField.css +69 -85
- package/dist/TextField/TextField.css.map +1 -1
- package/dist/TextField/TextField.js +2 -2
- package/dist/Tooltip/Tooltip.cjs +3 -3
- package/dist/Tooltip/Tooltip.css +49 -48
- package/dist/Tooltip/Tooltip.css.map +1 -1
- package/dist/Tooltip/Tooltip.js +2 -2
- package/dist/Typography/Typography.cjs +2 -2
- package/dist/Typography/Typography.css +49 -48
- package/dist/Typography/Typography.css.map +1 -1
- package/dist/Typography/Typography.js +1 -1
- package/dist/__chunks/{WASW7BJX.js → 22W7JX3C.js} +3 -2
- package/dist/__chunks/{WASW7BJX.js.map → 22W7JX3C.js.map} +1 -1
- package/dist/__chunks/{M3US55ZU.js → 2RIIE7CU.js} +2 -2
- package/dist/__chunks/{M3US55ZU.js.map → 2RIIE7CU.js.map} +1 -1
- package/dist/__chunks/{5L6ZVKXY.cjs → 364LH7BQ.cjs} +9 -6
- package/dist/__chunks/364LH7BQ.cjs.map +1 -0
- package/dist/__chunks/{LME64WQ5.js → 4K4SF7RI.js} +2 -2
- package/dist/__chunks/{A5O4QH7P.js → 4LCJJZPI.js} +3 -3
- package/dist/__chunks/{EBKE2QMG.cjs → 4U2YGWTW.cjs} +5 -5
- package/dist/__chunks/4U2YGWTW.cjs.map +1 -0
- package/dist/__chunks/{VL5ONCQD.cjs → 577X7X3J.cjs} +6 -2
- package/dist/__chunks/577X7X3J.cjs.map +1 -0
- package/dist/__chunks/{WTVLR5TH.js → 5ODCKBUB.js} +6 -17
- package/dist/__chunks/5ODCKBUB.js.map +1 -0
- package/dist/__chunks/{7OYM5HJI.cjs → 635VMAFB.cjs} +9 -6
- package/dist/__chunks/635VMAFB.cjs.map +1 -0
- package/dist/__chunks/{ADHTE22D.cjs → 762IDERQ.cjs} +3 -3
- package/dist/__chunks/{MHXIUSQ6.js → 7NE5Y7AO.js} +8 -5
- package/dist/__chunks/7NE5Y7AO.js.map +1 -0
- package/dist/__chunks/{KG2M6SNT.js → 7VMMLAGL.js} +10 -10
- package/dist/__chunks/{KG2M6SNT.js.map → 7VMMLAGL.js.map} +1 -1
- package/dist/__chunks/{WRMF47QN.cjs → AL4ECXRL.cjs} +9 -5
- package/dist/__chunks/AL4ECXRL.cjs.map +1 -0
- package/dist/__chunks/{Q3GQP4AU.cjs → AOKSJPV6.cjs} +1 -1
- package/dist/__chunks/{Q3GQP4AU.cjs.map → AOKSJPV6.cjs.map} +1 -1
- package/dist/__chunks/{HPXOG4FB.js → BA5NNKNL.js} +2 -2
- package/dist/__chunks/{7K5BKF5X.cjs → CYMLBKRU.cjs} +5 -5
- package/dist/__chunks/{KHZ4ITXI.cjs → DC7G3PCP.cjs} +20 -11
- package/dist/__chunks/DC7G3PCP.cjs.map +1 -0
- package/dist/__chunks/{AREAWDHD.js → DUANKQDU.js} +19 -10
- package/dist/__chunks/DUANKQDU.js.map +1 -0
- package/dist/__chunks/DV73RCNK.cjs +104 -0
- package/dist/__chunks/DV73RCNK.cjs.map +1 -0
- package/dist/__chunks/{A7AAGKC2.js → E5L5ZBOW.js} +6 -2
- package/dist/__chunks/E5L5ZBOW.js.map +1 -0
- package/dist/__chunks/{4HRJ2HGG.cjs → EIR3V4AH.cjs} +7 -18
- package/dist/__chunks/EIR3V4AH.cjs.map +1 -0
- package/dist/__chunks/{W4GZKF4S.cjs → ESGW3XTV.cjs} +4 -4
- package/dist/__chunks/{FVILLLRC.js → HA4KAF7N.js} +2 -2
- package/dist/__chunks/{IQP3Q2PT.cjs → IAOEIH7U.cjs} +4 -4
- package/dist/__chunks/IAOEIH7U.cjs.map +1 -0
- package/dist/__chunks/{S7GKKM5T.js → IJNZIOML.js} +2 -2
- package/dist/__chunks/{J5JBNASA.cjs → LKLPRA6D.cjs} +8 -15
- package/dist/__chunks/LKLPRA6D.cjs.map +1 -0
- package/dist/__chunks/{ONYVX4WU.js → LZ4LFK7N.js} +1 -1
- package/dist/__chunks/{ONYVX4WU.js.map → LZ4LFK7N.js.map} +1 -1
- package/dist/__chunks/{JEHUXNNK.cjs → OWLMHTW5.cjs} +2 -2
- package/dist/__chunks/{JEHUXNNK.cjs.map → OWLMHTW5.cjs.map} +1 -1
- package/dist/__chunks/{ZFFZWYYU.js → P234RPXN.js} +2 -2
- package/dist/__chunks/{GOMOMWQO.cjs → Q3I37NS7.cjs} +3 -3
- package/dist/__chunks/{S3UJPL7R.js → Q5GSB3Y5.js} +3 -3
- package/dist/__chunks/Q5GSB3Y5.js.map +1 -0
- package/dist/__chunks/{ATC5Z75T.cjs → QTGWI2GM.cjs} +3 -3
- package/dist/__chunks/{ZQYWEWWE.js → R4TBYKLS.js} +1 -1
- package/dist/__chunks/R4TBYKLS.js.map +1 -0
- package/dist/__chunks/{YPOSL2OK.js → S2VZE6RS.js} +2 -2
- package/dist/__chunks/{JT7PXHSX.cjs → SDTI2RBA.cjs} +4 -3
- package/dist/__chunks/SDTI2RBA.cjs.map +1 -0
- package/dist/__chunks/{TPT2EGAE.js → SEFHKYBL.js} +8 -5
- package/dist/__chunks/SEFHKYBL.js.map +1 -0
- package/dist/__chunks/{PZFK4YV7.cjs → SXABWYV4.cjs} +3 -3
- package/dist/__chunks/{DN43TX54.cjs → T75E3KPP.cjs} +10 -10
- package/dist/__chunks/TLVOHYPL.js +104 -0
- package/dist/__chunks/TLVOHYPL.js.map +1 -0
- package/dist/__chunks/{WYNZQWGG.cjs → ULHGK75R.cjs} +3 -3
- package/dist/__chunks/{FSIIRTOI.cjs → VW7HLULP.cjs} +3 -3
- package/dist/__chunks/{DE4RZUBC.js → WILWV75P.js} +6 -13
- package/dist/__chunks/WILWV75P.js.map +1 -0
- package/dist/__chunks/{OQFQZGQM.js → YAL24M7H.js} +4 -4
- package/dist/__chunks/YAL24M7H.js.map +1 -0
- package/dist/__chunks/{KHQQ6NTQ.js → YHHU5RSR.js} +8 -4
- package/dist/__chunks/YHHU5RSR.js.map +1 -0
- package/dist/__chunks/{6S3NMK6F.cjs → ZFZJ56ZA.cjs} +22 -22
- package/dist/__chunks/ZFZJ56ZA.cjs.map +1 -0
- package/dist/__chunks/{OUW7IJ3Y.cjs → ZIBKOWAK.cjs} +1 -1
- package/dist/__chunks/ZIBKOWAK.cjs.map +1 -0
- package/dist/__chunks/{KLMWBBII.js → ZOWJFE7W.js} +5 -5
- package/dist/__chunks/{C4MSZDCG.js → ZWTXIPP3.js} +2 -2
- package/dist/index.cjs +27 -25
- package/dist/index.css +138 -155
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +28 -26
- package/package.json +1 -1
- package/dist/__chunks/4HRJ2HGG.cjs.map +0 -1
- package/dist/__chunks/52D6HVA3.js +0 -122
- package/dist/__chunks/52D6HVA3.js.map +0 -1
- package/dist/__chunks/5L6ZVKXY.cjs.map +0 -1
- package/dist/__chunks/6S3NMK6F.cjs.map +0 -1
- package/dist/__chunks/7OYM5HJI.cjs.map +0 -1
- package/dist/__chunks/A7AAGKC2.js.map +0 -1
- package/dist/__chunks/AREAWDHD.js.map +0 -1
- package/dist/__chunks/DE4RZUBC.js.map +0 -1
- package/dist/__chunks/EBKE2QMG.cjs.map +0 -1
- package/dist/__chunks/IQP3Q2PT.cjs.map +0 -1
- package/dist/__chunks/J5JBNASA.cjs.map +0 -1
- package/dist/__chunks/JT7PXHSX.cjs.map +0 -1
- package/dist/__chunks/KHQQ6NTQ.js.map +0 -1
- package/dist/__chunks/KHZ4ITXI.cjs.map +0 -1
- package/dist/__chunks/MHXIUSQ6.js.map +0 -1
- package/dist/__chunks/OQFQZGQM.js.map +0 -1
- package/dist/__chunks/OUW7IJ3Y.cjs.map +0 -1
- package/dist/__chunks/S3UJPL7R.js.map +0 -1
- package/dist/__chunks/TPT2EGAE.js.map +0 -1
- package/dist/__chunks/VL5ONCQD.cjs.map +0 -1
- package/dist/__chunks/WRMF47QN.cjs.map +0 -1
- package/dist/__chunks/WTVLR5TH.js.map +0 -1
- package/dist/__chunks/YF53M62E.cjs +0 -122
- package/dist/__chunks/YF53M62E.cjs.map +0 -1
- package/dist/__chunks/ZQYWEWWE.js.map +0 -1
- /package/dist/__chunks/{LME64WQ5.js.map → 4K4SF7RI.js.map} +0 -0
- /package/dist/__chunks/{A5O4QH7P.js.map → 4LCJJZPI.js.map} +0 -0
- /package/dist/__chunks/{ADHTE22D.cjs.map → 762IDERQ.cjs.map} +0 -0
- /package/dist/__chunks/{HPXOG4FB.js.map → BA5NNKNL.js.map} +0 -0
- /package/dist/__chunks/{7K5BKF5X.cjs.map → CYMLBKRU.cjs.map} +0 -0
- /package/dist/__chunks/{W4GZKF4S.cjs.map → ESGW3XTV.cjs.map} +0 -0
- /package/dist/__chunks/{FVILLLRC.js.map → HA4KAF7N.js.map} +0 -0
- /package/dist/__chunks/{S7GKKM5T.js.map → IJNZIOML.js.map} +0 -0
- /package/dist/__chunks/{ZFFZWYYU.js.map → P234RPXN.js.map} +0 -0
- /package/dist/__chunks/{GOMOMWQO.cjs.map → Q3I37NS7.cjs.map} +0 -0
- /package/dist/__chunks/{ATC5Z75T.cjs.map → QTGWI2GM.cjs.map} +0 -0
- /package/dist/__chunks/{YPOSL2OK.js.map → S2VZE6RS.js.map} +0 -0
- /package/dist/__chunks/{PZFK4YV7.cjs.map → SXABWYV4.cjs.map} +0 -0
- /package/dist/__chunks/{DN43TX54.cjs.map → T75E3KPP.cjs.map} +0 -0
- /package/dist/__chunks/{WYNZQWGG.cjs.map → ULHGK75R.cjs.map} +0 -0
- /package/dist/__chunks/{FSIIRTOI.cjs.map → VW7HLULP.cjs.map} +0 -0
- /package/dist/__chunks/{KLMWBBII.js.map → ZOWJFE7W.js.map} +0 -0
- /package/dist/__chunks/{C4MSZDCG.js.map → ZWTXIPP3.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Tooltip/Tooltip.tsx","css-module:./Tooltip.module.css#css-module"],"names":["AriaTooltip","Tooltip"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,SAAgB,kBAAqD;AACrE,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA,gBAAgB;AAAA,EAEhB,WAAW;AAAA,EACX,kBAAkB;AAAA,OAEb;AAKP,OAAO,gBAAgB;;;ACduE,IAAO,yBAAQ,EAAC,WAAU,oBAAmB,qBAAoB,8BAA6B,wBAAuB,iCAAgC;;;AD8CrO,SAgDJ,UAhDI,KAgDJ,YAhDI;AArBd,SAAS,aAAa,OAAiD;AACrE,SACE,oBAAC,wDAA0B,QAA1B,EACE,WAAC,EAAE,UAAU,MAAM;AAClB,QAAI,cAAc;AAAU,aAAO;AACnC,QAAI,cAAc;AAAQ,aAAO;AACjC,QAAI,cAAc;AAAS,aAAO;AAClC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,WAAW;AAAA,UACpB,mBAAU;AAAA,UACV,uBAAO,iBAAiB,WAAW;AAAA,QACrC,CAAC;AAAA,QAED;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,WAAW,CAAC,mBAAU,KAAK,CAAC;AAAA,YACvC,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,SAAQ;AAAA,YACR,OAAM;AAAA,YAEN,8BAAC,UAAK,GAAE,uBAAsB,MAAK,gBAAe;AAAA;AAAA,QACpD;AAAA;AAAA,IACF;AAAA,EAEJ,IACF;AAEJ;AAOO,IAAM,cAAc,WAMzB,SAASA,aACT,IACA,KACc;AAFd,eAAE,YAAU,cAAc,0BAnE5B,IAmEE,IAAwD,uBAAxD,IAAwD,CAAtD,YAAwB;AAG1B,QAAM,YAAY,WAAW;AAAA,IAC3B,mBAAU;AAAA,IACV,sBAAY;AAAA,IACZ,sBAAY;AAAA,IACZ,uBAAc;AAAA,IACd,uBAAc;AAAA,IACd,wBAAe;AAAA,IACf,uBAAO;AAAA,EACT,CAAC;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,OACI;AAAA,MACF;AAAA,QACE;AAAA,QACA,QAAQ;AAAA,QACR,aAAa;AAAA,MACf;AAAA,MACA;AAAA,IACF,IATD;AAAA,MAWE;AAAA,QACC;AAAA,QACA,CAAC,UAAU,EAAE,YAAY,UAAU,MACjC,iCACE;AAAA,8BAAC,gBAAa;AAAA,UACd,oBAAC,sBAAW,MAAM,KAAK,OAAM,SAC1B,UACH;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA;AAAA,cACA,UAAU;AAAA;AAAA,UACZ;AAAA,WACF;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ,CAAC;AAwDD,IAAM,UAAU,WAAyC,SAASC,SAChE,OACA,KACc;AACd,QAAM;AAAA,IACJ;AAAA,IACA,eAAe;AAAA,IACf,QAAQ;AAAA,IACR,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,EACd,IAAI;AAEJ,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa;AAAA,MACb;AAAA,MACA,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR;AAAA,MAGA;AAAA,4BAAC,uBAAa,UAAS;AAAA,QACvB;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW,2BAA2B,SAAS;AAAA,YAC/C,cAAY;AAAA,YACZ,eAAa;AAAA,YACb;AAAA,YAEC;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,kBAAQ","sourcesContent":["import React, { forwardRef, type ReactNode, type ReactElement } from \"react\";\nimport { mergeProps } from \"react-aria\";\nimport {\n composeRenderProps,\n OverlayArrow as ReactAriaOverlayArrow,\n type OverlayArrowProps as ReactAriaOverlayArrowProps,\n Tooltip as ReactAriaTooltip,\n TooltipTrigger as ReactAriaTooltipTrigger,\n type TooltipProps as ReactAriaTooltipProps,\n} from \"react-aria-components\";\n\nimport Triggerable from \"../react-aria-utils/Triggerable\";\nimport Typography from \"../Typography/Typography\";\nimport OverlayVisibility from \"../react-aria-utils/OverlayVisibility\";\nimport classNames from \"classnames\";\nimport boxStyles from \"../Box/Box.module.css\";\nimport paddingStyles from \"../Box/padding.module.css\";\nimport roundingStyles from \"../rounding.module.css\";\nimport colorStyles from \"../colors/colors.module.css\";\nimport styles from \"./Tooltip.module.css\";\nimport {\n type Placement,\n syntaxToReactAriaPlacement,\n} from \"../react-aria-utils/placement\";\n\nfunction TooltipArrow(props: ReactAriaOverlayArrowProps): ReactElement {\n return (\n <ReactAriaOverlayArrow {...props}>\n {({ placement }) => {\n if (placement === \"center\") return null;\n if (placement === \"left\") return null;\n if (placement === \"right\") return null;\n return (\n <div\n className={classNames([\n boxStyles.block,\n styles[`arrowPlacement${placement}`],\n ])}\n >\n <svg\n className={classNames([boxStyles.block])}\n width={40}\n height={5}\n viewBox=\"0 0 40 5\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M17 0L22 5H12L17 0Z\" fill=\"currentColor\" />\n </svg>\n </div>\n );\n }}\n </ReactAriaOverlayArrow>\n );\n}\n\n/**\n * AriaTooltip: This component extends Tooltip from react-aria-components\n * It applies syntax styles and adds aadditional props:\n * - onContentChangeVisibility\n */\nexport const AriaTooltip = forwardRef<\n HTMLDivElement,\n ReactAriaTooltipProps & {\n /** Optional handler for change of visibility for overlaid content, for analytics timing */\n onChangeContentVisibility?: (visible: boolean) => void;\n }\n>(function AriaTooltip(\n { children: childrenProp, onChangeContentVisibility, ...otherProps },\n ref,\n): ReactElement {\n const className = classNames([\n boxStyles.box,\n colorStyles.gray900Color,\n colorStyles.gray900BackgroundColor,\n paddingStyles.paddingX2,\n paddingStyles.paddingY2,\n roundingStyles.roundingsm,\n styles.tooltip,\n ]);\n return (\n <ReactAriaTooltip\n ref={ref}\n {...mergeProps(\n {\n className,\n offset: 8,\n crossOffset: 0,\n },\n otherProps,\n )}\n >\n {composeRenderProps(\n childrenProp,\n (children, { isEntering, isExiting }) => (\n <>\n <TooltipArrow />\n <Typography size={100} color=\"white\">\n {children}\n </Typography>\n <OverlayVisibility\n isEntering={isEntering}\n isExiting={isExiting}\n onChange={onChangeContentVisibility}\n />\n </>\n ),\n )}\n </ReactAriaTooltip>\n );\n});\n\ntype TooltipProps = {\n /**\n * Test id for the floating tooltip\n */\n \"data-testid\"?: string;\n /**\n * How long a user hovers before tooltip shows (in ms)\n * @defaultValue 0\n */\n delay?: number;\n /** Optional boolean to disable tooltip trigger behavior */\n disabled?: boolean;\n /** Optional aria-label for the tooltip (content element) */\n accessibilityLabel?: string;\n /** Required trigger element */\n children: ReactElement;\n /** Content to be shown inside the tooltip. */\n content: ReactNode;\n /** If set to true the tooltip will render initially open */\n initialOpen?: boolean;\n /** Optional handler for change of visibility for popover content, for analytics timing */\n onChangeContentVisibility?: (visible: boolean) => void;\n /** Optional handler for change of visibility for popover content, for control */\n onOpenChange?: (open: boolean) => void;\n /** Optional boolean to control open state of tooltip externally */\n open?: boolean;\n /**\n * Location of the tooltip content relative to anchor element\n * @defaultValue \"top-end\"\n */\n placement?: Placement;\n};\n/**\n * [Tooltip](https://cambly-syntax.vercel.app/?path=/docs/components-tooltip--docs) displays contextual information on hover or focus.\n *\n * Tooltip content is hidden by default and shown on hover or focus.\n * The content is hidden again when the user mouses out of the trigger element or blurs the trigger element or presses Escape\n *\n * Example Usage:\n ```\n <Tooltip\n delay={200}\n placement=\"bottom-start\"\n initialOpen\n content={(\n <Box padding={2}>\n ... some content goes here\n </Box>\n )}\n >\n <Button text=\"Trigger me\" />\n </Tooltip>\n ```\n */\nconst Tooltip = forwardRef<HTMLDivElement, TooltipProps>(function Tooltip(\n props,\n ref,\n): ReactElement {\n const {\n accessibilityLabel,\n \"data-testid\": dataTestId,\n delay = 0,\n disabled = false,\n children,\n content,\n initialOpen,\n onChangeContentVisibility,\n onOpenChange,\n open,\n placement = \"top\",\n } = props;\n\n return (\n <ReactAriaTooltipTrigger\n defaultOpen={initialOpen}\n delay={delay}\n closeDelay={500}\n isDisabled={disabled}\n isOpen={open}\n onOpenChange={onOpenChange}\n >\n {/* transfer focus handlers to child element if it is focusable */}\n <Triggerable>{children}</Triggerable>\n <AriaTooltip\n ref={ref}\n placement={syntaxToReactAriaPlacement(placement)}\n aria-label={accessibilityLabel}\n data-testid={dataTestId}\n onChangeContentVisibility={onChangeContentVisibility}\n >\n {content}\n </AriaTooltip>\n </ReactAriaTooltipTrigger>\n );\n});\n\nexport default Tooltip;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/Tooltip/Tooltip.module.css\"; export default {\"tooltip\":\"_tooltip_11pyp_1\",\"arrowPlacementtop\":\"_arrowPlacementtop_11pyp_5\",\"arrowPlacementbottom\":\"_arrowPlacementbottom_11pyp_10\"}"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TextField/TextField.tsx","css-module:./TextField.module.css#css-module"],"sourcesContent":["import React, {\n type ReactElement,\n type HTMLInputTypeAttribute,\n useId,\n} from \"react\";\nimport classNames from \"classnames\";\nimport styles from \"./TextField.module.css\";\nimport Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\n/**\n * [TextField](https://cambly-syntax.vercel.app/?path=/docs/components-textfield--docs) is a component that allows users to enter text.\n */\nexport default function TextField({\n autoComplete,\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n onChange,\n placeholder = \"\",\n size = \"md\",\n type = \"text\",\n value = \"\",\n}: {\n /**\n * The autocomplete attribute specifies whether or not an input field should have autocomplete enabled.\n *\n * Feel free to add new values from the [MDN docs](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) as needed\n */\n autoComplete?: \"current-password\" | \"new-password\" | \"off\" | \"on\" | \"email\";\n /**\n * A data-testid to make querying for the TextField easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextField will be disabled.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * Text shown below TextField if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextField\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextField visible label\n */\n label: string;\n /**\n * The callback to be called the input changes\n */\n onChange: React.ChangeEventHandler<HTMLInputElement>;\n /**\n * Optional TextField placeholder text\n */\n placeholder?: string;\n /**\n * Size of the TextField\n *\n * Classic:\n * * `sm`: 32px\n * * `md`: 40px\n * * `lg`: 48px\n *\n * Cambio:\n * * `md`: 48px\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n /**\n * Input type of the TextField\n *\n * See [full list of input types](https://developer.mozilla.org/en-US/docs/Learn/Forms/HTML5_input_types)\n */\n type?: HTMLInputTypeAttribute;\n /**\n * Value of the TextField\n */\n value: string;\n}): ReactElement {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const reactId = useId();\n const { themeName } = useTheme();\n const inputId = id ?? reactId;\n\n return (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n dangerouslySetInlineStyle={{\n __style: {\n opacity: disabled ? 0.5 : 1,\n },\n }}\n position={themeName === \"cambio\" ? \"relative\" : undefined}\n >\n {label && (\n <label\n className={classNames(\n themeName === \"classic\" ? styles.label : styles.labelCambio,\n themeName === \"cambio\" && styles.labelCambioTextfield,\n )}\n htmlFor={inputId}\n >\n <Box paddingX={themeName === \"classic\" ? 1 : 3}>\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n )}\n <input\n autoComplete={autoComplete}\n className={classNames(\n styles.textfield,\n themeName === \"classic\"\n ? styles.textfieldClassic\n : styles.textfieldCambio,\n themeName === \"classic\" && styles[size],\n themeName === \"cambio\" ? styles[`${size}Cambio`] : undefined,\n themeName === \"classic\"\n ? styles[`${size}Height`]\n : styles.heightCambio,\n {\n [themeName === \"classic\"\n ? styles.inputError\n : styles.inputErrorCambio]: errorText,\n },\n )}\n data-testid={dataTestId}\n disabled={disabled}\n id={inputId}\n type={type}\n onChange={onChange}\n placeholder={placeholder}\n value={value}\n />\n {(helperText || errorText) && (\n <Box paddingX={themeName === \"classic\" ? 1 : 0}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n >\n {errorText || helperText}\n </Typography>\n </Box>\n )}\n </Box>\n );\n}\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_15iys_1\",\"textfieldClassic\":\"_textfieldClassic_15iys_10\",\"textfieldCambio\":\"_textfieldCambio_15iys_14\",\"label\":\"_label_15iys_29\",\"labelCambio\":\"_labelCambio_15iys_33\",\"labelCambioTextfield\":\"_labelCambioTextfield_15iys_42\",\"sm\":\"_sm_15iys_46\",\"smCambio\":\"_smCambio_15iys_53\",\"mdCambio\":\"_mdCambio_15iys_57\",\"lgCambio\":\"_lgCambio_15iys_61\",\"heightCambio\":\"_heightCambio_15iys_65\",\"smHeight\":\"_smHeight_15iys_69\",\"md\":\"_md_15iys_57\",\"mdHeight\":\"_mdHeight_15iys_80\",\"lg\":\"_lg_15iys_61\",\"lgHeight\":\"_lgHeight_15iys_91\",\"inputError\":\"_inputError_15iys_95\",\"inputErrorCambio\":\"_inputErrorCambio_15iys_105\"}"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA,EAGE;AAAA,OACK;AACP,OAAO,gBAAgB;;;ACL2E,IAAO,2BAAQ,EAAC,aAAY,sBAAqB,oBAAmB,8BAA6B,mBAAkB,6BAA4B,SAAQ,mBAAkB,eAAc,yBAAwB,wBAAuB,kCAAiC,MAAK,gBAAe,YAAW,sBAAqB,YAAW,sBAAqB,YAAW,sBAAqB,gBAAe,0BAAyB,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,MAAK,gBAAe,YAAW,sBAAqB,cAAa,wBAAuB,oBAAmB,8BAA6B;;;ADqG7tB,SAqBQ,KArBR;AAtFW,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA,eAAe;AAAA,EACf,UAAU,eAAe;AAAA,EACzB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AACV,GAiEiB;AACf,QAAM,aAAa,cAAc;AACjC,QAAM,WAAW,CAAC,cAAc;AAChC,QAAM,UAAU,MAAM;AACtB,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,UAAU,kBAAM;AAEtB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,WAAU;AAAA,MACV,KAAK;AAAA,MACL,OAAM;AAAA,MACN,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,SAAS,WAAW,MAAM;AAAA,QAC5B;AAAA,MACF;AAAA,MACA,UAAU,cAAc,WAAW,aAAa;AAAA,MAE/C;AAAA,iBACC;AAAA,UAAC;AAAA;AAAA,YACC,WAAW;AAAA,cACT,cAAc,YAAY,yBAAO,QAAQ,yBAAO;AAAA,cAChD,cAAc,YAAY,yBAAO;AAAA,YACnC;AAAA,YACA,SAAS;AAAA,YAET,8BAAC,eAAI,UAAU,cAAc,YAAY,IAAI,GAC3C,8BAAC,sBAAW,MAAM,KAAK,OAAM,WAC1B,iBACH,GACF;AAAA;AAAA,QACF;AAAA,QAEF;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,WAAW;AAAA,cACT,yBAAO;AAAA,cACP,cAAc,YACV,yBAAO,mBACP,yBAAO;AAAA,cACX,cAAc,aAAa,yBAAO,IAAI;AAAA,cACtC,cAAc,WAAW,yBAAO,GAAG,YAAY,IAAI;AAAA,cACnD,cAAc,YACV,yBAAO,GAAG,YAAY,IACtB,yBAAO;AAAA,cACX;AAAA,gBACE,CAAC,cAAc,YACX,yBAAO,aACP,yBAAO,gBAAgB,GAAG;AAAA,cAChC;AAAA,YACF;AAAA,YACA,eAAa;AAAA,YACb;AAAA,YACA,IAAI;AAAA,YACJ;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACE,cAAc,cACd,oBAAC,eAAI,UAAU,cAAc,YAAY,IAAI,GAC3C;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,OAAO,YAAY,wBAAwB;AAAA,YAE1C,uBAAa;AAAA;AAAA,QAChB,GACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
|
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }"use client"
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var _SNYEHXDAcjs = require('./SNYEHXDA.cjs');
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var _JEHUXNNKcjs = require('./JEHUXNNK.cjs');
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
var _TBQR2FPScjs = require('./TBQR2FPS.cjs');
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
var _K4AUV2VKcjs = require('./K4AUV2VK.cjs');
|
|
14
|
-
|
|
15
|
-
// src/TextArea/TextArea.tsx
|
|
16
|
-
var _react = require('react');
|
|
17
|
-
|
|
18
|
-
// css-module:./TextArea.module.css#css-module
|
|
19
|
-
var TextArea_module_default = { "textarea": "_textarea_1w1b8_1", "sm": "_sm_1w1b8_5", "md": "_md_1w1b8_10", "lg": "_lg_1w1b8_15", "textareaCambio": "_textareaCambio_1w1b8_20", "fixTextareaHeight": "_fixTextareaHeight_1w1b8_24", "labelCambio": "_labelCambio_1w1b8_28" };
|
|
20
|
-
|
|
21
|
-
// css-module:../TextField/TextField.module.css#css-module
|
|
22
|
-
var TextField_module_default = { "textfield": "_textfield_15iys_1", "textfieldClassic": "_textfieldClassic_15iys_10", "textfieldCambio": "_textfieldCambio_15iys_14", "label": "_label_15iys_29", "labelCambio": "_labelCambio_15iys_33", "labelCambioTextfield": "_labelCambioTextfield_15iys_42", "sm": "_sm_15iys_46", "smCambio": "_smCambio_15iys_53", "mdCambio": "_mdCambio_15iys_57", "lgCambio": "_lgCambio_15iys_61", "heightCambio": "_heightCambio_15iys_65", "smHeight": "_smHeight_15iys_69", "md": "_md_15iys_57", "mdHeight": "_mdHeight_15iys_80", "lg": "_lg_15iys_61", "lgHeight": "_lgHeight_15iys_91", "inputError": "_inputError_15iys_95", "inputErrorCambio": "_inputErrorCambio_15iys_105" };
|
|
23
|
-
|
|
24
|
-
// src/TextArea/TextArea.tsx
|
|
25
|
-
var _classnames = require('classnames'); var _classnames2 = _interopRequireDefault(_classnames);
|
|
26
|
-
var _jsxruntime = require('react/jsx-runtime');
|
|
27
|
-
var TextArea = _react.forwardRef.call(void 0,
|
|
28
|
-
function TextArea2({
|
|
29
|
-
"data-testid": dataTestId,
|
|
30
|
-
disabled: disabledProp = false,
|
|
31
|
-
errorText = "",
|
|
32
|
-
helperText = "",
|
|
33
|
-
id,
|
|
34
|
-
label,
|
|
35
|
-
maxLength = 1024,
|
|
36
|
-
placeholder = "",
|
|
37
|
-
rows = 3,
|
|
38
|
-
size = "md",
|
|
39
|
-
value = "",
|
|
40
|
-
onChange
|
|
41
|
-
}, forwardedRef) {
|
|
42
|
-
const isHydrated = _K4AUV2VKcjs.useIsHydrated.call(void 0, );
|
|
43
|
-
const disabled = !isHydrated || disabledProp;
|
|
44
|
-
const reactId = _react.useId.call(void 0, );
|
|
45
|
-
const { themeName } = _TBQR2FPScjs.useTheme.call(void 0, );
|
|
46
|
-
const inputId = id != null ? id : reactId;
|
|
47
|
-
return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
|
|
48
|
-
_SNYEHXDAcjs.Box_default,
|
|
49
|
-
{
|
|
50
|
-
display: "flex",
|
|
51
|
-
direction: "column",
|
|
52
|
-
gap: 2,
|
|
53
|
-
width: "100%",
|
|
54
|
-
dangerouslySetInlineStyle: {
|
|
55
|
-
__style: {
|
|
56
|
-
opacity: disabled ? 0.5 : 1
|
|
57
|
-
}
|
|
58
|
-
},
|
|
59
|
-
position: themeName === "cambio" ? "relative" : void 0,
|
|
60
|
-
children: [
|
|
61
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
62
|
-
"label",
|
|
63
|
-
{
|
|
64
|
-
className: _classnames2.default.call(void 0,
|
|
65
|
-
themeName === "classic" ? TextField_module_default.label : TextField_module_default.labelCambio,
|
|
66
|
-
themeName === "cambio" && TextArea_module_default.labelCambio
|
|
67
|
-
),
|
|
68
|
-
htmlFor: inputId,
|
|
69
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SNYEHXDAcjs.Box_default, { paddingX: themeName === "classic" ? 1 : 3, width: "100%", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _JEHUXNNKcjs.Typography_default, { size: 100, color: "gray700", children: label }) })
|
|
70
|
-
}
|
|
71
|
-
),
|
|
72
|
-
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _JEHUXNNKcjs.Typography_default, { size: themeName === "cambio" ? 100 : 200, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
73
|
-
"div",
|
|
74
|
-
{
|
|
75
|
-
className: _classnames2.default.call(void 0,
|
|
76
|
-
themeName === "cambio" && TextArea_module_default.fixTextareaHeight
|
|
77
|
-
),
|
|
78
|
-
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
79
|
-
"textarea",
|
|
80
|
-
{
|
|
81
|
-
"data-testid": dataTestId,
|
|
82
|
-
ref: forwardedRef,
|
|
83
|
-
className: _classnames2.default.call(void 0,
|
|
84
|
-
TextField_module_default.textfield,
|
|
85
|
-
themeName === "classic" ? TextField_module_default.textfieldClassic : TextField_module_default.textfieldCambio,
|
|
86
|
-
themeName === "classic" && TextField_module_default[size],
|
|
87
|
-
themeName === "classic" && TextArea_module_default[size],
|
|
88
|
-
themeName === "classic" ? TextArea_module_default.textarea : TextArea_module_default.textareaCambio,
|
|
89
|
-
{
|
|
90
|
-
[themeName === "classic" ? TextField_module_default.inputError : TextField_module_default.inputErrorCambio]: errorText
|
|
91
|
-
}
|
|
92
|
-
),
|
|
93
|
-
id: inputId,
|
|
94
|
-
placeholder,
|
|
95
|
-
maxLength,
|
|
96
|
-
onChange,
|
|
97
|
-
rows,
|
|
98
|
-
value,
|
|
99
|
-
disabled
|
|
100
|
-
}
|
|
101
|
-
)
|
|
102
|
-
}
|
|
103
|
-
) }),
|
|
104
|
-
(helperText || errorText) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SNYEHXDAcjs.Box_default, { paddingX: themeName === "classic" ? 1 : 0, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
105
|
-
_JEHUXNNKcjs.Typography_default,
|
|
106
|
-
{
|
|
107
|
-
size: 100,
|
|
108
|
-
color: errorText ? "destructive-primary" : "gray700",
|
|
109
|
-
children: errorText || helperText
|
|
110
|
-
}
|
|
111
|
-
) })
|
|
112
|
-
]
|
|
113
|
-
}
|
|
114
|
-
);
|
|
115
|
-
}
|
|
116
|
-
);
|
|
117
|
-
var TextArea_default = TextArea;
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
exports.TextArea_default = TextArea_default;
|
|
122
|
-
//# sourceMappingURL=YF53M62E.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/TextArea/TextArea.tsx","css-module:./TextArea.module.css#css-module","css-module:../TextField/TextField.module.css#css-module"],"names":["TextArea"],"mappings":"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","sourcesContent":["import Box from \"../Box/Box\";\nimport Typography from \"../Typography/Typography\";\nimport React, { type ReactElement, useId, forwardRef } from \"react\";\nimport styles from \"./TextArea.module.css\";\nimport textFieldStyles from \"../TextField/TextField.module.css\";\nimport classNames from \"classnames\";\nimport useIsHydrated from \"../useIsHydrated\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype TextAreaProps = {\n /**\n * A data-testid to make querying for the TextArea easier.\n */\n \"data-testid\"?: string;\n /**\n * If true, the TextArea will be disabled.\n */\n disabled?: boolean;\n /**\n * Text shown below TextArea if there is an input error.\n */\n errorText?: string;\n /**\n * Informative helper text shown below TextArea\n */\n helperText?: string;\n /**\n * TextField id, if not provided, a unique id will be generated\n */\n id?: string;\n /**\n * TextArea visible label\n */\n label: string;\n /**\n * Maximum number of characters allowed in the TextArea\n */\n maxLength?: number;\n /**\n * Callback fired when the value is changed.\n */\n onChange: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n /**\n * Placeholder text to display when TextArea is empty\n */\n placeholder?: string;\n /**\n * Size of the TextArea. Defines the font size and padding.\n *\n * Cambio only supports `md`\n *\n * @defaultValue \"md\"\n */\n size?: \"sm\" | \"md\" | \"lg\";\n /**\n * Number of rows to display\n */\n rows?: number;\n /**\n * Value of the TextArea\n */\n value: string;\n};\n\n/**\n * [TextArea](https://cambly-syntax.vercel.app/?path=/docs/components-textarea--docs) allows users to enter multiple lines of text.\n */\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea(\n {\n \"data-testid\": dataTestId,\n disabled: disabledProp = false,\n errorText = \"\",\n helperText = \"\",\n id,\n label,\n maxLength = 1024,\n placeholder = \"\",\n rows = 3,\n size = \"md\",\n value = \"\",\n onChange,\n }: TextAreaProps,\n forwardedRef,\n ): ReactElement {\n const isHydrated = useIsHydrated();\n const disabled = !isHydrated || disabledProp;\n const reactId = useId();\n const { themeName } = useTheme();\n const inputId = id ?? reactId;\n\n return (\n <Box\n display=\"flex\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n dangerouslySetInlineStyle={{\n __style: {\n opacity: disabled ? 0.5 : 1,\n },\n }}\n position={themeName === \"cambio\" ? \"relative\" : undefined}\n >\n <label\n className={classNames(\n themeName === \"classic\"\n ? textFieldStyles.label\n : textFieldStyles.labelCambio,\n themeName === \"cambio\" && styles.labelCambio,\n )}\n htmlFor={inputId}\n >\n <Box paddingX={themeName === \"classic\" ? 1 : 3} width=\"100%\">\n <Typography size={100} color=\"gray700\">\n {label}\n </Typography>\n </Box>\n </label>\n <Typography size={themeName === \"cambio\" ? 100 : 200}>\n <div\n className={classNames(\n themeName === \"cambio\" && styles.fixTextareaHeight,\n )}\n >\n <textarea\n data-testid={dataTestId}\n ref={forwardedRef}\n className={classNames(\n textFieldStyles.textfield,\n themeName === \"classic\"\n ? textFieldStyles.textfieldClassic\n : textFieldStyles.textfieldCambio,\n themeName === \"classic\" && textFieldStyles[size],\n themeName === \"classic\" && styles[size],\n themeName === \"classic\"\n ? styles.textarea\n : styles.textareaCambio,\n {\n [themeName === \"classic\"\n ? textFieldStyles.inputError\n : textFieldStyles.inputErrorCambio]: errorText,\n },\n )}\n id={inputId}\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={onChange}\n rows={rows}\n value={value}\n disabled={disabled}\n />\n </div>\n </Typography>\n {(helperText || errorText) && (\n <Box paddingX={themeName === \"classic\" ? 1 : 0}>\n <Typography\n size={100}\n color={errorText ? \"destructive-primary\" : \"gray700\"}\n >\n {errorText || helperText}\n </Typography>\n </Box>\n )}\n </Box>\n );\n },\n);\n\nexport default TextArea;\n","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextArea/TextArea.module.css\"; export default {\"textarea\":\"_textarea_1w1b8_1\",\"sm\":\"_sm_1w1b8_5\",\"md\":\"_md_1w1b8_10\",\"lg\":\"_lg_1w1b8_15\",\"textareaCambio\":\"_textareaCambio_1w1b8_20\",\"fixTextareaHeight\":\"_fixTextareaHeight_1w1b8_24\",\"labelCambio\":\"_labelCambio_1w1b8_28\"}","import \"/home/runner/work/syntax/syntax/packages/syntax-core/src/TextField/TextField.module.css\"; export default {\"textfield\":\"_textfield_15iys_1\",\"textfieldClassic\":\"_textfieldClassic_15iys_10\",\"textfieldCambio\":\"_textfieldCambio_15iys_14\",\"label\":\"_label_15iys_29\",\"labelCambio\":\"_labelCambio_15iys_33\",\"labelCambioTextfield\":\"_labelCambioTextfield_15iys_42\",\"sm\":\"_sm_15iys_46\",\"smCambio\":\"_smCambio_15iys_53\",\"mdCambio\":\"_mdCambio_15iys_57\",\"lgCambio\":\"_lgCambio_15iys_61\",\"heightCambio\":\"_heightCambio_15iys_65\",\"smHeight\":\"_smHeight_15iys_69\",\"md\":\"_md_15iys_57\",\"mdHeight\":\"_mdHeight_15iys_80\",\"lg\":\"_lg_15iys_61\",\"lgHeight\":\"_lgHeight_15iys_91\",\"inputError\":\"_inputError_15iys_95\",\"inputErrorCambio\":\"_inputErrorCambio_15iys_105\"}"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import {\n type ReactNode,\n createContext,\n useContext,\n type ReactElement,\n} from \"react\";\nimport Box from \"../Box/Box\";\nimport { useTheme } from \"../ThemeProvider/ThemeProvider\";\n\ntype Size =\n | \"sm\"\n | \"md\"\n | \"lg\"\n /* `xl` is deprecated and mapped to `lg` in Cambio */\n | \"xl\";\ntype Orientation = \"standard\" | \"reverse\";\n\ntype AvatarGroupContextType = {\n size: Size;\n orientation: Orientation;\n};\n\nconst AvatarGroupContext = createContext<AvatarGroupContextType | null>(null);\n\nexport function useAvatarGroup(): AvatarGroupContextType | null {\n const context = useContext(AvatarGroupContext);\n return !context ? null : context;\n}\n\n/**\n * [AvatarGroup](https://cambly-syntax.vercel.app/?path=/docs/components-avatargroup--docs) is a stack of avatars to represent a group of people\n *\n * Pass in Avatar components as children to the AvatarGroup component. The size prop that is passed into the AvatarGroup component will override Avatar's size prop..\n *\n * Usage:\n *\n * <AvatarGroup size=\"xl\" orientation=\"standard\">\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * <Avatar accessibilityLabel=\"Joseph Liotta\" src=\"image.png\" />\n * </AvatarGroup>\n *\n */\nexport default function AvatarGroup({\n size = \"md\",\n orientation = \"standard\",\n children,\n}: {\n /**\n * Size of the avatars in the AvatarGroup.\n *\n * Classic:\n * * `sm`: 24px\n * * `md`: 40px\n * * `lg`: 72px\n * * `xl`: 128px\n *\n * Cambio:\n * * `sm`: 32px\n * * `md`: 48px\n * * `lg`: 64px\n * * `xl`: 64px (deprecated, maps to `lg` in Cambio)\n *\n * @defaultValue `md`\n */\n size?: Size;\n /**\n * Orientation of the AvatarGroup.\n * This describes the order of rendering of the Avatar components.\n * Standard renders the Avatar components with the right component on top.\n * Reverse renders the Avatar components with the left component on top.\n *\n * @defaultValue `standard`\n */\n orientation?: Orientation;\n /**\n * Avatars to be rendered within the AvatarGroup.\n */\n children: ReactNode;\n}): ReactElement {\n const { themeName } = useTheme();\n const parsedSize = themeName === \"cambio\" && size === \"xl\" ? \"lg\" : size;\n\n return (\n <AvatarGroupContext.Provider value={{ size: parsedSize, orientation }}>\n <Box\n display=\"flex\"\n justifyContent={orientation === \"standard\" ? \"start\" : \"end\"}\n dangerouslySetInlineStyle={{\n __style: {\n flexDirection: orientation === \"standard\" ? \"row\" : \"row-reverse\",\n },\n }}\n >\n {children}\n </Box>\n </AvatarGroupContext.Provider>\n );\n}\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":";;;;;;;;;AAAA;AAAA,EAEE;AAAA,EACA;AAAA,OAEK;AAgFD;AA/DN,IAAM,qBAAqB,cAA6C,IAAI;AAErE,SAAS,iBAAgD;AAC9D,QAAM,UAAU,WAAW,kBAAkB;AAC7C,SAAO,CAAC,UAAU,OAAO;AAC3B;AAgBe,SAAR,YAA6B;AAAA,EAClC,OAAO;AAAA,EACP,cAAc;AAAA,EACd;AACF,GAgCiB;AACf,QAAM,EAAE,UAAU,IAAI,SAAS;AAC/B,QAAM,aAAa,cAAc,YAAY,SAAS,OAAO,OAAO;AAEpE,SACE,oBAAC,mBAAmB,UAAnB,EAA4B,OAAO,EAAE,MAAM,YAAY,YAAY,GAClE;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,gBAAgB,gBAAgB,aAAa,UAAU;AAAA,MACvD,2BAA2B;AAAA,QACzB,SAAS;AAAA,UACP,eAAe,gBAAgB,aAAa,QAAQ;AAAA,QACtD;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,YAAY,cAAc;","names":[]}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|