@cashub/ui 0.49.0-beta.0 → 0.49.0-beta.2

package/src/badge/__test__/Badge.test.js

@@ -1,32 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import Badge from '../Badge';
-import 'jest-styled-components';
-
-describe('test badge', () => {
-  test('render badge', () => {
-    render(<Badge success>Enable</Badge>);
-
-    expect(screen.getByText('Enable')).toBeInTheDocument();
-    expect(screen.getByText('Enable')).toHaveStyleRule(
-      'color',
-      'var(--color-success)',
-    );
-    expect(screen.getByText('Enable')).toHaveStyleRule(
-      'border-color',
-      'var(--color-success)',
-    );
-  });
-
-  test('render grey badge', () => {
-    render(<Badge grey>Unknown</Badge>);
-
-    expect(screen.getByText('Unknown')).toHaveStyleRule(
-      'color',
-      'var(--color-grey)',
-    );
-    expect(screen.getByText('Unknown')).toHaveStyleRule(
-      'border-color',
-      'var(--color-grey)',
-    );
-  });
-});

package/src/badge/__test__/BadgeDot.test.js

@@ -1,22 +0,0 @@
-import { render } from '@testing-library/react';
-import BadgeDot from '../BadgeDot';
-import 'jest-styled-components';
-
-const status = {
-  0: {
-    title: 'Disable',
-    type: { danger: true },
-  },
-};
-
-describe('test badegDot', () => {
-  test('render badegDot', () => {
-    const { container } = render(<BadgeDot {...status[0].type} />);
-
-    expect(container.firstChild).toBeInTheDocument();
-    expect(container.firstChild).toHaveStyleRule(
-      'background-color',
-      'var(--color-danger)'
-    );
-  });
-});

package/src/badge/__test__/BadgeFill.test.js

@@ -1,41 +0,0 @@
-import { render } from '@testing-library/react';
-import { FaExclamation } from 'react-icons/fa';
-import BadgeFill from '../BadgeFill';
-import 'jest-styled-components';
-
-describe('test BadgeFill', () => {
-  test('render BadgeFill', () => {
-    const { container } = render(
-      <BadgeFill>
-        <FaExclamation />
-      </BadgeFill>
-    );
-
-    expect(container.firstChild).toHaveStyleRule(
-      'background-color',
-      'var(--color-primary)'
-    );
-    expect(container.firstChild).toHaveStyleRule(
-      'color',
-      'var(--font-on-primary)'
-    );
-  });
-
-  test('with parameters', () => {
-    const { container } = render(
-      <BadgeFill large warning>
-        <FaExclamation />
-      </BadgeFill>
-    );
-
-    expect(container.firstChild).toHaveStyleRule('font-size', '2rem');
-    expect(container.firstChild).toHaveStyleRule(
-      'color',
-      'var(--font-on-danger)'
-    );
-    expect(container.firstChild).toHaveStyleRule(
-      'background-color',
-      'var(--color-warning)'
-    );
-  });
-});

package/src/badge/__test__/BadgeWithText.test.js

@@ -1,22 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import { FaQuestion } from 'react-icons/fa';
-import BadgeFill from '../BadgeFill';
-import BadgeWithText from '../BadgeWithText';
-
-describe('test BadgeWithText', () => {
-  test('render BadgeWithText', () => {
-    render(
-      <BadgeWithText>
-        <BadgeFill>
-          <FaQuestion />
-        </BadgeFill>
-        No Setting Data
-      </BadgeWithText>
-    );
-
-    const badgeWithText = screen.getByText('No Setting Data');
-
-    expect(badgeWithText).toBeInTheDocument();
-    expect(badgeWithText.textContent).toBe('No Setting Data');
-  });
-});

package/src/badge/index.js

@@ -1,5 +0,0 @@
-export { default as Badge } from './Badge';
-export { default as BadgeDot } from './BadgeDot';
-export { default as BadgeFill } from './BadgeFill';
-export { default as BadgeFillTriangle } from './BadgeFillTriangle';
-export { default as BadgeWithText } from './BadgeWithText';

package/src/billing/BarChart.js

