@teach-in/react 0.1.0 → 0.2.0

package/dist/{chunk-HH7MLUOF.mjs → chunk-25XG46X6.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   Spinner
-} from "./chunk-LR4R7GFR.mjs";
+} from "./chunk-ZXCQ73RT.mjs";
 
 // src/ui/layout/page/section-loading.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/chunk-2OPPNAW2.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/blue.ts
+var blue = {
+  50: "#f5f7fd",
+  100: "#dfe8fb",
+  200: "#b5c8f6",
+  300: "#80a2f1",
+  400: "#2e66e8",
+  500: "#2552ba",
+  600: "#1c3d8c",
+  700: "#173274",
+  800: "#0d1f45",
+  900: "#070f22"
+};
+
+export {
+  blue
+};

package/dist/chunk-3LOCA2SP.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/zinc.ts
+var zinc = {
+  "50": "#fafafa",
+  "100": "#f4f4f5",
+  "200": "#e4e4e7",
+  "300": "#d4d4d8",
+  "400": "#a1a1aa",
+  "500": "#71717a",
+  "600": "#52525b",
+  "700": "#3f3f46",
+  "800": "#27272a",
+  "900": "#18181b"
+};
+
+export {
+  zinc
+};

package/dist/chunk-545OBZ4O.mjs

@@ -0,0 +1,47 @@
+"use client";
+import {
+  semanticColors
+} from "./chunk-X7ER4IDJ.mjs";
+
+// src/ui/theme/theme.ts
+import { heroui } from "@heroui/theme";
+var theme = heroui({
+  layout: {
+    dividerWeight: "0.0625rem",
+    disabledOpacity: ".5",
+    fontSize: {
+      tiny: "0.75rem",
+      small: "0.875rem",
+      medium: "1rem",
+      large: "1.125rem"
+    },
+    lineHeight: {
+      tiny: "1rem",
+      small: "1.25rem",
+      medium: "1.5rem",
+      large: "1.75rem"
+    },
+    radius: {
+      small: "0.5rem",
+      medium: "0.75rem",
+      large: "1rem"
+    },
+    borderWidth: {
+      small: "0.0625rem",
+      medium: "0.125rem",
+      large: "0.1875rem"
+    }
+  },
+  themes: {
+    light: {
+      colors: semanticColors.light
+    },
+    dark: {
+      colors: semanticColors.dark
+    }
+  }
+});
+
+export {
+  theme
+};

package/dist/{chunk-2W4N27WQ.mjs → chunk-6NZ4IHNU.mjs}

