@soul-refiner/design-system 0.1.38 → 0.1.39

package/src/components/iconography/avatar/icons/focus.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-
-export const Focus = () => (
-  <svg fill="none" viewBox="0 0 18 18">
-    <rect width="16" height="16" x="1" y="1" fill="#fff" rx="8" />
-    <path
-      fill="#A246C1"
-      d="M9 16A7 7 0 1 1 9 2a7 7 0 0 1 0 14Zm0-2.333a4.667 4.667 0 1 0 0-9.334 4.667 4.667 0 0 0 0 9.334Zm0-2.334a2.333 2.333 0 1 1 0-4.666 2.333 2.333 0 0 1 0 4.666Z"
-    />
-    <rect
-      width="16"
-      height="16"
-      x="1"
-      y="1"
-      stroke="#F8F9F9"
-      strokeWidth="2"
-      rx="8"
-    />
-  </svg>
-);

package/src/components/iconography/avatar/icons/index.ts

@@ -1,9 +0,0 @@
-export { Approved } from './approved';
-export { Busy } from './busy';
-export { Declined } from './declined';
-export { Default } from './default';
-export { Focus } from './focus';
-export { Locked } from './locked';
-export { Offline } from './offline';
-export { Online } from './online';
-export { Subscribed } from './subscribed';

package/src/components/iconography/avatar/icons/locked.tsx

@@ -1,20 +0,0 @@
-import React from 'react';
-
-export const Locked = () => (
-  <svg fill="none" viewBox="0 0 18 18">
-    <rect width="16" height="16" x="1" y="1" fill="#B3B7BC" rx="8" />
-    <path
-      fill="#4A4F55"
-      d="M9.023 4.594H8.98c-1.221 0-2.21.973-2.21 2.175V7.89h1.116V6.78c0-.6.494-1.087 1.105-1.087h.022c.61 0 1.105.486 1.105 1.087v1.11h1.116V6.77c0-1.203-.989-2.176-2.21-2.176ZM6.77 7.89h1.116V8.99H6.769V7.89Zm3.348 0h1.116V8.99h-1.116V7.89Zm0 1.099H6.77c-.616 0-1.116.492-1.116 1.099v1.648c0 .91.742 1.648 1.655 1.648h3.386c.914 0 1.655-.732 1.655-1.648v-1.648c0-.607-.5-1.1-1.116-1.1h-1.116Z"
-    />
-    <rect
-      width="16"
-      height="16"
-      x="1"
-      y="1"
-      stroke="#F8F9F9"
-      strokeWidth="2"
-      rx="8"
-    />
-  </svg>
-);

package/src/components/iconography/avatar/icons/offline.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-
-export const Offline = () => (
-  <svg fill="none" viewBox="0 0 18 18">
-    <rect width="16" height="16" x="1" y="1" fill="#4A4F55" rx="8" />
-    <path fill="#B3B7BC" d="M9 12.3a3.3 3.3 0 1 0 0-6.6 3.3 3.3 0 0 0 0 6.6Z" />
-    <rect
-      width="16"
-      height="16"
-      x="1"
-      y="1"
-      stroke="#F8F9F9"
-      strokeWidth="2"
-      rx="8"
-    />
-  </svg>
-);

package/src/components/iconography/avatar/icons/online.tsx

@@ -1,16 +0,0 @@
-import React from 'react';
-
-export const Online = () => (
-  <svg fill="none" viewBox="0 0 18 18">
-    <rect width="16" height="16" x="1" y="1" fill="#3CC260" rx="8" />
-    <rect
-      width="16"
-      height="16"
-      x="1"
-      y="1"
-      stroke="#F8F9F9"
-      strokeWidth="2"
-      rx="8"
-    />
-  </svg>
-);

package/src/components/iconography/avatar/icons/subscribed.tsx

@@ -1,33 +0,0 @@
-import React from 'react';
-
-export const Subscribed = () => (
-  <svg fill="none" viewBox="0 0 20 20">
-    <path
-      fill="#fff"
-      fillRule="evenodd"
-      d="M19.088 9.994a9.088 9.088 0 1 1-18.176 0 9.088 9.088 0 0 1 18.176 0Z"
-      clipRule="evenodd"
-    />
-    <path
-      fill="url(#a)"
-      d="M17.088 9.994a7.088 7.088 0 1 1-14.176 0 7.088 7.088 0 0 1 14.176 0Z"
-    />
-    <path
-      fill="#fff"
-      d="M9.25 5h1.5v.936c.338.048.648.134.927.26.458.202.813.485 1.067.847.255.362.386.781.394 1.258h-1.665a.976.976 0 0 0-.413-.734c-.244-.175-.575-.262-.992-.262-.283 0-.523.039-.718.117a1.01 1.01 0 0 0-.45.316.748.748 0 0 0-.152.461.645.645 0 0 0 .092.375c.07.107.165.2.285.278.12.075.26.141.418.199.157.054.326.101.505.14l.738.172c.359.078.688.183.988.313.299.13.559.29.778.48a2.003 2.003 0 0 1 .698 1.559c-.003.49-.131.914-.385 1.273-.252.357-.615.634-1.091.832-.302.125-.643.21-1.024.255V15h-1.5v-.942a4.002 4.002 0 0 1-.923-.242c-.49-.198-.872-.49-1.148-.879-.273-.39-.416-.873-.429-1.449h1.681c.019.269.098.492.237.672.142.177.33.311.566.402.238.089.507.133.806.133.294 0 .55-.041.767-.125.219-.083.389-.199.509-.347a.79.79 0 0 0 .18-.512c0-.18-.054-.33-.164-.453a1.248 1.248 0 0 0-.473-.313 4.908 4.908 0 0 0-.759-.234l-.894-.219c-.693-.164-1.24-.42-1.641-.77-.402-.348-.601-.818-.598-1.41-.003-.484.13-.907.397-1.269.27-.362.64-.645 1.111-.848.242-.104.5-.181.775-.232V5Z"
-    />
-    <defs>
-      <radialGradient
-        id="a"
-        cx="0"
-        cy="0"
-        r="1"
-        gradientTransform="rotate(-49.924 18.2 -.497) scale(14.7338 19.4196)"
-        gradientUnits="userSpaceOnUse"
-      >
-        <stop stopColor="#09B3A1" />
-        <stop offset="1" stopColor="#3AC15E" />
-      </radialGradient>
-    </defs>
-  </svg>
-);

