@dotss/tictoccroc 0.0.0 → 0.0.2

package/dist/teacher/profile/components/ActivityGallery/ActivityGallery.mjs

@@ -0,0 +1,101 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { Children as c, isValidElement as C, cloneElement as S } from "react";
+import { Flexbox as r, Typography as I, Button as j, Icon as w } from "@dotss/ui";
+import A from "../../../../shared/components/Masonry/Masonry.mjs";
+import "../../../../shared/components/Masonry/MasonryBlock/MasonryBlock.mjs";
+import B from "./ActivityGalleryItem/ActivityGalleryItem.mjs";
+function F({
+  children: s,
+  onClickViewAll: a,
+  action: o,
+  hideHeader: n = !1,
+  masonryProps: {
+    columnCount: y = 2,
+    rowCount: f = 2,
+    spacing: h = 2,
+    edgeSpacing: g = 0,
+    direction: d = "horizontal",
+    defaultContainerWidth: p = 0,
+    defaultContainerHeight: u = 0,
+    ...v
+  } = {},
+  ...i
+}) {
+  const l = c.toArray(s).filter(C).filter((t) => t.type === B), b = l.length > 0;
+  return /* @__PURE__ */ m(
+    r,
+    {
+      tag: "section",
+      flexDirection: "column",
+      "aria-labelledby": n ? void 0 : "activity-gallery-title",
+      "aria-label": n ? "선생님 활동 갤러리" : void 0,
+      gap: 4,
+      ...i,
+      inlineCSS: {
+        width: "100%",
+        ...i == null ? void 0 : i.inlineCSS
+      },
+      children: [
+        !n && /* @__PURE__ */ m(r, { alignItems: "center", justifyContent: "space-between", gap: 2, children: [
+          /* @__PURE__ */ e(
+            I,
+            {
+              id: "activity-gallery-title",
+              tag: "h2",
+              variant: "h2B",
+              "aria-label": "선생님 활동 갤러리",
+              children: "활동 갤러리"
+            }
+          ),
+          typeof a == "function" && /* @__PURE__ */ e(
+            j,
+            {
+              variant: "text",
+              size: "small",
+              color: "secondary",
+              endAdornment: /* @__PURE__ */ e(w, { name: "ChevronRightLine" }),
+              onClick: a,
+              children: "전체보기"
+            }
+          )
+        ] }),
+        b && /* @__PURE__ */ e(
+          A,
+          {
+            rowCount: f,
+            columnCount: y,
+            spacing: h,
+            edgeSpacing: g,
+            direction: d,
+            defaultContainerWidth: p,
+            defaultContainerHeight: u,
+            role: "group",
+            "aria-label": "콘텐츠 목록",
+            ...v,
+            children: c.map(
+              l,
+              (t, x) => S(t, {
+                "aria-label": `${t.props.showPlayButton ? "동영상" : "사진"} (${l.length}개 중 ${x + 1}번째)`,
+                ...t.props
+              })
+            )
+          }
+        ),
+        o && /* @__PURE__ */ e(
+          r,
+          {
+            mt: 2,
+            flexGrow: 1,
+            alignItems: "center",
+            justifyContent: "center",
+            inlineCSS: { width: "inherit" },
+            children: o
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  F as default
+};

package/dist/teacher/profile/components/ActivityGallery/ActivityGalleryItem/ActivityGalleryItem.d.ts

@@ -0,0 +1,8 @@
+import { MasonryBlockProps } from '../../../../../shared/components/Masonry/MasonryBlock';
+export interface ActivityGalleryItemProps extends MasonryBlockProps {
+    primary: boolean;
+    status: 'VERIFIED' | 'PENDING' | 'REJECTED' | 'DELETED';
+    showPlayButton?: boolean;
+}
+declare function ActivityGalleryItem({ children, primary, status, showPlayButton, ...props }: ActivityGalleryItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export default ActivityGalleryItem;

package/dist/teacher/profile/components/ActivityGallery/ActivityGalleryItem/ActivityGalleryItem.mjs

@@ -0,0 +1,124 @@
+import { jsxs as r, jsx as e, Fragment as m } from "react/jsx-runtime";
+import { useId as b } from "react";
+import { Label as u, Flexbox as o, IconButton as p, Icon as S, Typography as f } from "@dotss/ui";
+import g from "@dotss/ui/core/useTheme";
+import h from "../../../../../shared/components/Masonry/MasonryBlock/MasonryBlock.mjs";
+function z({
+  children: s,
+  primary: d = !1,
+  status: l,
+  showPlayButton: t = !1,
+  ...i
+}) {
+  const n = b(), {
+    palette: { background: c, grey: a }
+  } = g();
+  return /* @__PURE__ */ r(
+    h,
+    {
+      role: "button",
+      "aria-describedby": `activity-gallery-item-status-desc-${n}`,
+      borderRadius: 12,
+      ...i,
+      inlineCSS: { position: "relative", ...i.inlineCSS },
+      children: [
+        s,
+        d && /* @__PURE__ */ e(
+          u,
+          {
+            size: "xSmall",
+            color: "orange",
+            "aria-label": t ? "대표 동영상" : "대표 사진",
+            inlineCSS: { position: "absolute", top: 8, left: 8 },
+            children: "대표"
+          }
+        ),
+        l !== "REJECTED" && t && /* @__PURE__ */ e(
+          o,
+          {
+            inlineCSS: {
+              position: "absolute",
+              top: "50%",
+              left: "50%",
+              transform: "translate(-50%, -50%)",
+              cursor: "pointer"
+            },
+            children: /* @__PURE__ */ e(
+              p,
+              {
+                tabIndex: i.tabIndex,
+                name: "ArrowRightFill",
+                color: "secondary",
+                size: "large",
+                "aria-label": "동영상 재생하기",
+                inlineCSS: {
+                  backgroundColor: a[90],
+                  "&  svg": {
+                    color: a.white
+                  }
+                }
+              }
+            )
+          }
+        ),
+        l === "REJECTED" && /* @__PURE__ */ r(m, { children: [
+          /* @__PURE__ */ e(
+            o,
+            {
+              alignItems: "center",
+              justifyContent: "center",
+              inlineCSS: {
+                position: "absolute",
+                top: 0,
+                left: 0,
+                width: "100%",
+                height: "100%",
+                opacity: 0.8,
+                backgroundColor: c.primary,
+                zIndex: 1
+              }
+            }
+          ),
+          /* @__PURE__ */ e(
+            S,
+            {
+              name: "AlertFill",
+              size: "xSmall",
+              color: "etc.red",
+              inlineCSS: {
+                position: "absolute",
+                top: "50%",
+                left: "50%",
+                transform: "translate(-50%, -50%)",
+                zIndex: 1
+              }
+            }
+          ),
+          /* @__PURE__ */ r(f, { id: `activity-gallery-item-status-desc-${n}`, visuallyHidden: !0, children: [
+            t ? "동영상" : "사진",
+            "이 반려되었어요. 다시 등록해주세요."
+          ] })
+        ] }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            "aria-hidden": !0,
+            inlineCSS: {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: "100%",
+              height: "100%",
+              border: "1px solid rgba(0, 0, 0, 0.05)",
+              zIndex: 1,
+              borderRadius: i.borderRadius
+            }
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  z as default
+};

package/dist/teacher/profile/components/ActivityGallery/ActivityGalleryItem/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ActivityGalleryItem, ActivityGalleryItemProps } from './ActivityGalleryItem';
+export type { ActivityGalleryItemProps };
+export default ActivityGalleryItem;

package/dist/teacher/profile/components/ActivityGallery/ActivityGalleryItem/index.mjs

@@ -0,0 +1,4 @@
+import e from "./ActivityGalleryItem.mjs";
+export {
+  e as default
+};

package/dist/teacher/profile/components/ActivityGallery/index.d.ts

@@ -0,0 +1,4 @@
+import { default as ActivityGallery, ActivityGalleryProps } from './ActivityGallery';
+export type { ActivityGalleryProps };
+export { default as ActivityGalleryItem, type ActivityGalleryItemProps } from './ActivityGalleryItem';
+export default ActivityGallery;

package/dist/teacher/profile/components/ActivityGallery/index.mjs

@@ -0,0 +1,6 @@
+import e from "./ActivityGallery.mjs";
+import { default as l } from "./ActivityGalleryItem/ActivityGalleryItem.mjs";
+export {
+  l as ActivityGalleryItem,
+  e as default
+};

package/dist/teacher/profile/components/AvailableScheduleSection/AvailableScheduleSection.d.ts

@@ -0,0 +1,22 @@
+import { ChangeEventHandler, ReactNode } from 'react';
+import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
+import { SchedulerProps } from '../../../../shared/components/Scheduler';
+export interface AvailableScheduleSectionProps extends FlexboxProps {
+    title?: string;
+    action?: ReactNode;
+    footer?: ReactNode;
+    schedulerProps?: SchedulerProps;
+    enableToggle?: boolean;
+    flat?: boolean;
+    teacherStatus: {
+        onChange?: ChangeEventHandler<HTMLInputElement>;
+        active?: boolean;
+        fallback: {
+            iconBasePath: string;
+            title?: string;
+            description?: string;
+        };
+    };
+}
+declare const AvailableScheduleSection: import('react').ForwardRefExoticComponent<Omit<AvailableScheduleSectionProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export default AvailableScheduleSection;

package/dist/teacher/profile/components/AvailableScheduleSection/AvailableScheduleSection.mjs

@@ -0,0 +1,179 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { forwardRef as w, useState as S } from "react";
+import { Flexbox as n, Typography as a, Button as k, Icon as I } from "@dotss/ui";
+import R from "@dotss/ui/core/useTheme";
+import D from "@dotss/ui/Switch";
+import j from "../../../../shared/components/Image/Image.mjs";
+import A from "../../../../shared/components/Scheduler/Scheduler.mjs";
+import "dayjs";
+import "../../../../shared/utils/getDateRange/getDateRange.mjs";
+const U = w(
+  function({
+    children: b,
+    title: p = "수업 가능 일정",
+    action: c,
+    footer: r,
+    flat: s = !1,
+    schedulerProps: f,
+    enableToggle: h = !0,
+    teacherStatus: i,
+    ...o
+  }, u) {
+    const {
+      palette: { grey: g, background: v }
+    } = R(), [t, C] = S(!1), x = () => C((d) => !d), y = (d) => {
+      var m;
+      return (m = i.onChange) == null ? void 0 : m.call(i, d);
+    };
+    return /* @__PURE__ */ l(
+      n,
+      {
+        ref: u,
+        tag: "section",
+        flexDirection: "column",
+        gap: 4,
+        "aria-labelledby": "available-schedule-section-title",
+        "aria-describedby": r ? "available-schedule-section-footer" : void 0,
+        ...o,
+        inlineCSS: {
+          width: "100%",
+          ...o == null ? void 0 : o.inlineCSS
+        },
+        children: [
+          /* @__PURE__ */ e(a, { id: "available-schedule-section-title", tag: "h2", variant: "h2B", children: p }),
+          i.active && /* @__PURE__ */ l(n, { flexDirection: "column", gap: 2, children: [
+            /* @__PURE__ */ l(
+              n,
+              {
+                flexDirection: "column",
+                inlineCSS: {
+                  ...s ? void 0 : {
+                    border: `1px solid ${g[20]}`,
+                    borderRadius: 12
+                  },
+                  maxHeight: t ? void 0 : h ? 384 : void 0,
+                  overflow: "hidden"
+                },
+                children: [
+                  !s && /* @__PURE__ */ e(n, { pt: 4 }),
+                  /* @__PURE__ */ e(
+                    A,
+                    {
+                      id: "available-schedule-section-scheduler",
+                      "aria-labelledby": "available-schedule-section-title",
+                      ...f,
+                      children: b
+                    }
+                  ),
+                  h && /* @__PURE__ */ e(
+                    k,
+                    {
+                      variant: "text",
+                      color: "secondary",
+                      endAdornment: /* @__PURE__ */ e(I, { name: t ? "ChevronUpLine" : "ChevronDownLine" }),
+                      onClick: x,
+                      "aria-expanded": t,
+                      "aria-controls": "available-schedule-section-scheduler",
+                      inlineCSS: {
+                        position: "sticky",
+                        bottom: 0,
+                        borderTopRightRadius: 0,
+                        borderTopLeftRadius: 0,
+                        backgroundColor: g.white,
+                        zIndex: 1
+                      },
+                      children: t ? "접기" : "펼쳐보기"
+                    }
+                  )
+                ]
+              }
+            ),
+            r && /* @__PURE__ */ e(n, { id: "available-schedule-section-footer", tag: "footer", pl: 12, pr: 2, children: r })
+          ] }),
+          typeof i.onChange == "function" && /* @__PURE__ */ l(
+            n,
+            {
+              alignItems: "center",
+              justifyContent: "space-between",
+              gap: 2,
+              inlineCSS: {
+                width: "inherit"
+              },
+              children: [
+                /* @__PURE__ */ e(a, { tag: "label", variant: "h4M", htmlFor: "available-schedule-section-switch", children: "활동 여부" }),
+                /* @__PURE__ */ e(
+                  D,
+                  {
+                    id: "available-schedule-section-switch",
+                    selected: !!i.active,
+                    onChange: y
+                  }
+                )
+              ]
+            }
+          ),
+          typeof i.onChange == "function" && !i.active && /* @__PURE__ */ l(
+            n,
+            {
+              role: "status",
+              pt: 5,
+              pb: 5,
+              pl: 4,
+              pr: 4,
+              flexDirection: "column",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: 2,
+              inlineCSS: {
+                borderRadius: 8,
+                backgroundColor: v.primary
+              },
+              children: [
+                /* @__PURE__ */ e(
+                  j,
+                  {
+                    width: 48,
+                    height: 48,
+                    src: `${i.fallback.iconBasePath}/images/design-system/graphic/illustration3D/island.png`,
+                    alt: "쉬는 중",
+                    "aria-hidden": !0
+                  }
+                ),
+                /* @__PURE__ */ e(a, { tag: "h3", variant: "h4B", textAlign: "center", children: i.fallback.title || "쉬는 중일 때는 수업 요청이 오지 않아요!" }),
+                /* @__PURE__ */ e(
+                  a,
+                  {
+                    tag: "p",
+                    variant: "b4R",
+                    color: "grey.70",
+                    textAlign: "center",
+                    inlineCSS: {
+                      whiteSpace: "pre-line"
+                    },
+                    children: i.fallback.description || `이미 매칭된 수업은 그대로 유지되니
+변경이 필요한 경우 부모님과 소통해 주세요.`
+                  }
+                )
+              ]
+            }
+          ),
+          c && /* @__PURE__ */ e(
+            n,
+            {
+              mt: 2,
+              alignItems: "center",
+              justifyContent: "center",
+              inlineCSS: {
+                width: "inherit"
+              },
+              children: c
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+export {
+  U as default
+};

package/dist/teacher/profile/components/AvailableScheduleSection/index.d.ts

@@ -0,0 +1,3 @@
+import { default as AvailableScheduleSection, AvailableScheduleSectionProps } from './AvailableScheduleSection';
+export type { AvailableScheduleSectionProps };
+export default AvailableScheduleSection;

package/dist/teacher/profile/components/AvailableScheduleSection/index.mjs

@@ -0,0 +1,4 @@
+import a from "./AvailableScheduleSection.mjs";
+export {
+  a as default
+};

package/dist/teacher/profile/components/CareerSection/CareerItem/CareerItem.d.ts

@@ -0,0 +1,10 @@
+import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
+export interface CareerItemProps extends FlexboxProps {
+    title: string;
+    status: 'VERIFIED' | 'PENDING' | 'REJECTED' | 'DELETED';
+    startDate: string;
+    endDate: string | null;
+    primary: boolean;
+}
+declare function CareerItem({ title, status, startDate, endDate, primary, ...props }: CareerItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export default CareerItem;

package/dist/teacher/profile/components/CareerSection/CareerItem/CareerItem.mjs

@@ -0,0 +1,136 @@
+import { jsx as i, jsxs as e, Fragment as d } from "react/jsx-runtime";
+import { useId as D } from "react";
+import { Flexbox as t, Label as j, Typography as g, Icon as h } from "@dotss/ui";
+import p from "@dotss/ui/core/useTheme";
+import { useCheckHoverPossible as E } from "@dotss/ui/hooks";
+import s from "dayjs";
+function A({
+  title: v,
+  status: f,
+  startDate: y,
+  endDate: o,
+  primary: x = !1,
+  ...n
+}) {
+  const b = D(), { isHoverPossible: I } = E(), {
+    palette: { grey: a },
+    spacing: c
+  } = p(), l = typeof n.onClick == "function", k = s(y), u = (o ? s(o) : s()).diff(k, "month"), m = Math.floor(u / 12), C = u % 12;
+  return /* @__PURE__ */ i("li", { children: /* @__PURE__ */ e(
+    t,
+    {
+      role: "button",
+      tabIndex: l ? 0 : -1,
+      alignItems: "center",
+      gap: 4,
+      pt: 2,
+      pb: 2,
+      pl: 4,
+      pr: 4,
+      ml: -4,
+      mr: -4,
+      onKeyDown: (r) => {
+        var S;
+        (r.key === "Enter" || r.key === " ") && (r.preventDefault(), r.currentTarget.click()), (S = n.onKeyDown) == null || S.call(n, r);
+      },
+      "aria-labelledby": `career-item-title-${b}`,
+      ...n,
+      inlineCSS: {
+        cursor: l ? "pointer" : "default",
+        ...l && {
+          "&:active": {
+            backgroundColor: a[10]
+          }
+        },
+        ...l && I ? {
+          "&:hover": {
+            backgroundColor: a[10]
+          }
+        } : {},
+        ...n == null ? void 0 : n.inlineCSS
+      },
+      children: [
+        /* @__PURE__ */ e(t, { flexDirection: "column", gap: 1, flexGrow: 1, children: [
+          /* @__PURE__ */ e(t, { alignItems: "center", gap: 1, children: [
+            x && /* @__PURE__ */ i(
+              j,
+              {
+                variant: "outlined",
+                size: "small",
+                color: "orange",
+                inlineCSS: {
+                  marginRight: c.content(1)
+                },
+                children: "대표"
+              }
+            ),
+            /* @__PURE__ */ e(g, { id: `career-item-title-${b}`, tag: "p", variant: "b2M", children: [
+              v,
+              f === "VERIFIED" && // TODO 아이콘 교체 필요
+              /* @__PURE__ */ i(
+                h,
+                {
+                  name: "InfoFill",
+                  size: "small",
+                  color: "tictoccroc-teacher.brand.green",
+                  "aria-label": "인증됨",
+                  inlineCSS: {
+                    minWidth: 20,
+                    verticalAlign: "-5px",
+                    marginLeft: c.content(1)
+                  }
+                }
+              ),
+              f === "REJECTED" && /* @__PURE__ */ i(
+                h,
+                {
+                  name: "AlertFill",
+                  size: "small",
+                  color: "etc.red",
+                  "aria-label": "인증 안됨",
+                  inlineCSS: {
+                    minWidth: 20,
+                    verticalAlign: "-5px",
+                    marginLeft: c.content(1)
+                  }
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e(g, { tag: "p", variant: "b5R", color: "grey.50", children: [
+            y,
+            " ~ ",
+            o ?? "현재"
+          ] })
+        ] }),
+        /* @__PURE__ */ e(t, { alignItems: "center", gap: 2, children: [
+          /* @__PURE__ */ e(
+            g,
+            {
+              tag: "p",
+              variant: "h5R",
+              color: "grey.70",
+              noWrap: !0,
+              inlineCSS: { "& strong": { color: a[100], fontWeight: 700 } },
+              children: [
+                m > 0 && /* @__PURE__ */ e(d, { children: [
+                  /* @__PURE__ */ i("strong", { children: m }),
+                  "년"
+                ] }),
+                C > 0 && /* @__PURE__ */ e(d, { children: [
+                  m > 0 && /* @__PURE__ */ i(d, { children: " " }),
+                  /* @__PURE__ */ i("strong", { children: C }),
+                  "개월"
+                ] })
+              ]
+            }
+          ),
+          /* @__PURE__ */ i(h, { name: "ChevronRightLine", size: "xSmall", color: "grey.50" })
+        ] })
+      ]
+    }
+  ) });
+}
+export {
+  A as default
+};

package/dist/teacher/profile/components/CareerSection/CareerItem/index.d.ts

@@ -0,0 +1,3 @@
+import { default as CareerItem, CareerItemProps } from './CareerItem';
+export type { CareerItemProps };
+export default CareerItem;

package/dist/teacher/profile/components/CareerSection/CareerItem/index.mjs

@@ -0,0 +1,4 @@
+import r from "./CareerItem.mjs";
+export {
+  r as default
+};

package/dist/teacher/profile/components/CareerSection/CareerSection.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { FlexboxProps } from 'node_modules/@dotss/ui/Flexbox/Flexbox';
+export interface CareerSectionProps extends FlexboxProps {
+    hideTooltip?: boolean;
+    action?: ReactNode;
+    enableToggle?: boolean;
+}
+declare function CareerSection({ children, hideTooltip, action, enableToggle, ...props }: CareerSectionProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export default CareerSection;