@uni-design-system/uni-react 0.0.19 → 1.0.0

package/src/stories/header.css

@@ -0,0 +1,32 @@
+.storybook-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  padding: 15px 20px;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+.storybook-header svg {
+  display: inline-block;
+  vertical-align: top;
+}
+
+.storybook-header h1 {
+  display: inline-block;
+  vertical-align: top;
+  margin: 6px 0 6px 10px;
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1;
+}
+
+.storybook-header button + button {
+  margin-left: 10px;
+}
+
+.storybook-header .welcome {
+  margin-right: 10px;
+  color: #333;
+  font-size: 14px;
+}

package/src/stories/page.css

@@ -0,0 +1,68 @@
+.storybook-page {
+  margin: 0 auto;
+  padding: 48px 20px;
+  max-width: 600px;
+  color: #333;
+  font-size: 14px;
+  line-height: 24px;
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+}
+
+.storybook-page h2 {
+  display: inline-block;
+  vertical-align: top;
+  margin: 0 0 4px;
+  font-weight: 700;
+  font-size: 32px;
+  line-height: 1;
+}
+
+.storybook-page p {
+  margin: 1em 0;
+}
+
+.storybook-page a {
+  color: inherit;
+}
+
+.storybook-page ul {
+  margin: 1em 0;
+  padding-left: 30px;
+}
+
+.storybook-page li {
+  margin-bottom: 8px;
+}
+
+.storybook-page .tip {
+  display: inline-block;
+  vertical-align: top;
+  margin-right: 10px;
+  border-radius: 1em;
+  background: #e7fdd8;
+  padding: 4px 12px;
+  color: #357a14;
+  font-weight: 700;
+  font-size: 11px;
+  line-height: 12px;
+}
+
+.storybook-page .tip-wrapper {
+  margin-top: 40px;
+  margin-bottom: 40px;
+  font-size: 13px;
+  line-height: 20px;
+}
+
+.storybook-page .tip-wrapper svg {
+  display: inline-block;
+  vertical-align: top;
+  margin-top: 3px;
+  margin-right: 4px;
+  width: 12px;
+  height: 12px;
+}
+
+.storybook-page .tip-wrapper svg path {
+  fill: #1ea7fd;
+}

package/src/tools/color-picker/color-picker.component.tsx