@@ -1,42 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingBarChart = ({ theme, percentage, success, warning, danger }) => {
-  const styles = {
-    chart: {
-      position: 'relative',
-      width: '100%',
-      height: 16,
-      borderRadius: 16,
-      backgroundColor: theme.bgColor3,
-      marginTop: 8,
-    },
-    bar: {
-      position: 'absolute',
-      width: `${percentage}%`,
-      borderRadius: 16,
-      top: 0,
-      bottom: 0,
-      backgroundColor: theme.colorPrimary,
-    },
-  };
-
-  if (success) {
-    styles.bar.backgroundColor = theme.colorSuccess;
-  }
-
-  if (warning) {
-    styles.bar.backgroundColor = theme.colorWarning;
-  }
-
-  if (danger) {
-    styles.bar.backgroundColor = theme.colorDanger;
-  }
-
-  return (
-    <View style={styles.chart}>
-      <View style={styles.bar} />
-    </View>
-  );
-};
-
-export default BillingBarChart;

package/src/billing/Grid.js

@@ -1,30 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingGrid = ({ children }) => {
-  const styles = {
-    display: 'flex',
-    flexWrap: 'wrap',
-    flexDirection: 'row',
-    margin: '0 -8',
-  };
-
-  return <View style={styles}>{children}</View>;
-};
-
-const BillingColumn = ({ children, flex }) => {
-  const styles = {
-    padding: '0 8',
-    width: '50%',
-  };
-
-  if (flex) {
-    styles.display = 'flex';
-    styles.alignContent = 'stretch';
-    styles.alignItems = 'stretch';
-    styles.flexDirection = 'column';
-  }
-
-  return <View style={styles}>{children}</View>;
-};
-
-export { BillingGrid, BillingColumn };

package/src/billing/Header2.js

@@ -1,15 +0,0 @@
-import { Text } from '@react-pdf/renderer';
-
-const BillingHeader2 = ({ children }) => {
-  const styles = {
-    fontSize: 20,
-    wordBreak: 'break-word',
-    textAlign: 'center',
-    margin: 0,
-    marginBottom: 12,
-  };
-
-  return <Text style={styles}>{children}</Text>;
-};
-
-export default BillingHeader2;

package/src/billing/Header3.js

@@ -1,32 +0,0 @@
-import { Text } from '@react-pdf/renderer';
-
-const BillingHeader3 = ({
-  children,
-  fontWeightNormal,
-  noMarginBottom,
-  paddingBottom,
-}) => {
-  const styles = {
-    fontSize: 14,
-    lineHeight: 1.25,
-    wordBreak: 'break-word',
-    fontWeight: 'bold',
-    marginBottom: 8,
-  };
-
-  if (fontWeightNormal) {
-    styles.fontWeight = 'normal';
-  }
-
-  if (noMarginBottom) {
-    styles.marginBottom = 0;
-  }
-
-  if (paddingBottom) {
-    styles.paddingBottom = 8;
-  }
-
-  return <Text style={styles}>{children}</Text>;
-};
-
-export default BillingHeader3;

package/src/billing/Paragraph.js

@@ -1,27 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingParagraph = ({
-  children,
-  marginRight,
-  justifyContentBetween,
-}) => {
-  const styles = {
-    margin: 0,
-    display: 'flex',
-    flexDirection: 'row',
-    wordBreak: 'break-word',
-    overflowWrap: 'break-word',
-  };
-
-  if (marginRight) {
-    styles.marginRight = 16;
-  }
-
-  if (justifyContentBetween) {
-    styles.justifyContent = 'space-between';
-  }
-
-  return <View style={styles}>{children}</View>;
-};
-
-export default BillingParagraph;

package/src/billing/ParagraphGroup.js

@@ -1,12 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingParagraphGroup = ({ children }) => {
-  const styles = {
-    display: 'flex',
-    flexDirection: 'row',
-  };
-
-  return <View style={styles}>{children}</View>;
-};
-
-export default BillingParagraphGroup;

package/src/billing/ParagraphText.js

@@ -1,16 +0,0 @@
-import { Text } from '@react-pdf/renderer';
-
-const BillingParagraphText = ({ children, fontWeightBold }) => {
-  const styles = {
-    fontSize: 12,
-    lineHeight: 1.5,
-  };
-
-  if (fontWeightBold) {
-    styles.fontWeight = 'bold';
-  }
-
-  return <Text style={styles}>{children}</Text>;
-};
-
-export default BillingParagraphText;

package/src/billing/Section.js

