@blockscout/ui-toolkit 0.0.1-alpha.0 → 0.0.1-alpha.2

package/dist/theme/recipes/drawer.recipe.js

@@ -1,168 +0,0 @@
-import { defineSlotRecipe as e } from "@chakra-ui/react";
-const o = e({
-  slots: ["root", "backdrop", "trigger", "content", "header", "body", "footer", "title", "description", "positioner"],
-  className: "chakra-drawer",
-  base: {
-    backdrop: {
-      bg: "blackAlpha.800",
-      pos: "fixed",
-      insetInlineStart: 0,
-      top: 0,
-      w: "100vw",
-      h: "100dvh",
-      zIndex: "modal",
-      _open: {
-        animationName: "fade-in",
-        animationDuration: "slow"
-      },
-      _closed: {
-        animationName: "fade-out",
-        animationDuration: "moderate"
-      }
-    },
-    positioner: {
-      display: "flex",
-      width: "100vw",
-      height: "100dvh",
-      position: "fixed",
-      insetInlineStart: 0,
-      top: 0,
-      zIndex: "modal",
-      overscrollBehaviorY: "none"
-    },
-    content: {
-      display: "flex",
-      flexDirection: "column",
-      position: "relative",
-      width: "100%",
-      outline: 0,
-      zIndex: "modal",
-      textStyle: "sm",
-      maxH: "100dvh",
-      color: "inherit",
-      bg: "drawer.bg",
-      boxShadow: "drawer",
-      _open: {
-        animationDuration: "slowest",
-        animationTimingFunction: "ease-in-smooth"
-      },
-      _closed: {
-        animationDuration: "slower",
-        animationTimingFunction: "ease-in-smooth"
-      }
-    },
-    header: {
-      flex: 0,
-      px: "6",
-      pt: "6",
-      pb: "4"
-    },
-    body: {
-      p: "6",
-      flex: "1",
-      overflow: "auto"
-    },
-    footer: {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "flex-end",
-      gap: "3",
-      px: "6",
-      pt: "2",
-      pb: "4"
-    },
-    title: {
-      textStyle: "lg",
-      fontWeight: "semibold"
-    },
-    description: {
-      color: "fg.muted"
-    }
-  },
-  variants: {
-    size: {
-      md: {
-        content: {
-          maxW: "300px"
-        }
-      }
-    },
-    placement: {
-      start: {
-        positioner: {
-          justifyContent: "flex-start"
-        },
-        content: {
-          _open: {
-            animationName: {
-              base: "slide-from-left-full, fade-in",
-              _rtl: "slide-from-right-full, fade-in"
-            }
-          },
-          _closed: {
-            animationName: {
-              base: "slide-to-left-full, fade-out",
-              _rtl: "slide-to-right-full, fade-out"
-            }
-          }
-        }
-      },
-      end: {
-        positioner: {
-          justifyContent: "flex-end"
-        },
-        content: {
-          _open: {
-            animationName: {
-              base: "slide-from-right-full, fade-in",
-              _rtl: "slide-from-left-full, fade-in"
-            }
-          },
-          _closed: {
-            animationName: {
-              base: "slide-to-right-full, fade-out",
-              _rtl: "slide-to-right-full, fade-out"
-            }
-          }
-        }
-      },
-      top: {
-        positioner: {
-          alignItems: "flex-start"
-        },
-        content: {
-          maxW: "100%",
-          _open: { animationName: "slide-from-top-full, fade-in" },
-          _closed: { animationName: "slide-to-top-full, fade-out" }
-        }
-      },
-      bottom: {
-        positioner: {
-          alignItems: "flex-end"
-        },
-        content: {
-          maxW: "100%",
-          _open: { animationName: "slide-from-bottom-full, fade-in" },
-          _closed: { animationName: "slide-to-bottom-full, fade-out" }
-        }
-      }
-    },
-    contained: {
-      true: {
-        positioner: {
-          padding: "4"
-        },
-        content: {
-          borderRadius: "l3"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    size: "md",
-    placement: "end"
-  }
-});
-export {
-  o as recipe
-};

package/dist/theme/recipes/field.recipe.js

@@ -1,174 +0,0 @@
-import { defineSlotRecipe as e } from "@chakra-ui/react";
-const i = e({
-  className: "chakra-field",
-  slots: ["root", "label", "requiredIndicator", "errorText", "helperText"],
-  base: {
-    requiredIndicator: {
-      color: "inherit",
-      lineHeight: "inherit"
-    },
-    root: {
-      display: "flex",
-      width: "100%",
-      position: "relative",
-      gap: "1"
-    },
-    label: {
-      display: "flex",
-      alignItems: "center",
-      textAlign: "start",
-      textStyle: "sm",
-      fontWeight: "500",
-      gap: "0",
-      userSelect: "none",
-      zIndex: "1",
-      _disabled: {
-        opacity: "control.disabled"
-      },
-      _invalid: {
-        color: "input.fg.error"
-      }
-    },
-    errorText: {
-      display: "inline-flex",
-      alignItems: "center",
-      fontWeight: "medium",
-      gap: "1",
-      color: "input.fg.error",
-      textStyle: "sm"
-    },
-    helperText: {
-      color: "fg.muted",
-      textStyle: "sm"
-    }
-  },
-  variants: {
-    floating: {
-      true: {
-        label: {
-          pos: "absolute",
-          bg: "bg",
-          top: "2px",
-          left: "2px",
-          color: "input.placeholder",
-          width: "calc(100% - 4px)",
-          borderRadius: "base",
-          pointerEvents: "none",
-          transformOrigin: "top left",
-          transitionProperty: "font-size, line-height, padding, background-color",
-          transitionDuration: "fast",
-          transitionTimingFunction: "ease"
-        }
-      }
-    },
-    size: {
-      sm: {
-        label: {
-          fontSize: "sm"
-        }
-      },
-      md: {
-        label: {
-          fontSize: "md"
-        }
-      },
-      lg: {
-        label: {
-          fontSize: "md"
-        }
-      },
-      // special size for textarea
-      "2xl": {
-        label: {
-          fontSize: "md"
-        }
-      }
-    },
-    orientation: {
-      vertical: {
-        root: {
-          flexDirection: "column",
-          alignItems: "flex-start"
-        }
-      },
-      horizontal: {
-        root: {
-          flexDirection: "row",
-          alignItems: "center",
-          justifyContent: "space-between"
-        },
-        label: {
-          flex: "0 0 var(--field-label-width, 80px)"
-        }
-      }
-    }
-  },
-  compoundVariants: [
-    {
-      size: "lg",
-      floating: !0,
-      css: {
-        label: {
-          whiteSpace: "nowrap",
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          padding: "10px 16px 0px 16px",
-          textStyle: "xs",
-          _peerPlaceholderShown: {
-            padding: "16px",
-            textStyle: "md"
-          },
-          _peerFocusVisible: {
-            padding: "10px 16px 0px 16px",
-            textStyle: "xs"
-          },
-          _readOnly: {
-            bg: "input.bg.readOnly"
-          }
-        },
-        errorText: {
-          fontSize: "inherit",
-          lineHeight: "inherit"
-        }
-      }
-    },
-    {
-      size: "2xl",
-      floating: !0,
-      css: {
-        label: {
-          whiteSpace: "nowrap",
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          // 20px = scrollbar width
-          // 4px = border width
-          width: "calc(100% - 4px - 20px)",
-          padding: "16px 16px 0px 16px",
-          textStyle: "xs",
-          borderTopRightRadius: "0px",
-          borderBottomRightRadius: "0px",
-          _peerPlaceholderShown: {
-            textStyle: "md"
-          },
-          _peerFocusVisible: {
-            textStyle: "xs"
-          },
-          _readOnly: {
-            bg: "input.bg.readOnly"
-          }
-        },
-        errorText: {
-          fontSize: "inherit",
-          lineHeight: "inherit"
-        }
-      }
-    }
-  ],
-  defaultVariants: {
-    floating: !1,
-    orientation: "vertical"
-  }
-});
-export {
-  i as recipe
-};

package/dist/theme/recipes/index.js

@@ -1,69 +0,0 @@
-import { recipe as e } from "./accordion.recipe.js";
-import { recipe as r } from "./alert.recipe.js";
-import { recipe as i } from "./badge.recipe.js";
-import { recipe as p } from "./button.recipe.js";
-import { recipe as o } from "./checkbox.recipe.js";
-import { recipe as c } from "./checkmark.recipe.js";
-import { recipe as m } from "./close-button.recipe.js";
-import { recipe as t } from "./dialog.recipe.js";
-import { recipe as a } from "./drawer.recipe.js";
-import { recipe as s } from "./field.recipe.js";
-import { recipe as f } from "./input.recipe.js";
-import { recipe as $ } from "./link.recipe.js";
-import { recipe as n } from "./list.recipe.js";
-import { recipe as l } from "./menu.recipe.js";
-import { recipe as d } from "./pin-input.recipe.js";
-import { recipe as u } from "./popover.recipe.js";
-import { recipe as k } from "./progress-circle.recipe.js";
-import { recipe as b } from "./radio-group.recipe.js";
-import { recipe as g } from "./radiomark.recipe.js";
-import { recipe as h } from "./rating-group.recipe.js";
-import { recipe as x } from "./select.recipe.js";
-import { recipe as w } from "./skeleton.recipe.js";
-import { recipe as G } from "./spinner.recipe.js";
-import { recipe as j } from "./stat.recipe.js";
-import { recipe as q } from "./switch.recipe.js";
-import { recipe as v } from "./table.recipe.js";
-import { recipe as B } from "./tabs.recipe.js";
-import { recipe as C } from "./tag.recipe.js";
-import { recipe as I } from "./textarea.recipe.js";
-import { recipe as R } from "./toast.recipe.js";
-import { recipe as y } from "./tooltip.recipe.js";
-const ae = {
-  badge: i,
-  button: p,
-  checkmark: c,
-  closeButton: m,
-  input: f,
-  link: $,
-  radiomark: g,
-  skeleton: w,
-  spinner: G,
-  textarea: I
-}, se = {
-  accordion: e,
-  alert: r,
-  checkbox: o,
-  dialog: t,
-  drawer: a,
-  field: s,
-  list: n,
-  menu: l,
-  pinInput: d,
-  popover: u,
-  progressCircle: k,
-  radioGroup: b,
-  ratingGroup: h,
-  select: x,
-  stat: j,
-  switch: q,
-  table: v,
-  tabs: B,
-  tag: C,
-  toast: R,
-  tooltip: y
-};
-export {
-  ae as recipes,
-  se as slotRecipes
-};

package/dist/theme/recipes/input.recipe.js

@@ -1,116 +0,0 @@
-import { defineRecipe as r } from "@chakra-ui/react";
-const e = r({
-  base: {
-    width: "100%",
-    minWidth: "0",
-    outline: "0",
-    position: "relative",
-    appearance: "textfield",
-    textAlign: "start",
-    borderRadius: "base",
-    height: "var(--input-height)",
-    minW: "var(--input-height)",
-    color: "input.fg",
-    "--focus-color": "colors.border.error",
-    "--error-color": "colors.border.error",
-    _invalid: {
-      focusRingColor: "var(--error-color)",
-      borderColor: "var(--error-color)"
-    },
-    _readOnly: {
-      overflow: "hidden",
-      textOverflow: "ellipsis",
-      whiteSpace: "nowrap"
-    }
-  },
-  variants: {
-    size: {
-      sm: {
-        textStyle: "sm",
-        px: "2",
-        "--input-height": "sizes.8"
-      },
-      md: {
-        textStyle: "sm",
-        px: "2",
-        "--input-height": "sizes.10"
-      },
-      lg: {
-        textStyle: "md",
-        px: "4",
-        "--input-height": "60px"
-      }
-    },
-    variant: {
-      outline: {
-        bg: "input.bg",
-        borderWidth: "2px",
-        borderColor: "input.border.filled",
-        focusVisibleRing: "none",
-        _placeholder: {
-          color: "input.placeholder"
-        },
-        _placeholderShown: {
-          borderColor: "input.border",
-          _invalid: {
-            borderColor: "input.border.error"
-          }
-        },
-        _hover: {
-          borderColor: "input.border.hover"
-        },
-        _focus: {
-          borderColor: "input.border.focus",
-          boxShadow: "size.md",
-          _hover: {
-            borderColor: "input.border.focus"
-          }
-        },
-        _readOnly: {
-          userSelect: "all",
-          pointerEvents: "none",
-          bg: "input.bg.readOnly",
-          borderColor: "input.border.readOnly",
-          _focus: {
-            borderColor: "input.border.readOnly"
-          },
-          _hover: {
-            borderColor: "input.border.readOnly"
-          }
-        },
-        _disabled: {
-          opacity: "control.disabled"
-        },
-        _invalid: {
-          borderColor: "input.border.error",
-          _placeholder: {
-            color: "input.placeholder.error"
-          },
-          _hover: {
-            borderColor: "input.border.error"
-          }
-        }
-      }
-    },
-    floating: {
-      true: {}
-    }
-  },
-  compoundVariants: [
-    {
-      size: "lg",
-      floating: !0,
-      css: {
-        padding: "26px 10px 10px 16px"
-      }
-    }
-  ],
-  defaultVariants: {
-    size: "md",
-    variant: "outline",
-    floating: !1
-  }
-});
-export {
-  e as recipe
-};

package/dist/theme/recipes/link.recipe.js

@@ -1,88 +0,0 @@
-import { defineRecipe as o } from "@chakra-ui/react";
-const r = o({
-  base: {
-    gap: 0,
-    _disabled: {
-      cursor: "not-allowed"
-    }
-  },
-  variants: {
-    variant: {
-      primary: {
-        color: "link.primary",
-        _hover: {
-          textDecoration: "none",
-          color: "link.primary.hover"
-        }
-      },
-      secondary: {
-        color: "link.secondary",
-        _hover: {
-          textDecoration: "none",
-          color: "link.primary.hover"
-        }
-      },
-      subtle: {
-        color: "link.subtle",
-        _hover: {
-          color: "link.subtle.hover",
-          textDecorationLine: "underline",
-          textDecorationColor: "link.subtle.hover"
-        }
-      },
-      underlaid: {
-        color: "link.primary",
-        bgColor: "link.underlaid.bg",
-        px: "8px",
-        py: "6px",
-        borderRadius: "base",
-        textStyle: "sm",
-        _hover: {
-          color: "link.primary.hover",
-          textDecoration: "none"
-        },
-        _loading: {
-          bgColor: "unset"
-        },
-        "&:not([data-loading], [aria-busy=true])": {
-          bgColor: "link.underlaid.bg"
-        }
-      },
-      menu: {
-        color: "link.menu",
-        _hover: {
-          color: "link.primary.hover",
-          textDecoration: "none"
-        }
-      },
-      navigation: {
-        color: "link.navigation.fg",
-        bg: "link.navigation.bg",
-        border: "link.navigation.border",
-        _hover: {
-          color: "link.navigation.fg.hover",
-          textDecoration: "none"
-        },
-        _selected: {
-          color: "link.navigation.fg.selected",
-          bg: "link.navigation.bg.selected",
-          border: "link.navigation.border.selected"
-        },
-        _active: {
-          color: "link.navigation.fg.active"
-        }
-      },
-      plain: {
-        _hover: {
-          textDecoration: "none"
-        }
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "primary"
-  }
-});
-export {
-  r as recipe
-};

package/dist/theme/recipes/list.recipe.js

@@ -1,65 +0,0 @@
-import { defineSlotRecipe as e } from "@chakra-ui/react";
-const t = e({
-  slots: ["root", "item", "indicator"],
-  base: {
-    root: {
-      display: "flex",
-      flexDirection: "column",
-      gap: "var(--list-gap)",
-      "& :where(ul, ol)": {
-        marginTop: "var(--list-gap)"
-      }
-    },
-    item: {
-      whiteSpace: "normal",
-      display: "list-item",
-      "&::marker": {
-        color: "inherit"
-      }
-    },
-    indicator: {
-      marginEnd: "2",
-      minHeight: "1lh",
-      flexShrink: 0,
-      display: "inline-block",
-      verticalAlign: "middle"
-    }
-  },
-  variants: {
-    variant: {
-      marker: {
-        root: {
-          listStyle: "revert"
-        },
-        item: {
-          _marker: {
-            color: "inherit"
-          }
-        }
-      },
-      plain: {
-        item: {
-          alignItems: "flex-start",
-          display: "inline-flex"
-        }
-      }
-    },
-    align: {
-      center: {
-        item: { alignItems: "center" }
-      },
-      start: {
-        item: { alignItems: "flex-start" }
-      },
-      end: {
-        item: { alignItems: "flex-end" }
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "marker"
-  }
-});
-export {
-  t as recipe
-};