@@ -0,0 +1,146 @@
+import React, { useEffect, useRef, useState } from 'react';
+import { ColorSwatch } from '../color-swatch/color-swatch.component';
+import { RGBA } from '@uni-design-system/uni-core';
+
+export interface ColorPickerProps {
+  imageUrl: string;
+  imageWidth: number;
+  imageHeight: number;
+  sampleSize: number;
+}
+
+export const ColorPicker = ({ imageUrl, imageWidth, imageHeight, sampleSize = 41 }: ColorPickerProps): JSX.Element => {
+  const canvasRef = useRef<HTMLCanvasElement>(null);
+
+  const [pixelColor, setPixelColor] = useState<RGBA>({ red: 0, green: 0, blue: 0, alpha: 1 });
+  const [averageColor, setAverageColor] = useState<RGBA>({ red: 0, green: 0, blue: 0, alpha: 1 });
+
+  let canvas: HTMLCanvasElement | null;
+  let ctx: CanvasRenderingContext2D | null;
+
+  let img: HTMLImageElement;
+
+  useEffect(() => {
+    canvas = canvasRef.current;
+
+    if (canvas) {
+      ctx = canvas.getContext('2d');
+      canvas.width = imageWidth;
+      canvas.style.width = `${imageWidth}px`;
+      canvas.height = imageHeight;
+      canvas.style.height = `${imageHeight}px`;
+    }
+
+    img = document.createElement('img');
+    img.crossOrigin = 'Anonymous';
+    img.src = imageUrl;
+
+    //once the image is loaded, add it to the canvas
+    img.onload = (ev) => {
+      ctx?.drawImage(img, 0, 0);
+      //call the context.getImageData method to get the array of [r,g,b,a] values
+
+      let imgDataObj = ctx?.getImageData(0, 0, canvas?.width || 0, canvas?.height || 0);
+
+      const data = imgDataObj?.data; //data prop is an array
+
+      if (!!data && !!canvas) {
+        canvas?.addEventListener('mousemove', (ev: MouseEvent) => {
+          getPixel(data, ev);
+        });
+      }
+
+      // canvas?.addEventListener('click', addBox);
+    };
+  }, []);
+
+  const getPixel = (data: Uint8ClampedArray, ev: MouseEvent) => {
+    if (!canvas) return;
+    //as the mouse moves around the image
+    // let canvas = ev.target;
+    let cols = canvas.width;
+
+    // let rows = canvas.height;
+    let { offsetX, offsetY } = ev;
+
+    //call the method to get the r,g,b,a values for current pixel
+    let c = getPixelColor(data, cols, offsetY, offsetX);
+
+    //save the string to use elsewhere
+    // pixel = clr;
+    setPixelColor(c);
+
+    //now get the average of the surrounding pixel colours
+    setAverageColor(getAverage(data, ev));
+  };
+
+  const getAverage = (data: Uint8ClampedArray, ev: { offsetX: any; offsetY: any }): RGBA => {
+    if (!ctx) return { red: 0, green: 0, blue: 0, alpha: 1 };
+    //create a 41px by 41px average colour square
+    //replace everything in the canvas with the original image
+    // let canvas = ev.target;
+    let cols = canvas?.width || 0;
+    let rows = canvas?.height || 0;
+
+    //remove the current contents of the canvas to draw the image and box again
+    ctx.clearRect(0, 0, cols, rows);
+
+    //add the image from memory
+    ctx.drawImage(img, 0, 0);
+    let { offsetX, offsetY } = ev;
+    const inset = Math.round(sampleSize / 2);
+    //inset by 20px as our workable range
+    offsetX = Math.min(offsetX, cols - inset);
+    offsetX = Math.max(inset, offsetX);
+    offsetY = Math.min(offsetY, rows - inset);
+    offsetY = Math.max(offsetY, inset);
+    //create a 41 x 41 pixel square for the average
+    let reds = 0; //total for all the red values in the 41x41 square
+    let greens = 0;
+    let blues = 0;
+    //for anything in the range (x-20, y-20) to (x+20, y+20)
+    for (let x = -1 * inset; x <= inset; x++) {
+      for (let y = -1 * inset; y <= inset; y++) {
+        let c = getPixelColor(data, cols, offsetY + y, offsetX + x);
+        reds += c.red;
+        greens += c.green;
+        blues += c.blue;
+      }
+    }
+    let nums = inset * inset * 4; //total number of pixels in the box
+    let red = Math.round(reds / nums);
+    let green = Math.round(greens / nums);
+    let blue = Math.round(blues / nums);
+
+    //now draw an overlaying square of that colour
+    //make the square twice as big as the sample area
+    ctx.fillStyle = `rgb(${red}, ${green}, ${blue})`;
+    ctx.strokeStyle = 'solid 2px #FFFFFF';
+    ctx.strokeRect(offsetX - inset, offsetY - inset, inset * 2, inset * 2);
+    ctx.fillRect(offsetX - inset, offsetY - inset, inset * 2, inset * 2);
+
+    return { red, green, blue, alpha: 1 };
+  };
+
+  const getPixelColor = (data: Uint8ClampedArray, cols: number, x: number, y: number): RGBA => {
+    let pixel = cols * x + y;
+    let arrayPos = pixel * 4;
+
+    return {
+      red: data[arrayPos],
+      green: data[arrayPos + 1],
+      blue: data[arrayPos + 2],
+      alpha: data[arrayPos + 3],
+    };
+  };
+
+  return (
+    <div style={{ padding: 16 }}>
+      <div style={{ marginBottom: 16 }}>
+        <canvas ref={canvasRef} />
+      </div>
+      <ColorSwatch rgba={pixelColor}>Pixel Color</ColorSwatch>
+      <ColorSwatch rgba={averageColor}>Average Color</ColorSwatch>
+    </div>
+  );
+};