@@ -1,48 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingSection = ({
-  children,
-  theme,
-  backgroundReverse,
-  noPadding,
-  noMarginBottom,
-  paddingS,
-  marginBottomS,
-  flexGrow,
-}) => {
-  const styles = {
-    backgroundColor: theme.bgColor1,
-    borderRadius: 16,
-    color: theme.fontOnBg,
-    padding: 12,
-    marginBottom: 16,
-  };
-
-  if (backgroundReverse) {
-    styles.backgroundColor = theme.bgColor2;
-  }
-
-  if (noPadding) {
-    styles.padding = 0;
-  }
-
-  if (noMarginBottom) {
-    styles.marginBottom = 0;
-  }
-
-  if (paddingS) {
-    styles.padding = 8;
-  }
-
-  if (marginBottomS) {
-    styles.marginBottom = 12;
-  }
-
-  if (flexGrow) {
-    styles.flexGrow = 1;
-  }
-
-  return <View style={styles}>{children}</View>;
-};
-
-export default BillingSection;

package/src/billing/SectionBody.js

@@ -1,7 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingSectionBody = ({ children }) => {
-  return <View>{children}</View>;
-};
-
-export default BillingSectionBody;

package/src/billing/SectionHeader.js

@@ -1,16 +0,0 @@
-import { View } from '@react-pdf/renderer';
-
-const BillingSectionHeader = ({ children, inline }) => {
-  const styles = {};
-
-  if (inline) {
-    styles.display = 'flex';
-    styles.justifyContent = 'space-between';
-    styles.flexDirection = 'row';
-    styles.alignItems = 'center';
-  }
-
-  return <View style={styles}>{children}</View>;
-};
-
-export default BillingSectionHeader;

package/src/billing/__stories__/BarChart.stories.js_bak

@@ -1,46 +0,0 @@
-import { useContext } from 'react';
-import { Document, Page, PDFViewer, StyleSheet } from '@react-pdf/renderer';
-import { ThemeContext } from 'styled-components';
-import BillingBarChart from '../BarChart';
-
-export default {
-  title: 'billing/BillingBarChart',
-  component: BillingBarChart,
-  argTypes: {
-    theme: { description: 'Provide theme styles for components to use' },
-    percentage: {
-      description: 'Affects the width of the bar, the maximum value is 100',
-    },
-    success: { description: 'Affects the backgroundColor of the bar' },
-    warning: { description: 'Affects the backgroundColor of the bar' },
-    danger: { description: 'Affects the backgroundColor of the bar' },
-  },
-};
-
-export const Default = (args) => {
-  const theme = useContext(ThemeContext);
-
-  const styles = StyleSheet.create({
-    page: {
-      backgroundColor: theme.bgColor2,
-      padding: 8,
-    },
-  });
-
-  return (
-    <PDFViewer showToolbar={false}>
-      <Document>
-        <Page size='A4' style={styles.page}>
-          <BillingBarChart {...args} theme={theme} marginTop />
-        </Page>
-      </Document>
-    </PDFViewer>
-  );
-};
-
-Default.args = {
-  success: true,
-  warning: false,
-  danger: false,
-  percentage: 100,
-};

package/src/billing/__stories__/Grid.stories.js_bak

@@ -1,57 +0,0 @@
-import {
-  PDFViewer,
-  Document,
-  Page,
-  StyleSheet,
-  Text,
-  Font,
-} from '@react-pdf/renderer';
-import { useContext } from 'react';
-import { ThemeContext } from 'styled-components';
-import { BillingGrid, BillingColumn } from '../Grid';
-import NanumGothicBold from '../../assets/font/nanumGothic/NanumGothic-Bold.ttf';
-import NanumGothicExtraBold from '../../assets/font/nanumGothic/NanumGothic-ExtraBold.ttf';
-import NanumGothicRegular from '../../assets/font/nanumGothic/NanumGothic-Regular.ttf';
-
-export default {
-  title: 'billing/BillingGrid',
-  component: BillingGrid,
-  subComponent: BillingColumn,
-  argTypes: {
-    children: { description: 'A BillingColumn component must be passed in.' },
-  },
-};
-
-export const Default = (args) => {
-  const theme = useContext(ThemeContext);
-  Font.register({
-    family: 'Nanum Gothic',
-    fonts: [
-      { src: NanumGothicBold },
-      { src: NanumGothicExtraBold },
-      { src: NanumGothicRegular },
-    ],
-  });
-
-  const styles = StyleSheet.create({
-    page: {
-      fontFamily: 'Nanum Gothic',
-      color: '#ffffff',
-      backgroundColor: theme.bgColor2,
-      padding: 8,
-    },
-  });
-  return (
-    <PDFViewer style={{ width: '100%' }}>
-      <Document>
-        <Page size='A4' style={styles.page}>
-          <BillingGrid {...args}>
-            <BillingColumn>
-              <Text>children content</Text>
-            </BillingColumn>
-          </BillingGrid>
-        </Page>
-      </Document>
-    </PDFViewer>
-  );
-};