package/src/components/iconography/avatar/index.ts

@@ -1,2 +0,0 @@
-export { Avatar } from './avatar';
-export type { AvatarGroupProps, AvatarProps } from './avatar';

package/src/components/iconography/icon/icon.tsx

@@ -1,64 +0,0 @@
-'use client';
-
-import React from 'react';
-import styled from 'styled-components';
-import { COLORS, colorReference } from '../../../common';
-
-type NativeProps = Pick<
-  React.HTMLAttributes<SVGElement>,
-  | 'children'
-  | 'className'
-  | 'dangerouslySetInnerHTML'
-  | 'id'
-  | 'onBlur'
-  | 'onBlurCapture'
-  | 'onClick'
-  | 'onChange'
-  | 'onCopy'
-  | 'onCut'
-  | 'onKeyDown'
-  | 'onKeyDownCapture'
-  | 'onKeyUp'
-  | 'onKeyUpCapture'
-  | 'onMouseDown'
-  | 'onMouseDownCapture'
-  | 'onMouseEnter'
-  | 'onMouseLeave'
-  | 'onMouseOut'
-  | 'onMouseOver'
-> & { value?: string };
-
-export interface IconProps extends NativeProps {
-  as?: React.ElementType;
-  color?: (typeof COLORS)[number];
-  size?: 16 | 20 | 24;
-  sx?: string;
-}
-
-export const Icon = ({
-  as,
-  children,
-  color = 'grey-3',
-  size = 16,
-  sx,
-  ...rest
-}: IconProps) => {
-  return (
-    <SVG
-      as={as}
-      width={size}
-      height={size}
-      viewBox="0 0 16 16"
-      fill={colorReference[color]}
-      xmlns="http://www.w3.org/2000/svg"
-      $sx={sx}
-      {...rest}
-    >
-      {children}
-    </SVG>
-  );
-};
-
-const SVG = styled.svg<{ $sx?: string }>`
-  ${({ $sx }) => ($sx ? $sx : '')}
-`;

package/src/components/iconography/icon/index.ts

@@ -1,2 +0,0 @@
-export { Icon } from './icon';
-export type { IconProps } from './icon';

package/src/components/iconography/index.ts

@@ -1,4 +0,0 @@
-export { Avatar } from './avatar';
-export type { AvatarGroupProps, AvatarProps } from './avatar';
-export { Icon } from './icon';
-export type { IconProps } from './icon';

package/src/components/index.ts

@@ -1,9 +0,0 @@
-export * from './actions';
-export * from './atoms';
-export * from './card';
-export * from './editor';
-export * from './feedback';
-export * from './iconography';
-export * from './input';
-export * from './navigation';
-export * from './surfaces';

package/src/components/input/checkbox/checkbox.tsx

@@ -1,60 +0,0 @@
-'use client';
-
-import React from 'react';
-import styled from 'styled-components';
-import { Styles } from '../../../common';
-import { BoxProps } from '../../';
-import { Checkmark } from '../../../icons';
-
-type NativeProps = Pick<
-  React.HTMLAttributes<HTMLDivElement>,
-  | 'onClick'
-  | 'onChange'
-  | 'onMouseDown'
-  | 'onMouseDownCapture'
-  | 'onMouseEnter'
-  | 'onMouseLeave'
-  | 'onMouseOut'
-  | 'onMouseOver'
->;
-
-export interface CheckboxProps extends NativeProps {
-  disabled?: boolean;
-  selected: boolean;
-}
-
-export const Checkbox = ({ disabled, selected, ...rest }: CheckboxProps) => {
-  return (
-    <Box
-      $align="center"
-      $disabled={!!disabled}
-      $display="flex"
-      $justify="center"
-      $selected={selected}
-      {...rest}
-    >
-      {selected && <Checkmark color="white" />}
-    </Box>
-  );
-};
-
-const Box = styled.div<
-  {
-    $disabled: boolean;
-    $selected: boolean;
-  } & BoxProps
->`
-  display: flex;
-  width: 20px;
-  height: 20px;
-  border-radius: 4px;
-  cursor: pointer;
-  box-sizing: border-box;
-
-  ${({ $selected }) =>
-    $selected
-      ? `background-color: var(--color-primary-blue-2);
-    border: 1px solid var(--color-primary-blue-2);`
-      : 'border: 1px solid var(--color-grey-8);'}
-  ${Styles.flex}
-`;

package/src/components/input/checkbox/index.ts

@@ -1,2 +0,0 @@
-export { Checkbox } from './checkbox';
-export type { CheckboxProps } from './checkbox';