package/src/tools/color-picker/color-picker.stories.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ColorPicker, ColorPickerProps } from './color-picker.component';
+
+export default {
+  title: 'Tools/Color Picker',
+  component: ColorPicker,
+  parameters: {
+    layout: 'fullscreen',
+  },
+};
+
+export const ColorPickerPlayground = (args: ColorPickerProps) => <ColorPicker {...args} />;
+
+const ColorPickerPlaygroundProps: Partial<ColorPickerProps> = {
+  imageUrl: 'promenade.webp',
+  imageHeight: 683,
+  imageWidth: 1024,
+  sampleSize: 40,
+};
+
+ColorPickerPlayground.args = ColorPickerPlaygroundProps;

package/src/tools/color-swatch/color-swatch.component.tsx

@@ -0,0 +1,61 @@
+import React, { CSSProperties, ReactNode } from 'react';
+import { HSLAToString, RGB, RGBToHSL, ShadowElevation } from '@uni-design-system/uni-core';
+import { BoxShadow, Padding, Text, useTheme } from '../../core';
+
+export type CardType = 'elevated' | 'filled' | 'outlined';
+
+export interface ColorSwatchProps {
+  rgba: RGB;
+  children?: ReactNode;
+  cardType?: CardType;
+  elevation?: ShadowElevation;
+  width?: string | number;
+  height?: string | number;
+}
+
+export function ColorSwatch({ rgba, children, cardType = 'elevated', elevation, width, height }: ColorSwatchProps) {
+  const theme = useTheme();
+
+  const { borderRadii } = theme.containers.card;
+
+  const cardStyle: CSSProperties = {
+    height,
+    width,
+    display: 'inline-block',
+    backgroundColor: theme.colors['background'],
+    color: theme.colors['on-background'],
+    borderRadius: borderRadii?.sm,
+    ...Padding('xs', 'all'),
+    margin: 8,
+  };
+
+  if (cardType === 'elevated') {
+    cardStyle.boxShadow = BoxShadow(elevation || 'pressed');
+  }
+
+  const hsla = RGBToHSL(rgba);
+
+  const HSLColor = HSLAToString({
+    hue: Math.round(hsla.hue || 0),
+    saturation: Math.round(hsla.hue || 0),
+    lightness: Math.round(hsla.lightness || 0),
+  });
+  const swatchColor = `rgb(${rgba.red}, ${rgba.green}, ${rgba.blue})`;
+
+  const swatchStyle: CSSProperties = {
+    backgroundColor: swatchColor,
+    height: 200,
+    width: 200,
+    display: 'inline-block',
+    borderRadius: borderRadii?.xs,
+  };
+
+  return (
+    <div style={cardStyle}>
+      <div style={swatchStyle} />
+      <Text role="headline-medium">{children}</Text>
+      <Text role="title-small">{swatchColor}</Text>
+      <Text role="title-small">{HSLColor}</Text>
+    </div>
+  );
+}

package/src/utils/storage-manager.ts

@@ -0,0 +1,48 @@
+export interface StorageManager<T> {
+  type: 'cookie' | 'localStorage';
+  get(init?: T): T | undefined;
+  set(value: T): void;
+}
+
+// Usage
+// export const localStorageManager = createLocalStorageManager(STORAGE_KEY);
+export const createLocalStorageManager = <T>(key: string): StorageManager<T> => ({
+  type: 'localStorage',
+  get(init?) {
+    if (!globalThis?.document) return init;
+    let value: any;
+    try {
+      value = localStorage.getItem(key) || init;
+    } catch (e) {
+      // no op
+    }
+
+    return JSON.parse(value) || init;
+  },
+  set(value) {
+    try {
+      localStorage.setItem(key, JSON.stringify(value));
+    } catch (e) {
+      // no op
+    }
+  },
+});
+
+const parseCookie = (cookie: string, key: string): string | undefined => {
+  const match = cookie.match(new RegExp(`(^| )${key}=([^;]+)`));
+  return match?.[2];
+};
+
+// Usage
+// export const cookieStorageManager = createCookieStorageManager(STORAGE_KEY);
+export const createCookieStorageManager = (key: string, cookie?: string): StorageManager<string> => ({
+  type: 'cookie',
+  get(init?): string | undefined {
+    if (cookie) return parseCookie(cookie, key);
+    if (!globalThis?.document) return init;
+    return parseCookie(document.cookie, key) || init;
+  },
+  set(value) {
+    document.cookie = `${key}=${value}; max-age=31536000; path=/`;
+  },
+});