package/src/billing/__stories__/Header2.stories.js_bak

@@ -1,62 +0,0 @@
-import {
-  Document,
-  Page,
-  PDFViewer,
-  StyleSheet,
-  View,
-  Font,
-} from "@react-pdf/renderer";
-import BillingHeader2 from "../Header2";
-import { useContext } from "react";
-import { ThemeContext } from "styled-components";
-import NanumGothicBold from "../../assets/font/nanumGothic/NanumGothic-Bold.ttf";
-import NanumGothicExtraBold from "../../assets/font/nanumGothic/NanumGothic-ExtraBold.ttf";
-import NanumGothicRegular from "../../assets/font/nanumGothic/NanumGothic-Regular.ttf";
-
-export default {
-  title: "billing/header2",
-  component: BillingHeader2,
-  argTypes: {
-    children: {
-      description:
-        "For displaying text. Supports nesting of other Text or Link components to create inline styling.",
-    },
-  },
-};
-
-export const Default = (args) => {
-  const theme = useContext(ThemeContext);
-  Font.register({
-    family: "Nanum Gothic",
-    fonts: [
-      { src: NanumGothicBold },
-      { src: NanumGothicExtraBold },
-      { src: NanumGothicRegular },
-    ],
-  });
-
-  const styles = StyleSheet.create({
-    page: {
-      fontFamily: "Nanum Gothic",
-      color: "#ffffff",
-      backgroundColor: theme.bgColor2,
-      padding: 8,
-    },
-  });
-
-  return (
-    <PDFViewer style={{ width: "100%" }}>
-      <Document>
-        <Page size="A4" style={styles.page}>
-          <View>
-            <BillingHeader2 {...args}></BillingHeader2>
-          </View>
-        </Page>
-      </Document>
-    </PDFViewer>
-  );
-};
-
-Default.args = {
-  children: "BillingHeader2 content",
-};

package/src/billing/__stories__/Header3.stories.js_bak

@@ -1,69 +0,0 @@
-import {
-  Document,
-  Page,
-  PDFViewer,
-  StyleSheet,
-  View,
-  Font,
-} from "@react-pdf/renderer";
-import BillingHeader3 from "../Header3";
-import { useContext } from "react";
-import { ThemeContext } from "styled-components";
-import NanumGothicBold from "../../assets/font/nanumGothic/NanumGothic-Bold.ttf";
-import NanumGothicExtraBold from "../../assets/font/nanumGothic/NanumGothic-ExtraBold.ttf";
-import NanumGothicRegular from "../../assets/font/nanumGothic/NanumGothic-Regular.ttf";
-export default {
-  title: "billing/header3",
-  component: BillingHeader3,
-  argTypes: {
-    children: {
-      description:
-        "For displaying text. Supports nesting of other Text or Link components to create inline styling.",
-    },
-    fontWeightNormal: { description: "Style variant" },
-    noMarginBottom: { description: "Style variant" },
-    paddingBottom: { description: "Style variant" },
-  },
-};
-
-export const Default = (args) => {
-  const theme = useContext(ThemeContext);
-  Font.register({
-    family: "Nanum Gothic",
-    fonts: [
-      { src: NanumGothicBold },
-      { src: NanumGothicExtraBold },
-      { src: NanumGothicRegular },
-    ],
-  });
-  const styles = StyleSheet.create({
-    page: {
-      fontFamily: "Nanum Gothic",
-      color: "#ffffff",
-      backgroundColor: theme.bgColor2,
-      padding: 8,
-    },
-    view: {
-      border: "1px solid #ffffff",
-    },
-  });
-
-  return (
-    <PDFViewer style={{ width: "100%" }}>
-      <Document>
-        <Page size="A4" style={styles.page}>
-          <View style={styles.view}>
-            <BillingHeader3 {...args}></BillingHeader3>
-          </View>
-        </Page>
-      </Document>
-    </PDFViewer>
-  );
-};
-
-Default.args = {
-  children: "BillingHeader3 content",
-  fontWeightNormal: false,
-  noMarginBottom: false,
-  paddingBottom: false,
-};