@charcoal-ui/react 3.10.1-beta.1 → 4.0.0-beta.0

package/dist/components/Button/StyledButton.d.ts

@@ -1,13 +0,0 @@
-import { variantToFont } from './lib/variantToFont';
-import { variantToBackground } from './lib/variantToBackground';
-import type { Size } from '.';
-type StyledButtonProps = {
-    $fullWidth: boolean;
-    $size: Size;
-    $background: ReturnType<typeof variantToBackground>;
-    $color: ReturnType<typeof variantToFont>;
-    $isActive: boolean;
-};
-export declare const StyledButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Clickable").ClickableProps & import("react").RefAttributes<import("../Clickable").ClickableElement>>, import("styled-components").DefaultTheme, StyledButtonProps, never>;
-export {};
-//# sourceMappingURL=StyledButton.d.ts.map

package/dist/components/Button/StyledButton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"StyledButton.d.ts","sourceRoot":"","sources":["../../../src/components/Button/StyledButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACnD,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAA;AAC/D,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,GAAG,CAAA;AAa7B,KAAK,iBAAiB,GAAG;IACvB,UAAU,EAAE,OAAO,CAAA;IACnB,KAAK,EAAE,IAAI,CAAA;IACX,WAAW,EAAE,UAAU,CAAC,OAAO,mBAAmB,CAAC,CAAA;IACnD,MAAM,EAAE,UAAU,CAAC,OAAO,aAAa,CAAC,CAAA;IACxC,SAAS,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,YAAY,4QA6CxB,CAAA"}

package/dist/components/Button/lib/variantToBackground.d.ts

@@ -1,3 +0,0 @@
-import type { Variant } from '..';
-export declare function variantToBackground(variant: Variant): "assertive" | "surface4" | "surface3" | "brand" | "surface6";
-//# sourceMappingURL=variantToBackground.d.ts.map

package/dist/components/Button/lib/variantToBackground.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"variantToBackground.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/lib/variantToBackground.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,IAAI,CAAA;AAEjC,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,OAAO,gEAenD"}

package/dist/components/Button/lib/variantToFont.d.ts

@@ -1,3 +0,0 @@
-import type { Variant } from '..';
-export declare function variantToFont(variant: Variant): "text5" | "text2";
-//# sourceMappingURL=variantToFont.d.ts.map

package/dist/components/Button/lib/variantToFont.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"variantToFont.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/lib/variantToFont.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,IAAI,CAAA;AAEjC,wBAAgB,aAAa,CAAC,OAAO,EAAE,OAAO,qBAe7C"}

package/src/components/Button/StyledButton.tsx

@@ -1,71 +0,0 @@
-import styled, { css } from 'styled-components'
-import Clickable from '../Clickable'
-import { variantToFont } from './lib/variantToFont'
-import { variantToBackground } from './lib/variantToBackground'
-import type { Size } from '.'
-import { focusVisibleFocusRingCss } from '@charcoal-ui/styled'
-
-const horizontalPaddingSmall = css`
-  padding-right: 16px;
-  padding-left: 16px;
-`
-
-const horizontalPaddingMedium = css`
-  padding-right: 24px;
-  padding-left: 24px;
-`
-
-type StyledButtonProps = {
-  $fullWidth: boolean
-  $size: Size
-  $background: ReturnType<typeof variantToBackground>
-  $color: ReturnType<typeof variantToFont>
-  $isActive: boolean
-}
-
-export const StyledButton = styled(Clickable)<StyledButtonProps>`
-  width: ${(p) => (p.$fullWidth ? 'stretch' : 'min-content')};
-  display: inline-grid;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  user-select: none;
-  white-space: nowrap;
-  border-radius: 999999px;
-  font-size: 14px;
-  line-height: 22px;
-  font-weight: bold;
-
-  ${(p) => (p.$size === 'M' ? horizontalPaddingMedium : horizontalPaddingSmall)}
-  color: var(--charcoal-${(p) => p.$color});
-  background-color: var(--charcoal-${(p) => p.$background});
-  transition: 0.2s color, 0.2s background-color, 0.2s box-shadow;
-
-  &:not(:disabled):not([aria-disabled]),
-  &[aria-disabled='false'] {
-    ${focusVisibleFocusRingCss}
-
-    ${({ $isActive: $active, $color, $background }) =>
-      $active
-        ? css`
-            color: var(--charcoal-${$color}-press);
-            background-color: var(--charcoal-${$background}-press);
-          `
-        : css`
-            &:hover {
-              color: var(--charcoal-${$color}-hover);
-              background-color: var(--charcoal-${$background}-hover);
-            }
-            &:active {
-              color: var(--charcoal-${$color}-press);
-              background-color: var(--charcoal-${$background}-press);
-            }
-          `}
-  }
-
-  &:disabled,
-  &[aria-disabled]:not([aria-disabled='false']) {
-    opacity: 0.32;
-  }
-  height: ${(p) => (p.$size === 'M' ? 40 : 32)}px;
-`

package/src/components/Button/lib/variantToBackground.tsx

@@ -1,19 +0,0 @@
-import { unreachable } from '../../../_lib'
-import type { Variant } from '..'
-
-export function variantToBackground(variant: Variant) {
-  switch (variant) {
-    case 'Overlay':
-      return 'surface4'
-    case 'Default':
-      return 'surface3'
-    case 'Primary':
-      return 'brand'
-    case 'Navigation':
-      return 'surface6'
-    case 'Danger':
-      return 'assertive'
-    default:
-      return unreachable(variant)
-  }
-}

package/src/components/Button/lib/variantToFont.tsx

@@ -1,19 +0,0 @@
-import { unreachable } from '../../../_lib'
-import type { Variant } from '..'
-
-export function variantToFont(variant: Variant) {
-  switch (variant) {
-    case 'Overlay':
-      return 'text5'
-    case 'Default':
-      return 'text2'
-    case 'Primary':
-      return 'text5'
-    case 'Navigation':
-      return 'text5'
-    case 'Danger':
-      return 'text5'
-    default:
-      return unreachable(variant)
-  }
-}