@ledgerhq/react-ui 0.7.6-nightly.0 → 0.7.6

package/lib/cjs/components/form/QuantityInput/index.js

@@ -1,83 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-__export(exports, {
-  default: () => QuantityInput_default
-});
-var import_react = __toModule(require("react"));
-var import_BaseInput = __toModule(require("../BaseInput"));
-var import_Flex = __toModule(require("../../layout/Flex"));
-var import_Text = __toModule(require("../../asorted/Text"));
-var import_styled_components = __toModule(require("styled-components"));
-const MaxButton = import_styled_components.default.button`
-  color: ${(p) => p.theme.colors.neutral.c00};
-  background-color: ${(p) => p.theme.colors.neutral.c100};
-  border-radius: 100px;
-  border-width: 0;
-  padding-left: 14px;
-  padding-right: 14px;
-  height: 100%;
-  cursor: pointer;
-
-  &:disabled {
-    background-color: ${(p) => p.theme.colors.neutral.c30};
-    color: ${(p) => p.theme.colors.neutral.c50};
-    cursor: unset;
-  }
-`;
-const Legend = (0, import_styled_components.default)(import_Text.default)`
-  color: ${(p) => p.theme.colors.neutral.c70};
-
-  &[data-disabled="true"] {
-    color: ${(p) => p.theme.colors.neutral.c50};
-  }
-`;
-function QuantityInput({
-  onMaxClick,
-  price,
-  ...inputProps
-}, ref) {
-  return /* @__PURE__ */ import_react.default.createElement(import_BaseInput.default, {
-    ref,
-    ...inputProps,
-    type: "number",
-    renderRight: /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
-      alignItems: "center",
-      justifyContent: "center",
-      pr: "3px",
-      py: "3px"
-    }, price && /* @__PURE__ */ import_react.default.createElement(Legend, {
-      variant: "body",
-      pr: "12px",
-      "data-disabled": inputProps.disabled
-    }, price), /* @__PURE__ */ import_react.default.createElement(MaxButton, {
-      onClick: onMaxClick,
-      disabled: inputProps.disabled
-    }, /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
-      variant: "tiny",
-      color: "currentColor"
-    }, "Max")))
-  });
-}
-var QuantityInput_default = import_react.default.forwardRef(QuantityInput);
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/form/QuantityInput/index.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/components/form/QuantityInput/index.tsx"],
-  "sourcesContent": ["import React from \"react\";\nimport Input, { InputProps } from \"../BaseInput\";\nimport FlexBox from \"../../layout/Flex\";\nimport Text from \"../../asorted/Text\";\nimport styled from \"styled-components\";\n\nconst MaxButton = styled.button`\n  color: ${(p) => p.theme.colors.neutral.c00};\n  background-color: ${(p) => p.theme.colors.neutral.c100};\n  border-radius: 100px;\n  border-width: 0;\n  padding-left: 14px;\n  padding-right: 14px;\n  height: 100%;\n  cursor: pointer;\n\n  &:disabled {\n    background-color: ${(p) => p.theme.colors.neutral.c30};\n    color: ${(p) => p.theme.colors.neutral.c50};\n    cursor: unset;\n  }\n`;\n\nconst Legend = styled(Text)`\n  color: ${(p) => p.theme.colors.neutral.c70};\n\n  &[data-disabled=\"true\"] {\n    color: ${(p) => p.theme.colors.neutral.c50};\n  }\n`;\n\nfunction QuantityInput(\n  {\n    onMaxClick,\n    price,\n    ...inputProps\n  }: InputProps & {\n    onMaxClick?: (e: React.FormEvent<HTMLButtonElement>) => void;\n    price?: string;\n  },\n  ref?: React.ForwardedRef<HTMLInputElement>,\n): JSX.Element {\n  return (\n    <Input\n      ref={ref}\n      {...inputProps}\n      type={\"number\"}\n      renderRight={\n        <FlexBox alignItems={\"center\"} justifyContent={\"center\"} pr={\"3px\"} py={\"3px\"}>\n          {price && (\n            <Legend variant=\"body\" pr={\"12px\"} data-disabled={inputProps.disabled}>\n              {price}\n            </Legend>\n          )}\n          <MaxButton onClick={onMaxClick} disabled={inputProps.disabled}>\n            <Text variant=\"tiny\" color=\"currentColor\">\n              Max\n            </Text>\n          </MaxButton>\n        </FlexBox>\n      }\n    />\n  );\n}\n\nexport default React.forwardRef(QuantityInput);\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,uBAAkC;AAClC,kBAAoB;AACpB,kBAAiB;AACjB,+BAAmB;AAEnB,MAAM,YAAY,iCAAO;AAAA,WACd,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA,sBACnB,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAS5B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA,aACzC,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAK3C,MAAM,SAAS,sCAAO;AAAA,WACX,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,aAG5B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI3C,uBACE;AAAA,EACE;AAAA,EACA;AAAA,KACG;AAAA,GAKL,KACa;AACb,SACE,mDAAC,0BAAD;AAAA,IACE;AAAA,OACI;AAAA,IACJ,MAAM;AAAA,IACN,aACE,mDAAC,qBAAD;AAAA,MAAS,YAAY;AAAA,MAAU,gBAAgB;AAAA,MAAU,IAAI;AAAA,MAAO,IAAI;AAAA,OACrE,SACC,mDAAC,QAAD;AAAA,MAAQ,SAAQ;AAAA,MAAO,IAAI;AAAA,MAAQ,iBAAe,WAAW;AAAA,OAC1D,QAGL,mDAAC,WAAD;AAAA,MAAW,SAAS;AAAA,MAAY,UAAU,WAAW;AAAA,OACnD,mDAAC,qBAAD;AAAA,MAAM,SAAQ;AAAA,MAAO,OAAM;AAAA,OAAe;AAAA;AAAA;AAUtD,IAAO,wBAAQ,qBAAM,WAAW;",
-  "names": []
-}

