@yoka-ui/ui 1.0.10-test

package/dist/es/components/YkRangeDateWithVS/index.module.less

@@ -0,0 +1,548 @@
+@primaryColor: #3b86f9;
+@iconPrimaryColor: #0a6bfd;
+@fontPrimaryColor: #0a6bfd;
+@borderPrimaryColor: #b0cffe;
+@globalBgColor: #edeff4;
+
+@ykFontFamilySemibold: 'PingFangSC-Semibold', 'PingFang SC', 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial,
+  sans-serif;
+@ykFontFamilyRegular: 'PingFangSC-Regular', 'PingFang SC', 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial,
+  sans-serif;
+@ykFontFamilyMedium: 'PingFangSC-Medium', 'PingFang SC', 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial,
+  sans-serif;
+
+/* ========== layout: global filter bar ========== */
+
+.globalItem {
+  display: flex;
+  align-items: center;
+  height: 30px;
+  padding: 0 10px;
+  color: #333333;
+  background-color: #ffffff;
+  border: 0.5px solid #e7e7e7;
+  border-radius: 2px;
+  cursor: pointer;
+  transition: color 0.2s;
+}
+
+.globalItem i {
+  margin-right: 5px;
+  color: #999;
+}
+
+.globalItem .active {
+  color: @iconPrimaryColor;
+}
+
+.globalItemChecked {
+  color: #0a6bfd;
+  background-color: #e7ecff;
+  border-color: @borderPrimaryColor;
+}
+
+.globalItemChecked i {
+  color: #0a6bfd;
+  font-size: 14px;
+}
+
+.globalItemChecked :global {
+  .ant-picker-input input {
+    color: #0a6bfd;
+  }
+}
+
+.globalItemDate,
+.globalItemSingleDate {
+  width: 190px;
+  padding: 0;
+}
+
+.globalItemSingleDate {
+  width: 105px;
+}
+
+.globalItemDateSingle {
+  width: 190px;
+  padding: 0;
+}
+
+.globalItemDateDel i {
+  margin-right: 0;
+}
+
+.globalItemDatePanel {
+  padding: 0 !important;
+
+  :global {
+    .ant-picker-range-arrow {
+      display: none !important;
+    }
+
+    .ant-picker-panel-container {
+      border-radius: 2px;
+    }
+
+    .ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before {
+      top: auto;
+      bottom: 0;
+      left: 50%;
+      width: 4px;
+      height: 4px;
+      border-width: 2px;
+      border-radius: 50%;
+      transform: translateX(-2px);
+    }
+  }
+}
+
+.globalItemDateTerm {
+  position: relative;
+  margin-right: 10px;
+  padding-left: 5px;
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+}
+
+.globalItemDateTerm::after {
+  position: absolute;
+  top: 50%;
+  right: 0;
+  display: block;
+  width: 2px;
+  height: 10px;
+  background-color: #d1d1d1;
+  transform: translateY(-5px);
+  content: '';
+}
+
+.globalItemInterval {
+  padding: 0 8px;
+  color: #333333;
+}
+
+.globalDisabled {
+  color: #999999;
+  background: #f7f8fa;
+  border: 0.5px solid #e7e7e7;
+  cursor: not-allowed;
+}
+
+.globalDisabled:hover {
+  border-color: #e7e7e7;
+}
+
+.globalDisabled .active {
+  color: #c8c8c8 !important;
+}
+
+.globalData {
+  position: relative;
+  display: flex;
+  padding: 0;
+}
+
+.globalDataItem {
+  position: relative;
+  width: 70px;
+  height: 30px;
+  line-height: 30px;
+  text-align: center;
+  transition: 0.1s all linear;
+}
+
+.globalDataItem.checked {
+  color: #fff;
+}
+
+.globalDataItem.checked:hover {
+  color: #fff;
+  background: #6da2ff;
+}
+
+.globalDataItem.disabled {
+  color: #999999 !important;
+  background: #f7f8fa;
+  border: 0.5px solid #e7e7e7;
+  cursor: not-allowed;
+}
+
+.globalDataItem:hover {
+  color: #3b82fe;
+}
+
+.globalDataItem + .globalDataItem {
+  border-left: 1px solid #e7e7e7;
+}
+
+.globalDataChecked {
+  position: absolute;
+  left: 0;
+  width: 70px;
+  height: 30px;
+  background: #3b86f9;
+}
+
+.globalData .globalDataItem.checked:global(.ant-segmented-item) {
+  color: #fff;
+}
+
+.globalData .globalDataItem.checked:global(.ant-segmented-item):hover {
+  color: #fff;
+}
+
+.globalDropdown {
+  width: 100%;
+  max-height: 350px;
+  padding: 5px 8px;
+  overflow-y: auto;
+  background-color: #fff;
+  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
+}
+
+.globalDropdownItem {
+  margin-bottom: 5px;
+  padding: 7px 15px;
+  color: #666666;
+  cursor: pointer;
+}
+
+.globalDropdownItem:nth-last-child(1) {
+  margin-bottom: 0;
+}
+
+.globalDropdownItem:hover {
+  background-color: #f9f9f9;
+}
+
+.globalDropdownItem.checked {
+  color: @fontPrimaryColor;
+  background: #fafafc;
+}
+
+.globalDuibiIcon {
+  display: flex;
+  align-items: center;
+  margin-right: 10px;
+  color: @iconPrimaryColor;
+}
+
+.globalMl + .globalMl {
+  margin-left: 10px;
+}
+
+.globalW90 {
+  width: 90px;
+}
+
+/* ========== date picker popover (cps) ========== */
+
+.rangePickerCustomDisplay {
+  position: relative;
+  display: inline-flex;
+  align-items: stretch;
+  vertical-align: middle;
+
+  :global(.ant-picker-input input) {
+    color: transparent !important;
+    caret-color: transparent;
+  }
+
+  :global(.ant-picker-range-separator),
+  :global(.ant-picker-separator) {
+    color: transparent;
+  }
+}
+
+.rangePickerCustomDisplayLabel {
+  position: absolute;
+  inset: 0;
+  left: 11px;
+  right: 11px;
+  display: flex;
+  align-items: center;
+  pointer-events: none;
+  overflow: hidden;
+  font-size: 14px;
+  line-height: 1;
+  color: inherit;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.ykRangeDateWithVs {
+  display: flex;
+}
+
+.ykRangeDateWithVsHeader {
+  display: flex;
+  padding: 3px 0 0 12px;
+  border-bottom: 1px solid #ededed;
+}
+
+.ykRangeDateWithVsHeaderAnchor:global(.ant-anchor-wrapper-horizontal)::before {
+  display: none;
+}
+
+.ykRangeDateWithVsHeaderAnchor :global(.ant-anchor-link-title) {
+  padding: 5px 3px;
+}
+
+.ykRangeDateWithVsTag {
+  padding: 0 1px;
+  overflow: hidden;
+  font-size: 10px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  opacity: 0.6;
+}
+
+.ykRangeDateWithVsGroup {
+  display: flex;
+}
+
+.ykRangeDateWithVsGroup :global(.ant-picker-panel-layout) :global(.ant-picker-presets) li {
+  width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.ykRangeDateWithVsGroup :global(.ant-picker-panel-layout) :global(.ant-picker-presets) .ant-picker-presets-li {
+  font-size: 12px;
+}
+
+.ykRangeDateWithVsShortcut {
+  border-right: 1px solid #ededed;
+}
+
+.ykRangeDateWithVsShortcutTitle {
+  padding: 15px 15px 0;
+  color: #333333;
+}
+
+.ykRangeDateWithVsShortcutContent {
+  display: flex;
+  flex-wrap: wrap;
+  align-content: flex-start;
+  width: 160px;
+  padding: 15px;
+}
+
+.ykRangeDateWithVsShortcutItem {
+  width: 60px;
+  height: 30px;
+  margin-bottom: 10px;
+  line-height: 30px;
+  text-align: center;
+  border: 1px solid #ededed;
+  border-radius: 3px;
+  cursor: pointer;
+}
+
+.ykRangeDateWithVsShortcutItem.checked {
+  color: #fff;
+  background-color: #3b86f9;
+}
+
+.ykRangeDateWithVsShortcutItem.checked:hover {
+  color: #fff;
+}
+
+.ykRangeDateWithVsShortcutItem:nth-child(2n + 1) {
+  margin-right: 10px;
+}
+
+.ykRangeDateWithVsShortcutItem:hover {
+  color: @iconPrimaryColor;
+  border-color: @borderPrimaryColor;
+}
+
+.ykRangeDateWithVsPanel {
+  flex: 1;
+  min-width: 0;
+
+  :global {
+    .ant-picker-panel-layout {
+      .ant-picker-presets {
+        ul {
+          display: grid;
+          grid-template-columns: repeat(2, 1fr);
+          gap: 10px;
+          align-content: start;
+          padding: 15px 10px 10px 10px !important;
+
+          li {
+            position: relative;
+            width: 100%;
+            min-width: 0;
+            height: 30px;
+            margin-top: 0 !important;
+            margin-bottom: 0;
+            line-height: 30px;
+            text-align: center;
+            border: 1px solid #ededed;
+            border-radius: 2px !important;
+            box-sizing: border-box;
+          }
+
+          .ant-picker-presets-li {
+            position: absolute;
+            font-size: 12px;
+            top: 0;
+            right: 0;
+            bottom: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+
+            &.ant-picker-presets-li-item {
+              color: #fff;
+              background-color: #3b86f9;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+.ykRangeDateWithVsFooter {
+  display: flex;
+  justify-content: space-between;
+  padding: 20px;
+  color: #999999;
+  border-top: 1px solid #ededed;
+}
+
+.ykRangeDateWithVsFooterSingle {
+  padding: 10px 20px 20px;
+  color: #999999;
+  border-top: 1px solid #ededed;
+}
+
+.ykRangeDateWithVsFooterButtons {
+  justify-content: flex-end;
+  padding: 0;
+}
+
+.ykRangeDateWithVsFooterButtons .item {
+  width: 100px;
+}
+
+/* ========== milestone sidebar ========== */
+
+.milestoneList {
+  position: relative;
+  height: 420px;
+  padding: 15px 10px;
+  overflow-y: auto;
+  border-right: 1px solid #ecedf1;
+}
+
+.milestoneListBox {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.milestoneListItem {
+  box-sizing: border-box;
+  width: 120px;
+  height: 30px;
+  font-size: 12px;
+  line-height: 30px;
+  background: #ffffff;
+  border: 1px solid #ededed;
+  border-radius: 2px;
+  cursor: pointer;
+  transition: all 0.3s;
+}
+
+.milestoneListItem:hover {
+  background: rgba(0, 0, 0, 0.04);
+}
+
+.milestoneListActive {
+  color: #fff;
+  background: #3b86f9;
+  border: 0.5px solid #3b86f9;
+}
+
+.milestoneListActive:hover {
+  background: #3b86f9;
+}
+
+/* ========== legacy popover ========== */
+
+.dateEventPopover {
+  position: relative;
+  width: 300px;
+  padding: 20px 30px;
+  overflow: hidden;
+  text-align: center;
+  border-radius: 2px;
+  box-shadow: 0px 2px 12px 0px rgba(71, 71, 71, 0.1);
+}
+
+.dateEventPopoverTips {
+  position: absolute;
+  top: 16px;
+  left: -45px;
+  width: 140px;
+  height: 16px;
+  color: #ffffff;
+  font-weight: 400;
+  font-size: 10px;
+  text-align: center;
+  transform: rotate(-45deg);
+}
+
+.dateEventPopoverTitle {
+  margin-bottom: 2px;
+  color: #333333;
+  font-weight: 500;
+  font-size: 14px;
+  text-align: center;
+}
+
+.dateEventPopoverDate {
+  color: #666666;
+  font-weight: 400;
+  font-size: 10px;
+  text-align: center;
+}
+
+.dateEventPopoverComments {
+  margin-top: 20px;
+  color: #333333;
+  font-weight: 400;
+  font-size: 12px;
+  white-space: initial;
+  text-align: left;
+}
+
+.dateEventPopoverBtn {
+  margin-top: 20px;
+  color: #3c81fe;
+  font-weight: 400;
+  font-size: 14px;
+  font-family: PingFang SC;
+  text-align: right;
+  background: #ffffff;
+  border: 0.5px solid #3c81fe;
+  border-radius: 2px;
+  box-shadow: 0px 0.5px 0px 0px #e7e7e7;
+}
+
+.active {
+  vertical-align: inherit;
+}
+
+.checked {
+  vertical-align: inherit;
+}
+
+.disabled {
+  vertical-align: inherit;
+}

package/dist/es/components/YkRangeDateWithVS/styles.d.ts

@@ -0,0 +1,2 @@
+declare const styles: Record<string, string>;
+export default styles;

package/dist/es/components/YkRangeDateWithVS/styles.js

@@ -0,0 +1,18 @@
+// src/components/YkRangeDateWithVS/styles.ts
+import raw from "./index.module.less";
+function resolveCssModuleLocals(mod) {
+  if (mod == null || typeof mod !== "object") {
+    return {};
+  }
+  const d = mod.default;
+  if (d && typeof d === "object" && !Array.isArray(d)) {
+    return d;
+  }
+  return mod;
+}
+var styles = resolveCssModuleLocals(raw);
+var styles_default = styles;
+export {
+  styles_default as default
+};
+//# sourceMappingURL=styles.js.map

package/dist/es/components/YkRangeDateWithVS/styles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/YkRangeDateWithVS/styles.ts"],
+  "sourcesContent": ["import raw from './index.module.less';\n\n/**\n * 统一解析 css-loader / Vite 等对 `*.module.less` 的导出形态（有时为 `default`，有时为平铺对象），\n * 避免出现 `styles.xxx === undefined`、className 不生效。\n */\nfunction resolveCssModuleLocals(mod: unknown): Record<string, string> {\n  if (mod == null || typeof mod !== 'object') {\n    return {};\n  }\n  const d = (mod as { default?: unknown }).default;\n  if (d && typeof d === 'object' && !Array.isArray(d)) {\n    return d as Record<string, string>;\n  }\n  return mod as Record<string, string>;\n}\n\nconst styles = resolveCssModuleLocals(raw);\n\nexport default styles;\n"],
+  "mappings": ";AAAA,OAAO,SAAS;AAMhB,SAAS,uBAAuB,KAAsC;AACpE,MAAI,OAAO,QAAQ,OAAO,QAAQ,UAAU;AAC1C,WAAO,CAAC;AAAA,EACV;AACA,QAAM,IAAK,IAA8B;AACzC,MAAI,KAAK,OAAO,MAAM,YAAY,CAAC,MAAM,QAAQ,CAAC,GAAG;AACnD,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEA,IAAM,SAAS,uBAAuB,GAAG;AAEzC,IAAO,iBAAQ;",
+  "names": []
+}

package/dist/es/components/YkRangeDateWithVS/typing.d.ts

@@ -0,0 +1,15 @@
+type ProjectNodeItem = {
+  id?: number | string;
+  type: number;
+  tag: string;
+  comments?: string;
+  range_day: string[];
+  format_day?: string;
+  created_at?: string;
+  create_user_name?: string;
+  update_user_name?: string;
+  updated_at?: string;
+  y_axis?: string[];
+  report_path?: string;
+  series_type?: string;
+};

package/dist/es/components/YkRangeTimeWithRecent/constants.d.ts

@@ -0,0 +1,48 @@
+type RangeValue = [string, string] | null;
+type dateOptionType = {
+    label: string;
+    value: () => RangeValue;
+};
+export declare const hourOptions: dateOptionType[];
+export declare const dateOptions: dateOptionType[];
+export declare const weekOptions: dateOptionType[];
+export declare const monthOptions: dateOptionType[];
+export declare const optionsMap: {
+    [key: string]: {
+        options: dateOptionType[];
+        default: () => RangeValue;
+    };
+};
+export declare const pickerMap: {
+    [key: string]: 'date' | 'week' | 'month';
+};
+export declare const recentDayOptions: {
+    label: string;
+    value: string;
+}[];
+export declare const recentWeekOptions: {
+    label: string;
+    value: string;
+}[];
+export declare const recentMonthOptions: {
+    label: string;
+    value: string;
+}[];
+export declare const recentOptionsMap: {
+    [key: string]: {
+        options: {
+            label: string;
+            value: string;
+        }[];
+        default: string;
+    };
+};
+export declare const startTimeOptions: {
+    label: string;
+    value: number;
+}[];
+export declare const endTimeOptions: {
+    label: string;
+    value: number;
+}[];
+export {};