@mptw/skylens-ui 1.5.9 → 1.5.11

package/app/assets/css/layout.css

@@ -1,4 +1,4 @@
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 @layer base {
   body {

package/app/components/SLAlertModal.vue

@@ -75,7 +75,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .alert-modal {
   @apply z-60;

package/app/components/SLBreadcrumbs.vue

@@ -30,7 +30,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .breadcrumbs {
   @apply flex flex-wrap items-center justify-start text-lg text-primary font-bold;

package/app/components/SLButton.vue

@@ -116,7 +116,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .btn {
   @apply relative inline-flex items-center justify-center p-1.75 border border-transparent rounded bg-transparent text-base leading-[1.3125] focus:outline-none;

package/app/components/SLCalendarButton.vue

@@ -40,9 +40,9 @@ import { fromEvent } from "rxjs";
 import { differenceInCalendarDays, subDays } from "date-fns";
 import { createPopper } from "@popperjs/core";
 import type { Placement } from "@popperjs/core";
-import DateRange from "ui/app/models/DateRange";
-import type IDateRange from "ui/app/interface/IDateRange";
-import { OnlineSourceType } from "ui/app/interface/IWeb";
+import DateRange from "~app/models/DateRange";
+import type IDateRange from "~app/interface/IDateRange";
+import { OnlineSourceType } from "~app/interface/IWeb";
 
 type SLCalendarPopupType = InstanceType<typeof SLCalendarPopup>;
 
@@ -241,7 +241,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .calendar-button {
   @apply inline-block;

package/app/components/SLCalendarPopup.vue

@@ -121,9 +121,9 @@ import {
   isPreviousDateRange,
   previousDateRange,
   isValidDate,
-} from "ui/app/utils";
-import type IDateRange from "ui/app/interface/IDateRange";
-import { OnlineSourceType } from "ui/app/interface/IWeb";
+} from "~app/utils";
+import type IDateRange from "~app/interface/IDateRange";
+import { OnlineSourceType } from "~app/interface/IWeb";
 
 const DateStringRegexp = /[0-9]{4}\/[0-9]{2}\/[0-9]{2}/;
 
@@ -774,7 +774,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .calendar-popup {
   @apply w-auto py-4 border border-primary-100 rounded-lg bg-white shadow-md overflow-hidden;

package/app/components/SLCard.vue

@@ -63,7 +63,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .tabs .tabs .card {
   @apply border-0 rounded-none shadow-none;

package/app/components/SLChart.vue

@@ -188,7 +188,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .chart {
   @apply flex w-full h-52 min-h-52 overflow-hidden;

package/app/components/SLCheckbox.vue

@@ -16,8 +16,8 @@
 
 <script lang="ts">
 import { isEqual } from "lodash-es";
-import type IInputOption from "ui/app/interface/IInputOption";
-import { getUID } from "ui/app/utils";
+import type IInputOption from "~app/interface/IInputOption";
+import { getUID } from "~app/utils";
 
 export default defineComponent({
   name: "SLCheckbox",
@@ -181,7 +181,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .checkbox {
   @apply inline-flex relative text-base align-top overflow-hidden;

package/app/components/SLCircleButton.vue

@@ -72,7 +72,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .circle-button {
   @apply inline-flex items-center justify-center relative w-10 h-10 rounded-full bg-white text-xl leading-5.75 text-white;

package/app/components/SLCollapsableBlock.vue

@@ -96,7 +96,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .sl-collapsable-block {
   @apply p-3.75 border border-secondary-400 rounded-lg;

package/app/components/SLCollapsableMulitPillSelect.vue

@@ -23,7 +23,7 @@
 
 <script lang="ts">
 import type { PropType } from "vue";
-import type IInputOption from "ui/app/interface/IInputOption";
+import type IInputOption from "~app/interface/IInputOption";
 
 export default defineComponent({
   name: "SLCollapsableMultiPillSelect",
@@ -73,7 +73,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .collapsable-multi-pill-select .toggle-button {
   @apply inline-flex items-center justify-between w-80 p-2 mb-2 border border-primary-500 rounded text-base text-pgray-2;

package/app/components/SLConfirmModal.vue

@@ -113,7 +113,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .confirm-modal .modal-backdrop {
   @apply bg-white/40 backdrop-blur-[5px];

package/app/components/SLContextMenu.vue

@@ -19,9 +19,10 @@
 
 <script lang="ts">
 import { fromEvent, type Subscription } from "rxjs";
-import type IDateRange from "ui/app/interface/IDateRange";
+import type IDateRange from "~app/interface/IDateRange";
+import WatermarkImage from "~public/assets/images/commons/watermark-2.svg";
 
-const WatermarkImage = "/assets/images/commons/watermark-2.svg";
+// const WatermarkImage = "/assets/images/commons/watermark-2.svg";
 const keys = { 37: 1, 38: 1, 30: 1, 40: 1 };
 
 function preventDefault(e: Event) {
@@ -267,7 +268,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .sl-context-menu-wrapper {
   @apply hidden;

package/app/components/SLDateInput.vue

@@ -70,7 +70,7 @@ import type { PropType } from "vue";
 import { DatePicker } from "v-calendar";
 import "v-calendar/style.css";
 import { isDate, differenceInCalendarDays } from "date-fns";
-import type IDateRange from "ui/app/interface/IDateRange";
+import type IDateRange from "~app/interface/IDateRange";
 
 type DatePickerType = InstanceType<typeof DatePicker> & {
   hidePopover: () => void;
@@ -363,7 +363,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .date-input.date-input-xs .input-group-prepend {
   @apply pl-2.75 pr-4 rounded-l-lg;

package/app/components/SLDatePicker.vue

@@ -29,7 +29,7 @@ import {
   max as dateMax,
   isDate,
 } from "date-fns";
-import type IDateRange from "ui/app/interface/IDateRange";
+import type IDateRange from "~app/interface/IDateRange";
 
 type DatePickerType = InstanceType<typeof DatePicker>;
 
@@ -137,7 +137,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .custom-date-picker .vc-pane-container {
   @apply border-0;

package/app/components/SLDownloadButton.vue

@@ -31,15 +31,16 @@ import { fromEvent, type Subscription } from "rxjs";
 import { createPopper } from "@popperjs/core";
 import type { Instance as PopperInstance, Placement } from "@popperjs/core";
 import ExcelJS from "exceljs";
-import { downloadURL, downloadBlob, gaev, ga4ev } from "ui/app/utils";
-import type IDateRange from "ui/app/interface/IDateRange";
+import { downloadURL, downloadBlob, gaev, ga4ev } from "~app/utils";
+import type IDateRange from "~app/interface/IDateRange";
+import WatermarkImage from "~public/assets/images/commons/watermark-2.svg";
 
 // http://www.excelcodex.com/2012/06/worksheets-naming-conventions/
 function safeSheetName(name: string) {
   return name.replace(/[\\/*?:[\]]/g, "").substring(0, 31);
 }
 
-const WatermarkImage = "/assets/images/commons/watermark-2.svg";
+// const WatermarkImage = "/assets/images/commons/watermark-2.svg";
 
 export default defineComponent({
   name: "SLDownloadButton",
@@ -273,7 +274,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .download-button {
   @apply inline-block;

package/app/components/SLDropdown.vue

@@ -241,7 +241,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .dropdown {
   @apply inline-block relative;

package/app/components/SLDropdownItem.vue

@@ -23,7 +23,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .dropdown-item {
   @apply block p-2 bg-white text-sm text-primary whitespace-nowrap hover:text-primary hover:bg-primary-50 focus:text-primary focus:bg-primary-50 active:text-primary active:bg-primary-50;

package/app/components/SLElementWithTitle.vue

@@ -170,7 +170,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .element-with-title {
   @apply inline-flex;

package/app/components/SLEyeCheckbox.vue

@@ -18,7 +18,7 @@
 
 <script lang="ts">
 import { isEqual } from "lodash-es";
-import { getUID } from "ui/app/utils";
+import { getUID } from "~app/utils";
 
 export default defineComponent({
   name: "SLEyeCheckbox",
@@ -119,7 +119,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .eye-checkbox {
   @apply inline-block relative text-base align-top overflow-hidden;

package/app/components/SLFileInput.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script lang="ts">
-import { getUID } from "ui/app/utils";
+import { getUID } from "~app/utils";
 
 export default defineComponent({
   name: "SLFileInput",
@@ -79,7 +79,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .custom-file-input {
   @apply inline-flex items-center space-x-3.5;

package/app/components/SLGenderAgeSelect.vue

@@ -42,7 +42,7 @@ import type { PropType } from "vue";
 import { fromEvent, type Subscription } from "rxjs";
 import { createPopper } from "@popperjs/core";
 import type { Instance as PopperInstance } from "@popperjs/core";
-import { AGE_RANGE_NAME } from "ui/app/utils/constants";
+import { AGE_RANGE_NAME } from "~app/utils/constants";
 
 export default defineComponent({
   name: "SLGenderAgeSelect",
@@ -235,7 +235,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .gender-age-select {
   @apply relative inline-flex;

package/app/components/SLHourRangeInput.vue

@@ -33,7 +33,7 @@
 
 <script lang="ts">
 import type { PropType } from "vue";
-import type IHourRange from "ui/app/interface/IHourRange";
+import type IHourRange from "~app/interface/IHourRange";
 
 export default defineComponent({
   name: "SLHourRangeInput",
@@ -167,7 +167,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .hour-range-input.inline {
   @apply flex;

package/app/components/SLIOSSwitch.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script lang="ts">
-import { getUID } from "ui/app/utils";
+import { getUID } from "~app/utils";
 
 export default defineComponent({
   name: "SLIOSSwitch",
@@ -170,7 +170,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .ios-switch {
   @apply inline-block relative overflow-hidden;

package/app/components/SLIconButton.vue

@@ -100,7 +100,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .icon-btn {
   @apply inline-flex flex-nowrap justify-start items-center p-[0.59375rem] border rounded-full text-base text-white overflow-hidden transition-[width] duration-300;

package/app/components/SLInfoTip.vue

@@ -181,7 +181,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .info-tip {
   @apply inline-flex ml-2 text-base leading-4.5 text-primary hover:text-primary-600 cursor-default;

package/app/components/SLInsightSitePage.vue

@@ -16,7 +16,7 @@ export default {
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .insight-site-page {
   @apply grow flex flex-col;

package/app/components/SLLegend.vue

@@ -24,7 +24,7 @@
 
 <script lang="ts">
 import type { PropType } from "vue";
-import type ILegendItem from "ui/app/interface/ILegendItem";
+import type ILegendItem from "~app/interface/ILegendItem";
 
 export default defineComponent({
   name: "SLLegend",
@@ -59,7 +59,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .chart-legend {
   @apply text-center;

package/app/components/SLLinearProgressBar.vue

@@ -10,7 +10,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .linear-progress-bar {
   @apply w-full h-2 bg-[#D3D3D3] rounded-[1px] overflow-hidden;

package/app/components/SLLink.vue

@@ -150,7 +150,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .sl-link * {
   @apply pointer-events-none;

package/app/components/SLLoading.vue

@@ -86,7 +86,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .loading-modal {
   @apply z-10;

package/app/components/SLMapChart.vue

@@ -166,7 +166,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .map-chart {
   @apply h-52;

package/app/components/SLModal.vue

@@ -289,7 +289,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .modal {
   @apply z-50 fixed top-0 left-0 w-full h-full overflow-hidden;

package/app/components/SLMonthCalendarButton.vue

@@ -61,7 +61,7 @@ import {
 } from "date-fns";
 import { createPopper } from "@popperjs/core";
 import type { Instance as PopperInstance } from "@popperjs/core";
-import { gaev, ga4ev } from "ui/app/utils";
+import { gaev, ga4ev } from "~app/utils";
 
 export default defineComponent({
   name: "SLMonthCalendarButton",
@@ -331,7 +331,7 @@ export default defineComponent({
 </script>
 
 <style lang="css" scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .month-calendar-button {
   @apply inline-flex;

package/app/components/SLMonthPicker.vue

@@ -106,7 +106,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .month-picker {
   @apply w-47.5 space-y-4;

package/app/components/SLMultiEmailInput.vue

@@ -112,7 +112,7 @@ import Swiper from "swiper";
 import { FreeMode, Scrollbar, Mousewheel } from "swiper/modules";
 import "swiper/css";
 import "swiper/css/scrollbar";
-import { OrgUserRole } from "ui/app/interface/IOrganization";
+import { OrgUserRole } from "~app/interface/IOrganization";
 
 export default defineComponent({
   name: "SLMultiEmailInput",
@@ -606,7 +606,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .multi-email-input {
   @apply flex flex-col;

package/app/components/SLMultiSelect.vue

@@ -16,7 +16,7 @@
 <script lang="ts">
 import type { PropType } from "vue";
 import { isEqual } from "lodash-es";
-import type IInputOption from "ui/app/interface/IInputOption";
+import type IInputOption from "~app/interface/IInputOption";
 
 export default defineComponent({
   name: "SLMultiSelect",
@@ -86,7 +86,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .custom-multi-select {
   @apply px-3 py-1 border border-primary-500 rounded;

package/app/components/SLNoData.vue

@@ -1,6 +1,6 @@
 <template lang="pug">
 .no-data(:class='{ "no-data--sm": size === "sm" }')
-  img(src="~ui/app/assets/images/commons/empty-box.png")
+  img(src="~app/assets/images/commons/empty-box.png")
   .no-data-title {{ title }}
   .no-data-reason(v-if='reason') 可能的原因：{{ reason }}
 </template>
@@ -28,7 +28,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .no-data {
   @apply flex flex-col items-center w-full py-8 px-4 space-y-3 bg-white rounded-lg;

package/app/components/SLNotification.vue

@@ -143,7 +143,7 @@ export default defineComponent({
 </script>
 
 <style lang="css">
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .notification {
   @apply z-100 fixed top-0 left-0 w-full h-full pointer-events-none;

package/app/components/SLPageModal.vue

@@ -51,7 +51,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .page-modal-backdrop {
   @apply fixed top-0 left-0 w-full h-full bg-white/70 backdrop-blur-[8px];

package/app/components/SLPagination.vue

@@ -144,7 +144,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .pagination {
   @apply flex items-center justify-end;

package/app/components/SLPillCheckbox.vue

@@ -16,7 +16,7 @@
 <script lang="ts">
 import type { PropType } from "vue";
 import { isEqual } from "lodash-es";
-import { getUID } from "ui/app/utils";
+import { getUID } from "~app/utils";
 
 export default defineComponent({
   name: "SLPillCheckbox",
@@ -140,7 +140,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .pill-checkbox {
   @apply inline-block relative;

package/app/components/SLPillLabel.vue

@@ -63,7 +63,7 @@ export default defineComponent({
 </script>
 
 <style>
-@reference 'ui/app/assets/css/main.css';
+@reference '~app/assets/css/main.css';
 
 .pill-label {
   @apply inline-flex justify-center items-center relative px-1.75 py-0.75;