package/lib/cjs/components/form/Radio/Radio.stories.js

@@ -1,154 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-__export(exports, {
-  RadioGroup: () => RadioGroup,
-  RadioGroupList: () => RadioGroupList,
-  RadioGroupOutlined: () => RadioGroupOutlined,
-  default: () => Radio_stories_default
-});
-var import_react = __toModule(require("react"));
-var import_client_api = __toModule(require("@storybook/client-api"));
-var import_index = __toModule(require("./index"));
-var Radio_stories_default = {
-  title: "Form/Radio",
-  argTypes: {
-    currentValue: {
-      type: "text",
-      description: "This is the current value. A RadioItem will be checked if its value matches this value.",
-      control: false
-    },
-    name: {
-      type: "text",
-      description: "The name property is used to link all RadioItems",
-      control: false
-    },
-    onChange: {
-      control: false,
-      description: "The callback receives the value of the pressed RadioItem as parameter",
-      action: "clicked"
-    }
-  }
-};
-const TemplateElement = (args) => {
-  const [currentArgs, updateArgs] = (0, import_client_api.useArgs)();
-  const handleChange = (value) => {
-    updateArgs({ currentValue: value });
-    currentArgs.onChange(value);
-  };
-  return /* @__PURE__ */ import_react.default.createElement(import_index.default, {
-    ...args,
-    onChange: handleChange,
-    containerProps: { flexDirection: "column", rowGap: "1rem" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Blue squad",
-    value: "blue",
-    variant: "default"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Black squad",
-    value: "black",
-    variant: "main"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Yellow squad",
-    value: "yellow",
-    variant: "success"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Core squad",
-    value: "core",
-    variant: "error"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Orange squad",
-    value: "orange",
-    variant: "default",
-    disabled: true
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "Purple squad",
-    value: "purple",
-    variant: "default",
-    disabled: true
-  }));
-};
-const TemplateOutlinedElement = (args) => {
-  const [currentArgs, updateArgs] = (0, import_client_api.useArgs)();
-  const handleChange = (value) => {
-    updateArgs({ currentValue: value });
-    currentArgs.onChange(value);
-  };
-  return /* @__PURE__ */ import_react.default.createElement(import_index.default, {
-    ...args,
-    onChange: handleChange,
-    containerProps: { flexDirection: "column", rowGap: "20px" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    outlined: true,
-    label: "Black squad",
-    value: "black",
-    variant: "main"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    outlined: true,
-    label: "Yellow squad",
-    value: "yellow",
-    variant: "success"
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    outlined: true,
-    label: "Core squad",
-    value: "core",
-    variant: "error"
-  }));
-};
-const RadioGroup = TemplateElement.bind({
-  currentValue: "purple"
-});
-const RadioGroupOutlined = TemplateOutlinedElement.bind({});
-const TemplateListElement = (args) => {
-  const [currentArgs, updateArgs] = (0, import_client_api.useArgs)();
-  const handleChange = (value) => {
-    updateArgs({ currentValue: value });
-    currentArgs.onChange(value);
-  };
-  return /* @__PURE__ */ import_react.default.createElement(import_index.default, {
-    ...args,
-    onChange: handleChange,
-    containerProps: { flexDirection: "column", rowGap: "1rem" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_index.default.ListElement, {
-    label: "Ledger Verse",
-    value: "ledgerVerse",
-    disabled: true,
-    containerProps: { flex: 1 }
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.ListElement, {
-    label: "Live Monad",
-    value: "liveMonad",
-    containerProps: { flex: 1 }
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.ListElement, {
-    label: "Live Hub",
-    value: "liveHub",
-    containerProps: { flex: 1 }
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.ListElement, {
-    label: "Live Meta",
-    value: "liveMeta",
-    containerProps: { flex: 1 }
-  }));
-};
-const RadioGroupList = TemplateListElement.bind({});
-RadioGroup.args = { currentValue: "purple" };
-RadioGroupList.args = { currentValue: "liveHub" };
-//# sourceMappingURL=Radio.stories.js.map

package/lib/cjs/components/form/Radio/Radio.stories.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/components/form/Radio/Radio.stories.tsx"],
-  "sourcesContent": ["import React from \"react\";\n// @ts-expect-error Typings\u2026\nimport { useArgs } from \"@storybook/client-api\";\n\nimport Radio from \"./index\";\nimport type { RadioProps } from \"./index\";\nimport { StoryTemplate } from \"./../../helpers\";\n\nexport default {\n  title: \"Form/Radio\",\n  argTypes: {\n    currentValue: {\n      type: \"text\",\n      description:\n        \"This is the current value. A RadioItem will be checked if its value matches this value.\",\n      control: false,\n    },\n    name: {\n      type: \"text\",\n      description: \"The name property is used to link all RadioItems\",\n      control: false,\n    },\n    onChange: {\n      control: false,\n      description: \"The callback receives the value of the pressed RadioItem as parameter\",\n      action: \"clicked\",\n    },\n  },\n};\n\nconst TemplateElement = (args: RadioProps) => {\n  const [currentArgs, updateArgs] = useArgs();\n  const handleChange: RadioProps[\"onChange\"] = (value) => {\n    // toggle the checked value on click to simulate onChange\n    updateArgs({ currentValue: value });\n    // trigger the storybook action\n    currentArgs.onChange(value);\n  };\n\n  return (\n    <Radio\n      {...args}\n      onChange={handleChange}\n      containerProps={{ flexDirection: \"column\", rowGap: \"1rem\" }}\n    >\n      <Radio.Element label=\"Blue squad\" value=\"blue\" variant=\"default\" />\n      <Radio.Element label=\"Black squad\" value=\"black\" variant=\"main\" />\n      <Radio.Element label=\"Yellow squad\" value=\"yellow\" variant=\"success\" />\n      <Radio.Element label=\"Core squad\" value=\"core\" variant=\"error\" />\n      <Radio.Element label=\"Orange squad\" value=\"orange\" variant=\"default\" disabled />\n      <Radio.Element label=\"Purple squad\" value=\"purple\" variant=\"default\" disabled />\n    </Radio>\n  );\n};\n\nconst TemplateOutlinedElement = (args: RadioProps) => {\n  const [currentArgs, updateArgs] = useArgs();\n  const handleChange: RadioProps[\"onChange\"] = (value) => {\n    // toggle the checked value on click to simulate onChange\n    updateArgs({ currentValue: value });\n    // trigger the storybook action\n    currentArgs.onChange(value);\n  };\n\n  return (\n    <Radio\n      {...args}\n      onChange={handleChange}\n      containerProps={{ flexDirection: \"column\", rowGap: \"20px\" }}\n    >\n      <Radio.Element outlined label=\"Black squad\" value=\"black\" variant=\"main\" />\n      <Radio.Element outlined label=\"Yellow squad\" value=\"yellow\" variant=\"success\" />\n      <Radio.Element outlined label=\"Core squad\" value=\"core\" variant=\"error\" />\n    </Radio>\n  );\n};\n\nexport const RadioGroup: StoryTemplate<RadioProps> = TemplateElement.bind({\n  currentValue: \"purple\",\n});\n\nexport const RadioGroupOutlined: StoryTemplate<RadioProps> = TemplateOutlinedElement.bind({});\n\nconst TemplateListElement = (args: RadioProps) => {\n  const [currentArgs, updateArgs] = useArgs();\n  const handleChange: RadioProps[\"onChange\"] = (value) => {\n    // toggle the checked value on click to simulate onChange\n    updateArgs({ currentValue: value });\n    // trigger the storybook action\n    currentArgs.onChange(value);\n  };\n  return (\n    <Radio\n      {...args}\n      onChange={handleChange}\n      containerProps={{ flexDirection: \"column\", rowGap: \"1rem\" }}\n    >\n      <Radio.ListElement\n        label=\"Ledger Verse\"\n        value=\"ledgerVerse\"\n        disabled\n        containerProps={{ flex: 1 }}\n      />\n      <Radio.ListElement label=\"Live Monad\" value=\"liveMonad\" containerProps={{ flex: 1 }} />\n      <Radio.ListElement label=\"Live Hub\" value=\"liveHub\" containerProps={{ flex: 1 }} />\n      <Radio.ListElement label=\"Live Meta\" value=\"liveMeta\" containerProps={{ flex: 1 }} />\n    </Radio>\n  );\n};\n\nexport const RadioGroupList: StoryTemplate<RadioProps> = TemplateListElement.bind({});\n\n// Set the disabled item to be checked on mount\nRadioGroup.args = { currentValue: \"purple\" };\nRadioGroupList.args = { currentValue: \"liveHub\" };\n"],
-  "mappings": "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",
-  "names": []
-}

package/lib/cjs/components/form/Radio/RadioElement.js

@@ -1,214 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-__export(exports, {
-  default: () => RadioElement_default
-});
-var import_react = __toModule(require("react"));
-var import_styled_components = __toModule(require("styled-components"));
-var import_helpers = __toModule(require("../../../styles/helpers"));
-var import_Text = __toModule(require("../../asorted/Text"));
-var import_index = __toModule(require("./index"));
-const Label = (0, import_styled_components.default)(import_Text.default)`
-  color: var(--ledger-ui-checkbox-color, ${(p) => p.theme.colors.neutral.c100});
-`;
-const Input = import_styled_components.default.input`
-  --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c50};
-  --ledger-ui-checkbox-size: 1.25rem;
-
-  position: relative;
-  appearance: none;
-  width: var(--ledger-ui-checkbox-size);
-  height: var(--ledger-ui-checkbox-size);
-  flex-shrink: 0;
-  border-radius: ${(p) => `${p.theme.radii[1]}px`};
-  border: 1px solid var(--ledger-ui-checkbox-color);
-  cursor: pointer;
-
-  &:checked::before {
-    position: absolute;
-    display: block;
-    content: " ";
-    background-color: var(--ledger-ui-checkbox-color);
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    margin: auto;
-    border-radius: 2px;
-    width: calc(var(--ledger-ui-checkbox-size) / 2);
-    height: calc(var(--ledger-ui-checkbox-size) / 2);
-  }
-
-  &[data-variant="default"] {
-    :hover {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c90};
-    }
-    :active {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c100};
-    }
-    :checked,
-    :focus {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c80};
-    }
-    :focus {
-      box-shadow: 0px 0px 0px 4px ${(p) => (0, import_helpers.rgba)(p.theme.colors.primary.c60, 0.48)};
-    }
-  }
-
-  &[data-variant="main"] {
-    :hover {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c90};
-    }
-    :active,
-    :checked,
-    :focus {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c100};
-    }
-    :focus {
-      box-shadow: 0px 0px 0px 4px ${(p) => (0, import_helpers.rgba)(p.theme.colors.neutral.c60, 0.48)};
-    }
-  }
-
-  &[data-variant="success"] {
-    :hover,
-    :checked:not([disabled]),
-    :checked:not([disabled]) + ${Label}, :focus {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.success.c100};
-    }
-    :focus {
-      box-shadow: 0px 0px 0px 4px ${(p) => (0, import_helpers.rgba)(p.theme.colors.success.c100, 0.48)};
-    }
-  }
-
-  &[data-variant="error"] {
-    :hover,
-    :checked:not([disabled]),
-    :checked:not([disabled]) + ${Label}, :focus {
-      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.error.c100};
-    }
-    :focus {
-      box-shadow: 0px 0px 0px 4px ${(p) => (0, import_helpers.rgba)(p.theme.colors.error.c100, 0.48)};
-    }
-  }
-
-  &[data-variant]:disabled {
-    --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c40};
-    cursor: unset;
-    background-color: ${(p) => p.theme.colors.neutral.c30};
-  }
-`;
-const outlinedCSS = import_styled_components.css`
-  padding: 20px;
-  border: 1px solid ${(p) => p.theme.colors.neutral.c50};
-  border-radius: ${(p) => p.theme.radii[2]}px;
-  &[data-variant="default"] {
-    :hover {
-      border-color: ${(p) => p.theme.colors.primary.c90};
-    }
-    &[data-checked] :active {
-      border-color: ${(p) => p.theme.colors.primary.c100};
-    }
-    :focus {
-      border-color: ${(p) => p.theme.colors.primary.c80};
-    }
-  }
-
-  &[data-variant="main"] {
-    :hover {
-      border-color: ${(p) => p.theme.colors.neutral.c90};
-    }
-    &[data-checked],
-    :active :focus {
-      border-color: ${(p) => p.theme.colors.neutral.c100};
-    }
-  }
-
-  &[data-variant="success"] {
-    &[data-checked]:not([disabled]) {
-      border-color: ${(p) => p.theme.colors.success.c100};
-    }
-    :hover {
-      border-color: ${(p) => p.theme.colors.success.c100};
-    }
-  }
-
-  &[data-variant="error"] {
-    &[data-checked]:not([disabled]) {
-      border-color: ${(p) => p.theme.colors.error.c100};
-    }
-    :hover {
-      border-color: ${(p) => p.theme.colors.error.c100};
-    }
-  }
-
-  &[data-variant]:disabled {
-    border-color: ${(p) => p.theme.colors.neutral.c40};
-    cursor: unset;
-  }
-`;
-const RadioElement = import_styled_components.default.label.attrs({ tabIndex: -1 })`
-  display: inline-flex;
-  column-gap: 0.75rem;
-  align-items: center;
-  cursor: pointer;
-  &[data-variant]:disabled {
-    cursor: unset;
-  }
-  ${(p) => p.outlined && outlinedCSS}
-`;
-const Element = ({
-  label,
-  value,
-  disabled,
-  outlined,
-  variant = "default",
-  ...props
-}) => {
-  const context = (0, import_react.useContext)(import_index.RadioContext);
-  if (context === void 0)
-    throw new Error("RadioElement must be used within a RadioProvider");
-  const isChecked = (0, import_react.useMemo)(() => context.currentValue === value, [context.currentValue]);
-  const handleChange = (event) => {
-    context.onChange(event.target.value);
-  };
-  return /* @__PURE__ */ import_react.default.createElement(RadioElement, {
-    "data-variant": variant,
-    ...isChecked ? { "data-checked": true } : {},
-    outlined
-  }, /* @__PURE__ */ import_react.default.createElement(Input, {
-    type: "radio",
-    "data-variant": variant,
-    checked: isChecked,
-    disabled,
-    onChange: handleChange,
-    value,
-    name: context.name,
-    ...props
-  }), /* @__PURE__ */ import_react.default.createElement(Label, {
-    variant: "paragraph"
-  }, label));
-};
-Element.displayName = "Radio.Element";
-var RadioElement_default = Element;
-//# sourceMappingURL=RadioElement.js.map

package/lib/cjs/components/form/Radio/RadioElement.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/components/form/Radio/RadioElement.tsx"],
-  "sourcesContent": ["import React, { InputHTMLAttributes, useContext, useMemo } from \"react\";\nimport styled, { css } from \"styled-components\";\n\nimport { rgba } from \"../../../styles/helpers\";\nimport Text from \"../../asorted/Text\";\nimport { RadioContext } from \"./index\";\n\nconst Label = styled(Text)`\n  color: var(--ledger-ui-checkbox-color, ${(p) => p.theme.colors.neutral.c100});\n`;\n\nconst Input = styled.input`\n  --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c50};\n  --ledger-ui-checkbox-size: 1.25rem;\n\n  position: relative;\n  appearance: none;\n  width: var(--ledger-ui-checkbox-size);\n  height: var(--ledger-ui-checkbox-size);\n  flex-shrink: 0;\n  border-radius: ${(p) => `${p.theme.radii[1]}px`};\n  border: 1px solid var(--ledger-ui-checkbox-color);\n  cursor: pointer;\n\n  &:checked::before {\n    position: absolute;\n    display: block;\n    content: \" \";\n    background-color: var(--ledger-ui-checkbox-color);\n    left: 0;\n    right: 0;\n    top: 0;\n    bottom: 0;\n    margin: auto;\n    border-radius: 2px;\n    width: calc(var(--ledger-ui-checkbox-size) / 2);\n    height: calc(var(--ledger-ui-checkbox-size) / 2);\n  }\n\n  &[data-variant=\"default\"] {\n    :hover {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c90};\n    }\n    :active {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c100};\n    }\n    :checked,\n    :focus {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.primary.c80};\n    }\n    :focus {\n      box-shadow: 0px 0px 0px 4px ${(p) => rgba(p.theme.colors.primary.c60, 0.48)};\n    }\n  }\n\n  &[data-variant=\"main\"] {\n    :hover {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c90};\n    }\n    :active,\n    :checked,\n    :focus {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c100};\n    }\n    :focus {\n      box-shadow: 0px 0px 0px 4px ${(p) => rgba(p.theme.colors.neutral.c60, 0.48)};\n    }\n  }\n\n  &[data-variant=\"success\"] {\n    :hover,\n    :checked:not([disabled]),\n    :checked:not([disabled]) + ${Label}, :focus {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.success.c100};\n    }\n    :focus {\n      box-shadow: 0px 0px 0px 4px ${(p) => rgba(p.theme.colors.success.c100, 0.48)};\n    }\n  }\n\n  &[data-variant=\"error\"] {\n    :hover,\n    :checked:not([disabled]),\n    :checked:not([disabled]) + ${Label}, :focus {\n      --ledger-ui-checkbox-color: ${(p) => p.theme.colors.error.c100};\n    }\n    :focus {\n      box-shadow: 0px 0px 0px 4px ${(p) => rgba(p.theme.colors.error.c100, 0.48)};\n    }\n  }\n\n  &[data-variant]:disabled {\n    --ledger-ui-checkbox-color: ${(p) => p.theme.colors.neutral.c40};\n    cursor: unset;\n    background-color: ${(p) => p.theme.colors.neutral.c30};\n  }\n`;\n\nconst outlinedCSS = css`\n  padding: 20px;\n  border: 1px solid ${(p) => p.theme.colors.neutral.c50};\n  border-radius: ${(p) => p.theme.radii[2]}px;\n  &[data-variant=\"default\"] {\n    :hover {\n      border-color: ${(p) => p.theme.colors.primary.c90};\n    }\n    &[data-checked] :active {\n      border-color: ${(p) => p.theme.colors.primary.c100};\n    }\n    :focus {\n      border-color: ${(p) => p.theme.colors.primary.c80};\n    }\n  }\n\n  &[data-variant=\"main\"] {\n    :hover {\n      border-color: ${(p) => p.theme.colors.neutral.c90};\n    }\n    &[data-checked],\n    :active :focus {\n      border-color: ${(p) => p.theme.colors.neutral.c100};\n    }\n  }\n\n  &[data-variant=\"success\"] {\n    &[data-checked]:not([disabled]) {\n      border-color: ${(p) => p.theme.colors.success.c100};\n    }\n    :hover {\n      border-color: ${(p) => p.theme.colors.success.c100};\n    }\n  }\n\n  &[data-variant=\"error\"] {\n    &[data-checked]:not([disabled]) {\n      border-color: ${(p) => p.theme.colors.error.c100};\n    }\n    :hover {\n      border-color: ${(p) => p.theme.colors.error.c100};\n    }\n  }\n\n  &[data-variant]:disabled {\n    border-color: ${(p) => p.theme.colors.neutral.c40};\n    cursor: unset;\n  }\n`;\n\nconst RadioElement = styled.label.attrs({ tabIndex: -1 })<{\n  outlined?: boolean;\n}>`\n  display: inline-flex;\n  column-gap: 0.75rem;\n  align-items: center;\n  cursor: pointer;\n  &[data-variant]:disabled {\n    cursor: unset;\n  }\n  ${(p) => p.outlined && outlinedCSS}\n`;\n\ntype InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, \"type\" | \"onChange\" | \"name\">;\n\nexport type RadioElementProps = InputAttributes & {\n  variant?: \"default\" | \"main\" | \"success\" | \"error\";\n  label: string;\n  outlined?: boolean;\n};\n\nconst Element = ({\n  label,\n  value,\n  disabled,\n  outlined,\n  variant = \"default\",\n  ...props\n}: RadioElementProps): JSX.Element => {\n  const context = useContext(RadioContext);\n  if (context === undefined) throw new Error(\"RadioElement must be used within a RadioProvider\");\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  const isChecked = useMemo(() => context.currentValue === value, [context.currentValue]);\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    context.onChange(event.target.value);\n  };\n\n  return (\n    <RadioElement\n      data-variant={variant}\n      {...(isChecked ? { \"data-checked\": true } : {})}\n      outlined={outlined}\n    >\n      <Input\n        type=\"radio\"\n        data-variant={variant}\n        checked={isChecked}\n        disabled={disabled}\n        onChange={handleChange}\n        value={value}\n        name={context.name}\n        {...props}\n      />\n      <Label variant=\"paragraph\">{label}</Label>\n    </RadioElement>\n  );\n};\n\nElement.displayName = \"Radio.Element\"; // For easy identification in the React devtools & in storybook\n\nexport default Element;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,mBAAgE;AAChE,+BAA4B;AAE5B,qBAAqB;AACrB,kBAAiB;AACjB,mBAA6B;AAE7B,MAAM,QAAQ,sCAAO;AAAA,2CACsB,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAGzE,MAAM,QAAQ,iCAAO;AAAA,gCACW,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAQ3C,CAAC,MAAM,GAAG,EAAE,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oCAqBP,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,oCAG9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,oCAI9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,oCAG9B,CAAC,MAAM,yBAAK,EAAE,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oCAMxC,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,oCAK9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,oCAG9B,CAAC,MAAM,yBAAK,EAAE,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAO3C;AAAA,oCACG,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,oCAG9B,CAAC,MAAM,yBAAK,EAAE,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAO5C;AAAA,oCACG,CAAC,MAAM,EAAE,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA,oCAG5B,CAAC,MAAM,yBAAK,EAAE,MAAM,OAAO,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,kCAKzC,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA,wBAExC,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAItD,MAAM,cAAc;AAAA;AAAA,sBAEE,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA,mBACjC,CAAC,MAAM,EAAE,MAAM,MAAM;AAAA;AAAA;AAAA,sBAGlB,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,sBAG9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,sBAG9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAM9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,sBAI9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAM9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,sBAG9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAM9B,CAAC,MAAM,EAAE,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA,sBAG5B,CAAC,MAAM,EAAE,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,oBAK9B,CAAC,MAAM,EAAE,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAKlD,MAAM,eAAe,iCAAO,MAAM,MAAM,EAAE,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUhD,CAAC,MAAM,EAAE,YAAY;AAAA;AAWzB,MAAM,UAAU,CAAC;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,UAAU;AAAA,KACP;AAAA,MACiC;AACpC,QAAM,UAAU,6BAAW;AAC3B,MAAI,YAAY;AAAW,UAAM,IAAI,MAAM;AAG3C,QAAM,YAAY,0BAAQ,MAAM,QAAQ,iBAAiB,OAAO,CAAC,QAAQ;AAEzE,QAAM,eAAe,CAAC,UAA+C;AACnE,YAAQ,SAAS,MAAM,OAAO;AAAA;AAGhC,SACE,mDAAC,cAAD;AAAA,IACE,gBAAc;AAAA,OACT,YAAY,EAAE,gBAAgB,SAAS;AAAA,IAC5C;AAAA,KAEA,mDAAC,OAAD;AAAA,IACE,MAAK;AAAA,IACL,gBAAc;AAAA,IACd,SAAS;AAAA,IACT;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,MAAM,QAAQ;AAAA,OACV;AAAA,MAEN,mDAAC,OAAD;AAAA,IAAO,SAAQ;AAAA,KAAa;AAAA;AAKlC,QAAQ,cAAc;AAEtB,IAAO,uBAAQ;",
-  "names": []
-}

package/lib/cjs/components/form/Radio/RadioElement.stories.js

@@ -1,76 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __export = (target, all) => {
-  __markAsModule(target);
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-__export(exports, {
-  RadioElement: () => RadioElement,
-  default: () => RadioElement_stories_default
-});
-var import_react = __toModule(require("react"));
-var import_Text = __toModule(require("../../asorted/Text"));
-var import_Flex = __toModule(require("../../layout/Flex"));
-var import_index = __toModule(require("./index"));
-var RadioElement_stories_default = {
-  title: "Form/Radio"
-};
-const Template = () => {
-  const sections = [
-    { title: "default" },
-    { title: "success" },
-    { title: "error" }
-  ];
-  return sections.map(({ title }) => /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
-    mb: "3rem",
-    rowGap: "1rem",
-    flexDirection: "column",
-    key: title
-  }, /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
-    variant: "h2",
-    textTransform: "uppercase"
-  }, title), /* @__PURE__ */ import_react.default.createElement(import_index.default, {
-    currentValue: "third",
-    onChange: () => {
-    },
-    name: title
-  }, /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "unselected",
-    value: "first",
-    variant: title
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "selected",
-    value: "third",
-    variant: title
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "disabled",
-    value: "two",
-    variant: title,
-    disabled: true
-  }), /* @__PURE__ */ import_react.default.createElement(import_index.default.Element, {
-    label: "selected and disabled",
-    value: "two",
-    variant: title,
-    disabled: true,
-    checked: true
-  }))));
-};
-const RadioElement = Template.bind({});
-//# sourceMappingURL=RadioElement.stories.js.map

