@blockscout/ui-toolkit 0.0.1-alpha.1 → 0.0.1-alpha.3

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/index.ts

@@ -1,68 +0,0 @@
-import { recipe as accordion } from './accordion.recipe';
-import { recipe as alert } from './alert.recipe';
-import { recipe as badge } from './badge.recipe';
-import { recipe as button } from './button.recipe';
-import { recipe as checkbox } from './checkbox.recipe';
-import { recipe as checkmark } from './checkmark.recipe';
-import { recipe as closeButton } from './close-button.recipe';
-import { recipe as dialog } from './dialog.recipe';
-import { recipe as drawer } from './drawer.recipe';
-import { recipe as field } from './field.recipe';
-import { recipe as input } from './input.recipe';
-import { recipe as link } from './link.recipe';
-import { recipe as list } from './list.recipe';
-import { recipe as menu } from './menu.recipe';
-import { recipe as pinInput } from './pin-input.recipe';
-import { recipe as popover } from './popover.recipe';
-import { recipe as progressCircle } from './progress-circle.recipe';
-import { recipe as radioGroup } from './radio-group.recipe';
-import { recipe as radiomark } from './radiomark.recipe';
-import { recipe as ratingGroup } from './rating-group.recipe';
-import { recipe as select } from './select.recipe';
-import { recipe as skeleton } from './skeleton.recipe';
-import { recipe as spinner } from './spinner.recipe';
-import { recipe as stat } from './stat.recipe';
-import { recipe as switchRecipe } from './switch.recipe';
-import { recipe as table } from './table.recipe';
-import { recipe as tabs } from './tabs.recipe';
-import { recipe as tag } from './tag.recipe';
-import { recipe as textarea } from './textarea.recipe';
-import { recipe as toast } from './toast.recipe';
-import { recipe as tooltip } from './tooltip.recipe';
-
-export const recipes = {
-  badge,
-  button,
-  checkmark,
-  closeButton,
-  input,
-  link,
-  radiomark,
-  skeleton,
-  spinner,
-  textarea,
-};
-
-export const slotRecipes = {
-  accordion,
-  alert,
-  checkbox,
-  dialog,
-  drawer,
-  field,
-  list,
-  menu,
-  pinInput,
-  popover,
-  progressCircle,
-  radioGroup,
-  ratingGroup,
-  select,
-  stat,
-  'switch': switchRecipe,
-  table,
-  tabs,
-  tag,
-  toast,
-  tooltip,
-};

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/input.recipe.ts

@@ -1,119 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react';
-
-export const recipe = defineRecipe({
-  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: true,
-      css: {
-        padding: '26px 10px 10px 16px',
-      },
-    },
-  ],
-
-  defaultVariants: {
-    size: 'md',
-    variant: 'outline',
-    floating: false,
-  },
-});

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/link.recipe.ts

@@ -1,86 +0,0 @@
-import { defineRecipe } from '@chakra-ui/react';
-
-export const recipe = defineRecipe({
-  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',
-  },
-});

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
-};

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

@@ -1,67 +0,0 @@
-import { defineSlotRecipe } from '@chakra-ui/react';
-
-export const recipe = defineSlotRecipe({
-  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',
-  },
-});