Merge branch 'main' into update-checkboxrow-disabled

ensdomains · Feb 15, 2023 · 9edd805 · 9edd805
2 parents 7924af5 + 88ace59
commit 9edd805
Show file tree

Hide file tree

Showing 14 changed files with 556 additions and 1,117 deletions.
diff --git a/components/package.json b/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ensdomains/thorin",
-  "version": "0.6.25-alpha-2",
+  "version": "0.6.27",
   "description": "A web3 native design system",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",

diff --git a/components/src/components/atoms/Button/Button.tsx b/components/src/components/atoms/Button/Button.tsx
@@ -46,6 +46,8 @@ type BaseProps = {
   count?: number
   /** The handler for click events. */
   onClick?: NativeButtonProps['onClick']
+  /** Show indicator that button has extra info via tooltip. */
+  shouldShowTooltipIndicator?: boolean
 } & Omit<NativeButtonProps, 'prefix' | 'size'>
 
 type WithAnchor = {
@@ -247,6 +249,20 @@ const Counter = styled.div<{ $visible: boolean }>(
   `,
 )
 
+const TooltipIndicator = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #e9b911;
+  border-radius: 50%;
+  width: 24px;
+  height: 24px;
+  position: absolute;
+  right: -10px;
+  top: -10px;
+  color: white;
+`
+
 export type Props = BaseProps & (WithoutAnchor | WithAnchor) & WithColorStyle
 
 export const Button = React.forwardRef(
@@ -272,6 +288,7 @@ export const Button = React.forwardRef(
       width,
       fullWidthContent,
       count,
+      shouldShowTooltipIndicator,
       as: asProp,
       ...props
     }: Props,
@@ -333,6 +350,10 @@ export const Button = React.forwardRef(
         zIndex={zIndex}
         onClick={onClick}
       >
+        {shouldShowTooltipIndicator && (
+          <TooltipIndicator data-testid="tooltip-indicator">?</TooltipIndicator>
+        )}
+
         {childContent}
         <CounterWrapper>
           <Counter $visible={!!count}>{count}</Counter>