package/lib/cjs/components/form/Radio/RadioElement.stories.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../src/components/form/Radio/RadioElement.stories.tsx"],
-  "sourcesContent": ["import React from \"react\";\n\nimport Text from \"../../asorted/Text\";\nimport Flex from \"../../layout/Flex\";\nimport Radio from \"./index\";\nimport type { RadioElementProps } from \"./RadioElement\";\n\nexport default {\n  title: \"Form/Radio\",\n};\n\nconst Template = () => {\n  const sections: Array<{ title: NonNullable<RadioElementProps[\"variant\"]> }> = [\n    { title: \"default\" },\n    { title: \"success\" },\n    { title: \"error\" },\n  ];\n\n  return sections.map(({ title }) => (\n    <Flex mb=\"3rem\" rowGap=\"1rem\" flexDirection=\"column\" key={title}>\n      <Text variant=\"h2\" textTransform=\"uppercase\">\n        {title}\n      </Text>\n      <Radio currentValue=\"third\" onChange={() => {}} name={title}>\n        <Radio.Element label=\"unselected\" value=\"first\" variant={title} />\n        <Radio.Element label=\"selected\" value=\"third\" variant={title} />\n        <Radio.Element label=\"disabled\" value=\"two\" variant={title} disabled />\n        <Radio.Element label=\"selected and disabled\" value=\"two\" variant={title} disabled checked />\n      </Radio>\n    </Flex>\n  ));\n};\n\nexport const RadioElement = Template.bind({});\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,kBAAiB;AACjB,kBAAiB;AACjB,mBAAkB;AAGlB,IAAO,+BAAQ;AAAA,EACb,OAAO;AAAA;AAGT,MAAM,WAAW,MAAM;AACrB,QAAM,WAAwE;AAAA,IAC5E,EAAE,OAAO;AAAA,IACT,EAAE,OAAO;AAAA,IACT,EAAE,OAAO;AAAA;AAGX,SAAO,SAAS,IAAI,CAAC,EAAE,YACrB,mDAAC,qBAAD;AAAA,IAAM,IAAG;AAAA,IAAO,QAAO;AAAA,IAAO,eAAc;AAAA,IAAS,KAAK;AAAA,KACxD,mDAAC,qBAAD;AAAA,IAAM,SAAQ;AAAA,IAAK,eAAc;AAAA,KAC9B,QAEH,mDAAC,sBAAD;AAAA,IAAO,cAAa;AAAA,IAAQ,UAAU,MAAM;AAAA;AAAA,IAAI,MAAM;AAAA,KACpD,mDAAC,qBAAM,SAAP;AAAA,IAAe,OAAM;AAAA,IAAa,OAAM;AAAA,IAAQ,SAAS;AAAA,MACzD,mDAAC,qBAAM,SAAP;AAAA,IAAe,OAAM;AAAA,IAAW,OAAM;AAAA,IAAQ,SAAS;AAAA,MACvD,mDAAC,qBAAM,SAAP;AAAA,IAAe,OAAM;AAAA,IAAW,OAAM;AAAA,IAAM,SAAS;AAAA,IAAO,UAAQ;AAAA,MACpE,mDAAC,qBAAM,SAAP;AAAA,IAAe,OAAM;AAAA,IAAwB,OAAM;AAAA,IAAM,SAAS;AAAA,IAAO,UAAQ;AAAA,IAAC,SAAO;AAAA;AAAA;AAM1F,MAAM,eAAe,SAAS,KAAK;",
-  "names": []
-}