yootd 0.0.8 → 0.0.9

package/dist/video-player/index.scss

@@ -0,0 +1,309 @@
+.yot-video-player {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  &-container {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    overflow: hidden;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-shrink: 0;
+
+    &:hover & {
+      &__progress {
+        visibility: visible;
+      }
+
+      &__controls-bottom-progress__bar {
+        visibility: hidden;
+      }
+    }
+
+    &__video {
+      width: 100%;
+      height: 100%;
+      object-fit: fill;
+    }
+
+    &__controls {
+      position: absolute;
+      left: 0;
+      bottom: 0;
+      width: 100%;
+      height: 55px;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-end;
+      z-index: 10;
+    }
+
+    &__mask {
+      width: 100%;
+      height: 100px;
+      background-repeat: repeat-x;
+      background-position: bottom;
+      position: absolute;
+      left: 0;
+      bottom: 0;
+    }
+
+    &__progress {
+      height: 16px;
+      padding: 6px 0px;
+      margin: 0px 6px;
+      overflow: hidden;
+      position: relative;
+      box-sizing: border-box;
+      cursor: pointer;
+      visibility: hidden;
+    }
+
+    &__progress-bar {
+      width: 100%;
+      height: 3px;
+      background-color: #e1e1e133;
+      position: absolute;
+    }
+
+    &__controls-content {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      padding: 0px 6px;
+      user-select: none;
+      position: relative;
+      z-index: 10;
+    }
+
+    &__controls-icon {
+      width: 16px;
+      height: 16px;
+      cursor: pointer;
+      margin-right: 20px;
+    }
+
+    &__controls-text {
+      margin-right: 20px;
+      font-size: 12px;
+      white-space: nowrap;
+    }
+
+    &__controls-speed {
+      margin-left: auto;
+      margin-right: 20px;
+      font-size: 12px;
+      cursor: pointer;
+      white-space: nowrap;
+      position: relative;
+
+      &--disabled {
+        pointer-events: none;
+        color: gray;
+      }
+    }
+
+    &__controls-speed-picker-container {
+      position: absolute;
+      left: 50%;
+      bottom: 24px;
+      width: 70px;
+      margin-left: -35px;
+      border-radius: 4px;
+    }
+
+    &__controls-speeds {
+      height: 36px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      color: white;
+
+      &--selected {
+        color: #00aeec;
+      }
+    }
+
+    &__controls-volume {
+      position: relative;
+      margin-right: 20px;
+      display: flex;
+      align-items: center;
+
+      &__icon {
+        width: 16px;
+        height: 16px;
+        cursor: pointer;
+
+        &--disabled {
+          pointer-events: none;
+        }
+      }
+
+      &__slider {
+        position: absolute;
+        left: 50%;
+        bottom: 24px;
+        width: 30px;
+        height: 100px;
+        margin-left: -15px;
+        padding-bottom: 5px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        overflow: hidden;
+        background-color: rgba(0, 0, 0, 0.8);
+        color: white;
+
+        &__number {
+          height: 48px;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+
+          &__text {
+            font-size: 12px;
+          }
+        }
+
+        &__progress-bar {
+          display: flex;
+          flex: 1;
+          position: relative;
+          flex-direction: column;
+          align-items: center;
+          padding-bottom: 4px;
+
+          &__line {
+            background-color: white;
+            width: 4px;
+            height: 100%;
+            border-radius: 4px;
+            position: relative;
+            overflow: hidden;
+
+            &__button-1 {
+              position: absolute;
+              width: 4px;
+              height: 100%;
+              background-color: #00aeec;
+            }
+          }
+
+          &__button-2 {
+            position: absolute;
+            width: 10px;
+            height: 10px;
+            border-radius: 50%;
+            background-color: #00aeec;
+          }
+        }
+      }
+    }
+
+    &__controls-capture {
+      position: relative;
+      margin-right: 20px;
+      display: flex;
+      align-items: center;
+
+      svg {
+        width: 16px;
+        height: 16px;
+        cursor: pointer;
+      }
+    }
+
+    &__controls-setting {
+      position: relative;
+      margin-right: 20px;
+      display: flex;
+      align-items: center;
+
+      svg {
+        width: 16px;
+        height: 16px;
+        cursor: pointer;
+      }
+
+      &__panel {
+        background-color: rgba(0, 0, 0, 0.8);
+        width: 96px;
+        left: 50%;
+        margin-left: -48px;
+        margin-bottom: 24px;
+        bottom: 0;
+        position: absolute;
+        font-size: 12px;
+        padding: 0 12px;
+        border-radius: 4px;
+
+        &__item {
+          color: white;
+          width: 100%;
+          height: 40px;
+          display: flex;
+          align-items: center;
+
+          &__checkbox {
+            margin-left: 8px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+
+    &__controls-full-screen {
+      width: 16px;
+      height: 16px;
+      cursor: pointer;
+    }
+
+    &__controls-bottom-progress {
+      &__bar {
+        position: relative;
+        left: 0px;
+        bottom: 0px;
+        width: 100%;
+        height: 2px;
+        z-index: 10;
+
+        &__item-1 {
+          width: 100%;
+          height: 100%;
+          background-color: #e1e1e133;
+          position: absolute;
+        }
+
+        &__item-2 {
+          position: absolute;
+          height: 100%;
+          background-color: #e1e1e14d;
+        }
+
+        &__item-3 {
+          height: 100%;
+          background-color: #00aeec;
+          position: absolute;
+        }
+      }
+    }
+
+    &__canvas {
+      position: absolute;
+      transform-origin: center;
+    }
+  }
+
+  &--full-screened {
+    transform: rotate(90deg);
+    transform-origin: center;
+    width: 100vh !important;
+    height: 100vw !important;
+  }
+}

package/dist/year-term/index.scss

@@ -1,21 +1,21 @@
-.yot-YearTerm {
-  border: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border);
-  border-radius: var(--ant-border-radius);
-  &-school-select::after {
-    content: '';
-    position: absolute;
-    right: 0;
-    top: 50%; /* 从中间开始 */
-    width: 1px; /* 边框宽度 */
-    height: 50%; /* 设为盒子高度的百分之五十 */
-    background-color: var(--ant-color-border); /* 边框颜色 */
-    transform: translateY(-50%);
-  }
-  .ant-select.ant-select-outlined.css-var-yootd.ant-select-css-var.ant-select-single.ant-select-allow-clear.ant-select-show-arrow {
-    .ant-select-selector {
-      padding-left: var(--ant-padding);
-      padding-right: var(--ant-padding);
-      border: 0;
-    }
-  }
-}
+.yot-YearTerm {
+  border: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border);
+  border-radius: var(--ant-border-radius);
+  &-school-select::after {
+    content: '';
+    position: absolute;
+    right: 0;
+    top: 50%; /* 从中间开始 */
+    width: 1px; /* 边框宽度 */
+    height: 50%; /* 设为盒子高度的百分之五十 */
+    background-color: var(--ant-color-border); /* 边框颜色 */
+    transform: translateY(-50%);
+  }
+  .ant-select.ant-select-outlined.css-var-yootd.ant-select-css-var.ant-select-single.ant-select-allow-clear.ant-select-show-arrow {
+    .ant-select-selector {
+      padding-left: var(--ant-padding);
+      padding-right: var(--ant-padding);
+      border: 0;
+    }
+  }
+}

package/dist/year-term/types/types.d.ts

@@ -1,28 +1,28 @@
-export interface PageData<T> {
-  content: T[];
-  page: {
-    number: number;
-    size: number;
-    totalElements: number;
-    totalPages: number;
-  };
-}
-// 查询学年返回的数据类型
-export interface IYearItem {
-  id: number; // ID
-  yearName: string; // 学年名称
-}
-// 查询学期返回的数据类型
-export interface ITermItem {
-  termId: number; // ID
-  termName: string; // 学期名称
-}
-type YearTermProps = {
-  type?: 'yearTerm' | 'year' | 'term';
-  style?: React.CSSProperties;
-  showSearch?: boolean;
-  value?: Record<string, number>;
-  onChange?: (record: Record<string, number | undefined>) => void;
-  allowClear?: boolean;
-  placeholder?: string[];
-};
+export interface PageData<T> {
+  content: T[];
+  page: {
+    number: number;
+    size: number;
+    totalElements: number;
+    totalPages: number;
+  };
+}
+// 查询学年返回的数据类型
+export interface IYearItem {
+  id: number; // ID
+  yearName: string; // 学年名称
+}
+// 查询学期返回的数据类型
+export interface ITermItem {
+  termId: number; // ID
+  termName: string; // 学期名称
+}
+type YearTermProps = {
+  type?: 'yearTerm' | 'year' | 'term';
+  style?: React.CSSProperties;
+  showSearch?: boolean;
+  value?: Record<string, number>;
+  onChange?: (record: Record<string, number | undefined>) => void;
+  allowClear?: boolean;
+  placeholder?: string[];
+};

package/dist/zones/index.module.scss

@@ -1,23 +1,23 @@
-.content {
-  border: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border);
-  border-radius: var(--ant-border-radius);
-  :global {
-    .zone-select::after {
-      content: '';
-      position: absolute;
-      right: 0;
-      top: 50%; /* 从中间开始 */
-      width: 1px; /* 边框宽度 */
-      height: 50%; /* 设为盒子高度的百分之五十 */
-      background-color: var(--ant-color-border); /* 边框颜色 */
-      transform: translateY(-50%);
-    }
-    .ant-select.ant-select-outlined.css-var-yootd.ant-select-css-var.ant-select-single.ant-select-show-arrow {
-      .ant-select-selector {
-        padding-left: var(--ant-padding);
-        padding-right: var(--ant-padding);
-        border: 0;
-      }
-    }
-  }
-}
+.content {
+  border: var(--ant-line-width) var(--ant-line-type) var(--ant-color-border);
+  border-radius: var(--ant-border-radius);
+  :global {
+    .zone-select::after {
+      content: '';
+      position: absolute;
+      right: 0;
+      top: 50%; /* 从中间开始 */
+      width: 1px; /* 边框宽度 */
+      height: 50%; /* 设为盒子高度的百分之五十 */
+      background-color: var(--ant-color-border); /* 边框颜色 */
+      transform: translateY(-50%);
+    }
+    .ant-select.ant-select-outlined.css-var-yootd.ant-select-css-var.ant-select-single.ant-select-show-arrow {
+      .ant-select-selector {
+        padding-left: var(--ant-padding);
+        padding-right: var(--ant-padding);
+        border: 0;
+      }
+    }
+  }
+}

package/dist/zones/types/types.d.ts

@@ -1,26 +1,26 @@
-export interface PageData<T> {
-  content: T[];
-  page: {
-    number: number;
-    size: number;
-    totalElements: number;
-    totalPages: number;
-  };
-}
-
-export interface ZoneItem {
-  zoneId: string; // 区域ID
-  zoneName: string; // 区域名称
-  zoneLevel: number; // 区域等级(1全国2省级3市级4区级)
-  zoneLevel1Id: string;
-  zoneLevel2Id: string;
-}
-export interface ZoneProps {
-  zoneLevel?: 'province' | 'city' | 'district';
-  value?: string[];
-  onChange?: (zoneIds: string[]) => void;
-  style?: React.CSSProperties;
-  placeholder?: string[];
-  allowClear?: boolean;
-  showSearch?: boolean;
-}
+export interface PageData<T> {
+  content: T[];
+  page: {
+    number: number;
+    size: number;
+    totalElements: number;
+    totalPages: number;
+  };
+}
+
+export interface ZoneItem {
+  zoneId: string; // 区域ID
+  zoneName: string; // 区域名称
+  zoneLevel: number; // 区域等级(1全国2省级3市级4区级)
+  zoneLevel1Id: string;
+  zoneLevel2Id: string;
+}
+export interface ZoneProps {
+  zoneLevel?: 'province' | 'city' | 'district';
+  value?: string[];
+  onChange?: (zoneIds: string[]) => void;
+  style?: React.CSSProperties;
+  placeholder?: string[];
+  allowClear?: boolean;
+  showSearch?: boolean;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "yootd",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "A react library developed with dumi",
   "license": "MIT",
   "module": "dist/index.js",
@@ -44,6 +44,7 @@
       "prettier --parser=typescript --write"
     ]
   },