@@ -3,11 +3,12 @@
 // src/ui/format/datetime.tsx
 import { Fragment, jsx } from "react/jsx-runtime";
 var defaultFormat = {
-  day: "2-digit",
-  month: "2-digit",
+  day: "numeric",
+  month: "long",
   year: "numeric",
   hour: "2-digit",
-  minute: "2-digit"
+  minute: "2-digit",
+  second: "2-digit"
 };
 function Datetime({
   value,

package/dist/{chunk-CLDAITOP.mjs → chunk-BUVPBB4J.mjs}

@@ -3,8 +3,8 @@
 // src/ui/format/date.tsx
 import { Fragment, jsx } from "react/jsx-runtime";
 var defaultFormat = {
-  day: "2-digit",
-  month: "2-digit",
+  day: "numeric",
+  month: "long",
   year: "numeric"
 };
 function DateFormat({

package/dist/chunk-CAJWTQDB.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/chunk-EJQH6CYW.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/chunk-HOVAPYGJ.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/yellow.ts
+var yellow = {
+  50: "#fffcec",
+  100: "#fff2ab",
+  200: "#ffe66e",
+  300: "#ffd739",
+  400: "#f5c20f",
+  500: "#daa800",
+  600: "#b38700",
+  700: "#836100",
+  800: "#4c3800",
+  900: "#171200"
+};
+
+export {
+  yellow
+};

package/dist/{chunk-S2TB4GD2.mjs → chunk-IZ5KKF6P.mjs}

@@ -3,7 +3,7 @@ import {
   cn
 } from "./chunk-LOMRTWX5.mjs";
 
-// src/ui/layout/container.tsx
+// src/ui/layout/container/container.tsx
 import { Slot } from "@radix-ui/react-slot";
 import { tv } from "tailwind-variants";
 import { jsx } from "react/jsx-runtime";
@@ -11,7 +11,7 @@ var variants = tv({
   base: "w-full mx-auto px-6",
   variants: {
     size: {
-      xs: "max-w-screen-xs",
+      xs: "max-w-xs",
       sm: "max-w-screen-sm",
       md: "max-w-screen-md",
       lg: "max-w-screen-lg",

package/dist/chunk-J3OZNLTZ.mjs

@@ -0,0 +1,50 @@
+"use client";
+
+// src/ui/surface/bento/bento.tsx
+import { tv } from "tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+var bento = tv({
+  base: "rounded-xl p-6 transition-colors",
+  variants: {
+    color: {
+      default: "bg-default-50 text-default-700",
+      primary: "bg-primary-50 text-primary-700",
+      secondary: "bg-secondary-50 text-secondary-700",
+      success: "bg-success-50 text-success-700",
+      warning: "bg-warning-50 text-warning-700",
+      danger: "bg-danger-50 text-danger-700"
+    },
+    radius: {
+      none: "rounded-none",
+      sm: "rounded-md",
+      md: "rounded-lg",
+      lg: "rounded-xl",
+      full: "rounded-full"
+    },
+    shadow: {
+      none: "",
+      sm: "shadow-small",
+      md: "shadow-medium",
+      lg: "shadow-large"
+    },
+    bordered: {
+      false: "",
+      true: "border border-default-200"
+    }
+  },
+  defaultVariants: {
+    color: "default",
+    radius: "lg",
+    shadow: "none",
+    bordered: false
+  }
+});
+var Bento = ({ className, ...props }) => {
+  return /* @__PURE__ */ jsx("div", { className: bento({ ...props, className }), ...props });
+};
+Bento.displayName = "TeachInUI.Bento";
+
+export {
+  bento,
+  Bento
+};

package/dist/chunk-JUIVZCH7.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/chunk-JWMPI5AZ.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/chunk-LUERGYYZ.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/green.ts
+var green = {
+  50: "#f2fbf6",
+  100: "#d9f2e3",
+  200: "#a3e0bb",
+  300: "#66cb8e",
+  400: "#00a843",
+  500: "#008636",
+  600: "#006528",
+  700: "#005421",
+  800: "#002f13",
+  900: "#00190a"
+};
+
+export {
+  green
+};

package/dist/{chunk-CUVF3U67.mjs → chunk-M5F723W7.mjs}

@@ -1,6 +1,6 @@
 "use client";
 
-// src/ui/layout/flex.tsx
+// src/ui/layout/flex/flex.tsx
 import { tv } from "tailwind-variants";
 import { jsx } from "react/jsx-runtime";
 var variants = tv({

package/dist/chunk-NCM6KIQH.mjs

@@ -0,0 +1,47 @@
+"use client";
+import {
+  red
+} from "./chunk-SLB2JE3N.mjs";
+import {
+  shipgray
+} from "./chunk-XYQVL4EX.mjs";
+import {
+  yellow
+} from "./chunk-HOVAPYGJ.mjs";
+import {
+  zinc
+} from "./chunk-3LOCA2SP.mjs";
+import {
+  blue
+} from "./chunk-2OPPNAW2.mjs";
+import {
+  cyan
+} from "./chunk-OW6U64MG.mjs";
+import {
+  green
+} from "./chunk-LUERGYYZ.mjs";
+import {
+  pink
+} from "./chunk-YBQFG6QJ.mjs";
+import {
+  purple
+} from "./chunk-XKX5LFH7.mjs";
+
+// src/ui/theme/colors/common.ts
+var commonColors = {
+  white: "#ffffff",
+  black: "#111016",
+  blue,
+  green,
+  pink,
+  purple,
+  red,
+  shipgray,
+  yellow,
+  cyan,
+  zinc
+};
+
+export {
+  commonColors
+};

package/dist/chunk-NDQAHQFL.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/{chunk-AS4T5M6E.mjs → chunk-O5T4GUJH.mjs}

@@ -3,12 +3,15 @@
 // src/ui/data/pagination/pagination.tsx
 import React from "react";
 import { Pagination as HeroUIPagination } from "@heroui/pagination";
+import { PaginationItemType as HeroUIPaginationItemType } from "@heroui/pagination";
 import { jsx } from "react/jsx-runtime";
+var PaginationItemType = HeroUIPaginationItemType;
 var Pagination = React.forwardRef(({ pages, ...props }, ref) => {
   return /* @__PURE__ */ jsx(HeroUIPagination, { ref, isCompact: true, showControls: true, showShadow: true, total: pages, ...props });
 });
 Pagination.displayName = "TeachInUI.Pagination";
 
 export {
+  PaginationItemType,
   Pagination
 };

package/dist/chunk-OW6U64MG.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/cyan.ts
+var cyan = {
+  50: "#f4fdfe",
+  100: "#ddf9fd",
+  200: "#a9effb",
+  300: "#69e3f8",
+  400: "#1cd5f4",
+  500: "#18b3cd",
+  600: "#12889c",
+  700: "#0f6f7f",
+  800: "#084049",
+  900: "#05262c"
+};
+
+export {
+  cyan
+};

package/dist/chunk-PFLROV3C.mjs

@@ -0,0 +1,17 @@
+"use client";
+import {
+  semanticColors
+} from "./chunk-X7ER4IDJ.mjs";
+import {
+  commonColors
+} from "./chunk-NCM6KIQH.mjs";
+
+// src/ui/theme/colors/index.ts
+var colors = {
+  ...commonColors,
+  ...semanticColors
+};
+
+export {
+  colors
+};

package/dist/chunk-PON4ZQKG.mjs

@@ -0,0 +1 @@
+"use client";

package/dist/chunk-SLB2JE3N.mjs

@@ -0,0 +1,19 @@
+"use client";
+
+// src/ui/theme/colors/red.ts
+var red = {
+  50: "#fdf4f3",
+  100: "#f8dfdb",
+  200: "#eeb2a9",
+  300: "#e37f70",
+  400: "#d02a11",
+  500: "#a6220e",
+  600: "#7d190a",
+  700: "#681509",
+  800: "#3a0c05",
+  900: "#1f0603"
+};
+
+export {
+  red
+};

package/dist/{chunk-PEB5ZH76.mjs → chunk-SPED4RBS.mjs}

@@ -1,7 +1,7 @@
 "use client";
 import {
   Spinner
-} from "./chunk-LR4R7GFR.mjs";
+} from "./chunk-ZXCQ73RT.mjs";
 
 // src/ui/layout/page/page-loading.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/{chunk-GRWFJ4FP.mjs → chunk-TJBXXTYS.mjs}

@@ -6,7 +6,7 @@ import { Tooltip as HeroUITooltip } from "@heroui/tooltip";
 import { jsx } from "react/jsx-runtime";
 var Tooltip = React.forwardRef(
   ({ placement = "bottom", ...props }, ref) => {
-    return /* @__PURE__ */ jsx(HeroUITooltip, { ref, palacement: placement, ...props });
+    return /* @__PURE__ */ jsx(HeroUITooltip, { ref, placement, ...props });
   }
 );
 Tooltip.displayName = "TeachInUI.Tooltip";

package/dist/{chunk-QU35SWES.mjs → chunk-TYMUQULA.mjs}

@@ -7,11 +7,8 @@ import { extendVariants } from "@heroui/system";
 import { jsx } from "react/jsx-runtime";
 var BaseButton = extendVariants(HeroUIButton, {
   variants: {
-    color: {
-      primary: "bg-primary-400"
-    },
     size: {
-      lg: "min-w-20 h-14 text-base gap-2 px-6"
+      lg: "px-6 min-w-20 h-14 text-base gap-2 rounded-large"
     }
   },
   defaultVariants: {
@@ -19,7 +16,14 @@ var BaseButton = extendVariants(HeroUIButton, {
   }
 });
 var Button = React.forwardRef((props, ref) => {
-  return /* @__PURE__ */ jsx(BaseButton, { ref, ...props });
+  return /* @__PURE__ */ jsx(
+    BaseButton,
+    {
+      ref,
+      className: props.variant === "flat" && props.color === "default" ? "bg-default-flat/25 !text-default-800" : props.className,
+      ...props
+    }
+  );
 });
 Button.displayName = "TeachInUI.Button";
 

package/dist/chunk-VIPLRFPR.mjs

@@ -0,0 +1,23 @@
+"use client";
+
+// src/ui/theme/swap-color-values.ts
+function swapColorValues(colors) {
+  const swappedColors = {};
+  const keys = Object.keys(colors);
+  const length = keys.length;
+  for (let i = 0; i < length / 2; i++) {
+    const key1 = keys[i];
+    const key2 = keys[length - 1 - i];
+    swappedColors[key1] = colors[key2];
+    swappedColors[key2] = colors[key1];
+  }
+  if (length % 2 !== 0) {
+    const middleKey = keys[Math.floor(length / 2)];
+    swappedColors[middleKey] = colors[middleKey];
+  }
+  return swappedColors;
+}
+
+export {
+  swapColorValues
+};

package/dist/chunk-W6NKLZ73.mjs

@@ -0,0 +1,61 @@
+"use client";
+
+// src/ui/layout/grid/grid.tsx
+import { tv } from "tailwind-variants";
+import { jsx } from "react/jsx-runtime";
+var variants = tv({
+  base: "grid",
+  variants: {
+    columns: {
+      1: "grid-cols-1",
+      2: "grid-cols-2",
+      3: "grid-cols-3",
+      4: "grid-cols-4",
+      6: "grid-cols-6",
+      12: "grid-cols-12"
+    },
+    gap: {
+      0: "gap-0",
+      1: "gap-1",
+      2: "gap-2",
+      4: "gap-4",
+      6: "gap-6",
+      8: "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    flow: {
+      row: "grid-flow-row",
+      col: "grid-flow-col",
+      "row-dense": "grid-flow-row-dense",
+      "col-dense": "grid-flow-col-dense"
+    }
+  },
+  defaultVariants: {
+    columns: 3,
+    gap: 4,
+    align: "stretch",
+    justify: "start",
+    flow: "row"
+  }
+});
+var Grid = ({ className, ...props }) => {
+  return /* @__PURE__ */ jsx("div", { className: variants({ ...props, className }), ...props });
+};
+Grid.displayName = "TeachInUI.Grid";
+
+export {
+  Grid
+};

package/dist/chunk-X7ER4IDJ.mjs

@@ -0,0 +1,167 @@
+"use client";
+import {
+  commonColors
+} from "./chunk-NCM6KIQH.mjs";
+import {
+  swapColorValues
+} from "./chunk-VIPLRFPR.mjs";
+
+// src/ui/theme/colors/semantic.ts
+var base = {
+  light: {
+    background: {
+      DEFAULT: commonColors.white
+    },
+    foreground: {
+      ...commonColors.shipgray,
+      DEFAULT: commonColors.shipgray[800]
+    },
+    divider: {
+      DEFAULT: "rgba(17, 17, 6, 0.15)"
+    },
+    focus: {
+      DEFAULT: commonColors.blue[400]
+    },
+    overlay: {
+      DEFAULT: "#1110164c"
+    },
+    content1: {
+      DEFAULT: commonColors.shipgray[50],
+      foreground: commonColors.shipgray[900]
+    },
+    content2: {
+      DEFAULT: commonColors.shipgray[100],
+      foreground: commonColors.shipgray[800]
+    },
+    content3: {
+      DEFAULT: commonColors.shipgray[200],
+      foreground: commonColors.shipgray[700]
+    },
+    content4: {
+      DEFAULT: commonColors.shipgray[300],
+      foreground: commonColors.shipgray[600]
+    }
+  },
+  dark: {
+    background: {
+      DEFAULT: commonColors.black
+    },
+    foreground: {
+      ...swapColorValues(commonColors.shipgray),
+      DEFAULT: commonColors.shipgray[50]
+    },
+    focus: {
+      DEFAULT: commonColors.blue[500]
+    },
+    overlay: {
+      DEFAULT: "#1110164C"
+    },
+    divider: {
+      DEFAULT: "rgba(255, 255, 255, 0.15)"
+    },
+    content1: {
+      DEFAULT: commonColors.shipgray[800],
+      foreground: commonColors.shipgray[50]
+    },
+    content2: {
+      DEFAULT: commonColors.shipgray[700],
+      foreground: commonColors.shipgray[100]
+    },
+    content3: {
+      DEFAULT: commonColors.shipgray[600],
+      foreground: commonColors.shipgray[200]
+    },
+    content4: {
+      DEFAULT: commonColors.shipgray[500],
+      foreground: commonColors.shipgray[300]
+    }
+  }
+};
+var themeColorsLight = {
+  ...base.light,
+  default: {
+    ...commonColors.shipgray,
+    foreground: commonColors.black,
+    flat: commonColors.shipgray[300],
+    DEFAULT: commonColors.shipgray[100]
+  },
+  primary: {
+    ...commonColors.blue,
+    foreground: commonColors.white,
+    flat: commonColors.blue[500],
+    DEFAULT: commonColors.blue[400]
+  },
+  secondary: {
+    ...commonColors.purple,
+    foreground: commonColors.white,
+    flat: commonColors.purple[500],
+    DEFAULT: commonColors.purple[400]
+  },
+  success: {
+    ...commonColors.green,
+    foreground: commonColors.black,
+    flat: commonColors.green[500],
+    DEFAULT: commonColors.green[400]
+  },
+  warning: {
+    ...commonColors.yellow,
+    foreground: commonColors.black,
+    flat: commonColors.yellow[500],
+    DEFAULT: commonColors.yellow[500]
+  },
+  danger: {
+    ...commonColors.red,
+    foreground: commonColors.white,
+    flat: commonColors.red[500],
+    DEFAULT: commonColors.red[400]
+  }
+};
+var themeColorsDark = {
+  ...base.dark,
+  default: {
+    ...swapColorValues(commonColors.shipgray),
+    foreground: commonColors.white,
+    flat: commonColors.shipgray[600],
+    DEFAULT: commonColors.shipgray[700]
+  },
+  primary: {
+    ...swapColorValues(commonColors.blue),
+    foreground: commonColors.blue[500],
+    flat: commonColors.blue[500],
+    DEFAULT: commonColors.blue[500]
+  },
+  secondary: {
+    ...swapColorValues(commonColors.purple),
+    foreground: commonColors.white,
+    flat: commonColors.purple[400],
+    DEFAULT: commonColors.purple[400]
+  },
+  success: {
+    ...swapColorValues(commonColors.green),
+    foreground: commonColors.black,
+    flat: commonColors.green[500],
+    DEFAULT: commonColors.green[500]
+  },
+  warning: {
+    ...swapColorValues(commonColors.yellow),
+    foreground: commonColors.black,
+    flat: commonColors.yellow[500],
+    DEFAULT: commonColors.yellow[500]
+  },
+  danger: {
+    ...swapColorValues(commonColors.red),
+    foreground: commonColors.white,
+    flat: commonColors.red[500],
+    DEFAULT: commonColors.red[500]
+  }
+};
+var semanticColors = {
+  light: themeColorsLight,
+  dark: themeColorsDark
+};
+
+export {
+  themeColorsLight,
+  themeColorsDark,
+  semanticColors
+};