package/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "extends": "@uni-design-system/tsconfig/base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "noEmit": true,           // Ensures 'tsc' only checks types and doesn't write files
+    "outDir": "dist",         // If you DO emit, they go here
+    "rootDir": "src"
+  },
+  "include": ["src"],
+  "exclude": ["dist", "node_modules"]
+}

package/vite.config.ts

@@ -0,0 +1,29 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import dts from 'unplugin-dts/vite'; // Essential for shipping types
+import { resolve } from 'path';
+
+export default defineConfig({
+  plugins: [
+    react(),
+    dts({ insertTypesEntry: true }) // Automatically generates .d.ts files
+  ],
+  build: {
+    lib: {
+      entry: resolve(__dirname, 'src/index.ts'),
+      name: 'UniReact',
+      formats: ['es'], // Modern libraries typically only need ES modules
+      fileName: 'index'
+    },
+    rollupOptions: {
+      // CRITICAL: Do not bundle React or Core into your library
+      external: ['react', 'react-dom', 'react/jsx-runtime', '@repo/core'],
+      output: {
+        globals: {
+          react: 'React',
+          'react-dom': 'ReactDOM'
+        }
+      }
+    }
+  }
+});

package/vitest.config.ts

@@ -0,0 +1,36 @@
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { defineConfig } from 'vitest/config';
+
+import { storybookTest } from '@storybook/addon-vitest/vitest-plugin';
+
+import { playwright } from '@vitest/browser-playwright';
+
+const dirname =
+  typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url));
+
+// More info at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon
+export default defineConfig({
+  test: {
+    projects: [
+      {
+        extends: true,
+        plugins: [
+          // The plugin will run tests for the stories defined in your Storybook config
+          // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest
+          storybookTest({ configDir: path.join(dirname, '.storybook') }),
+        ],
+        test: {
+          name: 'storybook',
+          browser: {
+            enabled: true,
+            headless: true,
+            provider: playwright({}),
+            instances: [{ browser: 'chromium' }],
+          },
+        },
+      },
+    ],
+  },
+});

package/vitest.shims.d.ts

@@ -0,0 +1 @@
+/// <reference types="@vitest/browser-playwright" />

package/README.md

@@ -1,22 +0,0 @@
-<p align="center">
-  <a href="https://uni-design-system.github.io/uni-react/" target="_blank">
-    <img src="https://github.com/uni-design-system/uni-react/raw/v0.0.17/.github/uni-logo.png" alt="UNI Design System">
-  </a>
-</p>
-
-<p align="center">
-  UNI React is a themed based component library built atop of UNI Design System Core Concepts.
-<p>
-
-<p align="center">
-  <a href="https://uni-design-system.github.io/uni-react/"><strong>Browse the component library &rarr;</strong></a>
-</p>
-
-
-
-
-## Local Development
-If you would like to run the UNI React component library on your local machine, 
-```
-yarn && yarn storybook
-```

package/dist/cjs/components/button/button.component.js