+  "dependencies": {},
   "devDependencies": {
     "@commitlint/cli": "^17.1.2",
     "@commitlint/config-conventional": "^17.1.0",
@@ -56,6 +57,7 @@
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@umijs/lint": "^4.0.0",
+    "@vladmandic/face-api": "^1.7.14",
     "antd": "^5.21.4",
     "axios": "^1.7.7",
     "dayjs": "^1.11.13",
@@ -73,7 +75,8 @@
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "sass": "^1.80.0",
-    "stylelint": "^14.9.1"
+    "stylelint": "^14.9.1",
+    "yootd-webrtc-sdk": "^1.0.1"
   },
   "peerDependencies": {
     "@dnd-kit/core": ">=6.1.0",
@@ -81,6 +84,7 @@
     "@dnd-kit/sortable": ">=8.0.0",
     "@dnd-kit/utilities": ">=3.2.2",
     "@tanstack/react-query": ">=5.59.15",
+    "@vladmandic/face-api": "^1.7.14",
     "@xyflow/react": ">=12.3.3",
     "antd": ">=5.21.4",
     "axios": ">=1.7.7",
@@ -88,7 +92,8 @@
     "lodash": ">=4.17.21",
     "nanoid": ">=5.0.8",
     "react": ">=16.9.0",
-    "react-dom": ">=16.9.0"
+    "react-dom": ">=16.9.0",
+    "yootd-webrtc-sdk": "^1.0.1"
   },
   "publishConfig": {
     "access": "public"