@liveblocks/react-ui/dist/components/internal/Button.cjs.map

A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.

{"version":3,"file":"Button.cjs","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { ChevronDownIcon } from \"../../icons/ChevronDown\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n  variant?: \"default\" | \"toolbar\" | \"outline\" | \"primary\" | \"secondary\";\n  size?: \"default\" | \"large\";\n  disableable?: boolean;\n  icon?: ReactNode;\n}\n\nexport const CustomButton = forwardRef<\n  HTMLButtonElement,\n  Omit<ButtonProps, \"icon\">\n>(\n  (\n    {\n      variant = \"default\",\n      size = \"default\",\n      disableable = true,\n      className,\n      children,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    return (\n      <button\n        type=\"button\"\n        className={classNames(\n          \"lb-button\",\n          !disableable && \"lb-button:non-disableable\",\n          className\n        )}\n        data-variant={variant}\n        data-size={size}\n        {...props}\n        ref={forwardedRef}\n      >\n        {children}\n      </button>\n    );\n  }\n);\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ icon, children, ...props }, forwardedRef) => {\n    return (\n      <CustomButton {...props} ref={forwardedRef}>\n        {icon ? <span className=\"lb-icon-container\">{icon}</span> : null}\n        {children ? <span className=\"lb-button-label\">{children}</span> : null}\n      </CustomButton>\n    );\n  }\n);\n\nexport const SelectButton = forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ icon, children, className, ...props }, forwardedRef) => {\n    return (\n      <CustomButton\n        {...props}\n        type=\"button\"\n        className={classNames(\"lb-select-button\", className)}\n        ref={forwardedRef}\n      >\n        {icon ? <span className=\"lb-icon-container\">{icon}</span> : null}\n        {children ? <span className=\"lb-button-label\">{children}</span> : null}\n        <span className=\"lb-select-button-chevron\">\n          <ChevronDownIcon />\n        </span>\n      </CustomButton>\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;;;;;AAeO;AAAqB;AAKxB;AACY;AACH;AACO;AACd;AACA;AACG;AAIL;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACH;AACP;AACC;AAEJ;AACH;AAGN;AAEO;AAAe;AAElB;AACG;AAAiB;AAAY;AAC3B;AAAQ;AAAe;AAAqB;AAAe;AAC/C;AAAe;AAAmB;AAAmB;AAAA;AACpE;AAGN;AAEO;AAAqB;AAExB;AACG;AACK;AACC;AAC8C;AAC9C;AAEJ;AAAQ;AAAe;AAAqB;AAAe;AAC/C;AAAe;AAAmB;AAAmB;AACjE;AAAe;AACG;AACnB;AAAA;AACF;AAGN;;;;"}