@@ -1,98 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-const react_1 = __importStar(require("react"));
-const core_1 = require("../../core");
-const icon_text_row_1 = require("../icon-text-row");
-const use_ripple_hook_1 = __importDefault(require("use-ripple-hook"));
-const Button = (_a) => {
-    var { text, children, buttonType = 'filled', disabled = false, iconName, contentColor: overrideContentColor, onClick, disableRipple = false, style: userStyle } = _a, rest = __rest(_a, ["text", "children", "buttonType", "disabled", "iconName", "contentColor", "onClick", "disableRipple", "style"]);
-    const { deviceSize } = (0, core_1.useLayout)();
-    const theme = (0, core_1.useTheme)();
-    const [ref, createRipple] = (0, use_ripple_hook_1.default)({ disabled: disableRipple || buttonType === 'elevated' });
-    const buttonProps = theme.buttons[buttonType];
-    const getOnColorToken = (color) => `on-${color}`;
-    const contentColor = overrideContentColor || getOnColorToken(buttonProps.color);
-    const [hover, setHover] = (0, react_1.useState)(false);
-    const [click, setClick] = (0, react_1.useState)(false);
-    const style = Style(theme, buttonType, deviceSize, hover, disabled, click);
-    (0, react_1.useEffect)(() => {
-        setTimeout(() => {
-            setClick(false);
-        }, 250);
-    }, [click]);
-    const handleClick = (event) => {
-        setClick(true);
-        onClick && onClick(event);
-    };
-    return (react_1.default.createElement("button", Object.assign({ onMouseDown: createRipple, onMouseEnter: () => setHover(true), onMouseLeave: () => setHover(false), onClick: handleClick, disabled: disabled, style: Object.assign(Object.assign({}, style), userStyle), ref: ref }, rest), iconName ? (react_1.default.createElement(icon_text_row_1.IconTextRow, { iconName: iconName, color: contentColor, textRole: "button" }, text || children)) : (react_1.default.createElement(core_1.Text, { align: "center", role: "button", colorToken: contentColor }, text || children))));
-};
-exports.Button = Button;
-function Style(theme, buttonType, size = 'md', hover, disabled, click) {
-    const { color, horizontalPadding, verticalPadding, borderColor, borderWidth, borderRadius, contentColor } = theme.buttons[buttonType];
-    const styles = {
-        overflow: 'hidden',
-        transition: 'all 0.3s cubic-bezier(.25,.8,.25,1)',
-        cursor: 'pointer',
-        paddingTop: verticalPadding[size] + 'px',
-        paddingBottom: verticalPadding[size] + 'px',
-        paddingLeft: horizontalPadding[size] + 'px',
-        paddingRight: horizontalPadding[size] + 'px',
-        borderRadius: borderRadius + 'px',
-        backgroundColor: theme.colors[color],
-        borderColor: theme.colors[borderColor],
-        borderWidth: borderWidth + 'px',
-        borderStyle: buttonType === 'outlined' ? 'solid' : 'none',
-    };
-    if (buttonType === 'elevated' && !disabled) {
-        styles.boxShadow = (0, core_1.BoxShadow)(hover ? 'focussed' : 'raised');
-    }
-    if (disabled && buttonType === 'elevated') {
-        styles.boxShadow = (0, core_1.BoxShadow)('pressed');
-        styles.color = theme.colors[contentColor];
-    }
-    if (disabled) {
-        styles.cursor = 'not-allowed';
-    }
-    if (click && buttonType === 'elevated' && !disabled) {
-        styles.boxShadow = (0, core_1.BoxShadow)('pressed');
-    }
-    return styles;
-}

package/dist/cjs/components/button/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./button.component"), exports);

package/dist/cjs/components/card/card.component.js

@@ -1,35 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
-const react_1 = __importDefault(require("react"));
-const core_1 = require("../../core");
-const container_component_1 = __importDefault(require("../../core/container/container.component"));
-function Card(_a) {
-    var { children, cardType, elevation, colorToken = 'surface', width, height, borderRadius, style } = _a, rest = __rest(_a, ["children", "cardType", "elevation", "colorToken", "width", "height", "borderRadius", "style"]);
-    const { colors, containers } = (0, core_1.useTheme)();
-    const { borderRadii } = containers.card;
-    const styles = Object.assign(Object.assign({ height,
-        width, backgroundColor: colors[colorToken || 'surface'], color: colors[`on-${colorToken}` || 'on-surface'] }, (0, core_1.Padding)('md', 'all')), style);
-    if (cardType === 'elevated') {
-        styles.boxShadow = (0, core_1.BoxShadow)(elevation || 'raised');
-    }
-    if (borderRadii && borderRadius !== 'none') {
-        styles.borderRadius = borderRadii[borderRadius || 'md'];
-    }
-    return (react_1.default.createElement(container_component_1.default, Object.assign({ colorToken: colorToken, style: styles }, rest), children));
-}
-exports.Card = Card;

package/dist/cjs/components/card/index.js

@@ -1,17 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./card.component"), exports);