@pubinfo-pr/core 0.222.4 → 0.224.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pubinfo-pr/core",
   "type": "module",
-  "version": "0.222.4",
+  "version": "0.224.1",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -27,9 +27,9 @@
     "node": "^20.19.0 || >=22.12.0"
   },
   "peerDependencies": {
-    "@pubinfo-pr/config": "0.222.4",
-    "@pubinfo-pr/devtools": "0.222.4",
-    "@pubinfo-pr/vite": "0.222.4",
+    "@pubinfo-pr/config": "0.224.1",
+    "@pubinfo-pr/devtools": "0.224.1",
+    "@pubinfo-pr/vite": "0.224.1",
     "alova": "^3.5.0",
     "pinia": "^3.0.4",
     "vue": "^3.5.28",
@@ -42,7 +42,7 @@
     "@headlessui/vue": "^1.7.23",
     "@imengyu/vue3-context-menu": "^1.5.4",
     "@pubinfo/pro-components": "^1.8.2",
-    "@pubinfo-pr/shared": "0.222.4",
+    "@pubinfo-pr/shared": "0.224.1",
     "@unocss/reset": "^66.6.0",
     "@vueuse/core": "^14.2.1",
     "@vueuse/integrations": "^14.2.1",
@@ -69,10 +69,10 @@
     "@alova/mock": "^2.0.18",
     "@iconify/json": "^2.2.437",
     "@iconify/vue": "^5.0.0",
-    "@pubinfo-pr/config": "0.222.4",
+    "@pubinfo-pr/config": "0.224.1",
     "@pubinfo/openapi": "^0.9.1",
     "@pubinfo/preset-openapi": "^0.9.1",
-    "@pubinfo-pr/vite": "0.222.4",
+    "@pubinfo-pr/vite": "0.224.1",
     "@types/lodash-es": "^4.17.12",
     "@types/md5": "^2.3.6",
     "@types/nprogress": "^0.2.3",

package/src/built-in/authentication/pages/change-organization/index.vue

@@ -127,37 +127,20 @@ async function changeOrganization() {
 
 <style scoped>
 .change-org {
-  width: 100%;
-  height: 100%;
+  --at-apply: size-full;
   background: url("./assets/login-small.png") no-repeat 50%;
   background-size: cover;
 }
 
 .change-org .org-item {
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  cursor: pointer;
-  width: 100%;
-  height: 91px;
-  overflow: hidden;
-  border-width: 1px;
-  margin-bottom: 15px;
-  padding-left: 2rem; /* 32px */
-  padding-right: 2rem; /* 32px */
-  padding-top: 22px;
-  padding-bottom: 22px;
-  border-radius: 0.5rem; /* 8px */
-  border-style: solid;
-  color: #86909c;
-  border-color: #f2f3f5;
+  --at-apply: box-border flex items-center justify-between w-full h-[91px]
+  overflow-hidden text-[#86909c] cursor-pointer border mb-[15px] px-8
+  py-[22px] rounded-lg border-solid border-[#f2f3f5];
   background: #fff;
 }
 
 .change-org .org-item.active {
-  background-color: rgb(22 119 255 / 0.1) /* #1677FF */;
-  border-color: rgb(22 119 255);
+  --at-apply: bg-[#1677FF] bg-op-10 border-[#1677ff];
 }
 
 [data-theme="dark"] .change-org {

package/src/built-in/authentication/pages/change-password/index.vue

@@ -60,41 +60,14 @@ const isValidate = ref(false);
 
 <style scoped>
 .password-bg {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  padding: 25px;
+  --at-apply: box-border flex flex-col size-full p-[25px];
   background: url("./assets/login-small.png") no-repeat 50%;
   background-size: cover;
 }
 
 .change-password-form {
-  display: flex;
-  flex-direction: column;
-  width: 560px;
-  min-height: 680px;
-  overflow: hidden;
-  --un-backdrop-blur: blur(7.5px);
-  -webkit-backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness)
-    var(--un-backdrop-contrast) var(--un-backdrop-grayscale)
-    var(--un-backdrop-hue-rotate) var(--un-backdrop-invert)
-    var(--un-backdrop-opacity) var(--un-backdrop-saturate)
-    var(--un-backdrop-sepia);
-  backdrop-filter: var(--un-backdrop-blur) var(--un-backdrop-brightness)
-    var(--un-backdrop-contrast) var(--un-backdrop-grayscale)
-    var(--un-backdrop-hue-rotate) var(--un-backdrop-invert)
-    var(--un-backdrop-opacity) var(--un-backdrop-saturate)
-    var(--un-backdrop-sepia);
-  padding-top: 4rem; /* 64px */
-  padding-bottom: 34px;
-  padding-left: 5rem; /* 80px */
-  padding-right: 5rem; /* 80px */
-  border-radius: 0.5rem; /* 8px */
-  border-width: 2px;
-  border-style: solid;
-  border-color: rgb(255 255 255);
+  --at-apply: flex flex-col w-[560px] min-h-[680px] overflow-hidden backdrop-blur-[7.5px]
+  pt-16 pb-[34px] px-20 rounded-lg border-2 border-solid border-white;
 
   box-shadow: 0 20px 50px rgb(29 42 165 / 5%);
   background: linear-gradient(180deg, hsl(0deg 0% 100% / 90%), hsl(0deg 0% 100% / 75%));

package/src/built-in/layout-component/Layout.vue

@@ -176,7 +176,7 @@ watch(scrollTop, (val, oldVal) => {
 
 <style scoped>
 [data-app-width-mode="adaption"] #app-main {
-  width: 100%;
+  --at-apply: w-full;
 }
 
 [data-app-width-mode="adaption-min-width"] #app-main {
@@ -184,7 +184,7 @@ watch(scrollTop, (val, oldVal) => {
 }
 
 [data-app-width-mode="center"] #app-main {
-  width: var(--g-app-width);
+  --at-apply: w-[--g-app-width];
 }
 
 [data-app-width-mode="center-max-width"] #app-main {
@@ -192,7 +192,7 @@ watch(scrollTop, (val, oldVal) => {
 }
 
 [data-mode="mobile"] #app-main {
-  width: 100%;
+  --at-apply: w-full;
 }
 
 [data-mode="mobile"] .sidebar-container {
@@ -216,71 +216,53 @@ watch(scrollTop, (val, oldVal) => {
 }
 
 .layout {
-  height: 100%;
+  --at-apply: h-full;
 }
 
 #app-main {
-  height: 100%;
-  background-color: var(--g-bg) /* var(--g-bg) */;
-  margin-left: auto;
-  margin-right: auto;
-  margin-top: 0;
-  margin-bottom: 0;
+  --at-apply: h-full bg-[--g-bg] mx-auto my-0;
 }
 
 :deep(#app-main.main-page-maximize header),
 #app-main.main-page-maximize .sidebar-container {
-  display: none;
+  --at-apply: hidden;
 }
 
 #app-main.main-page-maximize .wrapper {
-  padding-top: 0;
+  --at-apply: pt-0;
 }
 
 #app-main.main-page-maximize .wrapper .main-container {
-  margin-left: 0;
+  --at-apply: ml-0;
 }
 
 #app-main.main-page-maximize .wrapper .main-container .topbar-container {
-  display: none;
+  --at-apply: hidden;
 }
 
 #app-main.main-page-maximize .wrapper .main-container .main {
-  margin: 0;
+  --at-apply: m-0;
 }
 
 #app-main.main-page-maximize :deep([data-fixed-calc-width]) {
-  width: 100%;
-  transform: translateX(-50%);
+  --at-apply: w-full -translate-x-2/4;
 }
 
 .wrapper {
-  position: relative;
-  width: 100%;
-  height: 100%;
+  --at-apply: relative w-full h-full;
   transition: padding-top 0.3s;
 }
 
 .wrapper .sidebar-container {
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  z-index: 501;
-  display: flex;
+  --at-apply: fixed top-0 bottom-0 z-501 flex;
   width: calc(var(--g-main-sidebar-actual-width) + var(--g-sub-sidebar-actual-width));
   box-shadow: -1px 0 0 0 var(--g-border-color), 1px 0 0 0 var(--g-border-color);
   transition: width 0.3s, transform 0.3s, box-shadow 0.3s, top 0.3s;
 }
 
 .wrapper .sidebar-mask {
-  position: fixed;
-  z-index: 500;
-  width: 100%;
-  height: 100%;
-  visibility: hidden;
-  opacity: 0;
-  left: 0;
-  top: 0;
+  --at-apply: fixed z-[500] w-full h-full invisible opacity-0 left-0 top-0;
+
   background-size: 4px 4px;
   backdrop-filter: saturate(50%) blur(4px);
   transition: all 0.2s;
@@ -288,62 +270,33 @@ watch(scrollTop, (val, oldVal) => {
 }
 
 .wrapper .sidebar-mask.show {
-  visibility: visible;
-  opacity: 1;
+  --at-apply: visible op-100;
 }
 
 .wrapper ::v-deep(.main-sidebar-container:not(.main-sidebar-leave-active) + .sub-sidebar-container) {
-  left: var(--g-main-sidebar-width);
+  --at-apply: left-[--g-main-sidebar-width];
 }
 
 .wrapper .main-container {
-  display: flex;
-  flex-direction: column;
-  height: 0;
-  min-height: 100%;
+  --at-apply: flex flex-col h-0 min-h-full;
   margin-left: calc(var(--g-main-sidebar-actual-width) + var(--g-sub-sidebar-actual-width));
   box-shadow: -1px 0 0 0 var(--g-border-color), 1px 0 0 0 var(--g-border-color);
   transition: margin-left 0.3s, background-color 0.3s, box-shadow 0.3s;
 }
 
 .wrapper .main-container .main {
-  position: relative;
-  flex: auto;
-  flex-basis: 0;
-  height: 0;
+  --at-apply: relative flex-[auto] basis-0 h-0;
   transition: 0.3s;
 }
 
 .wrapper .main-container .main .exit-main-page-maximize {
-  & {
-    position: fixed;
-    cursor: pointer;
-    opacity: 0.5;
-    transition-property: opacity;
-    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-    transition-duration: 150ms;
-    z-index: 1000;
-    width: 5rem; /* 80px */
-    height: 5rem; /* 80px */
-    border-radius: 50%;
-    background-color: #44403c;
-    color: #d6d3d1;
-    right: -2.5rem; /* -40px */
-    top: -2.5rem; /* -40px */
-  }
-  &:hover {
-    opacity: 1;
-  }
-  .dark & {
-    background-color: #d6d3d1;
-    color: #44403c;
-  }
+  --at-apply: bg-stone-7 dark:bg-stone-3 text-stone-3 dark:text-stone-7
+  op-50 hover:op-100 transition-opacity fixed z-[1000] w-20 h-20 cursor-pointer
+  rounded-[50%] -right-10 -top-10;
 }
 
 .wrapper .main-container .main .exit-main-page-maximize svg {
-  position: absolute;
-  bottom: 1rem; /* 16px */
-  left: 1rem; /* 16px */
+  --at-apply: absolute bottom-4 left-4;
 }
 
 .wrapper .main-container .topbar-container.has-tabbar + .main {
@@ -359,39 +312,35 @@ watch(scrollTop, (val, oldVal) => {
 }
 
 header:not(.header-leave-active) + .wrapper {
-  padding-top: var(--g-header-height);
+  --at-apply: pt-[--g-header-height];
 }
 
 header:not(.header-leave-active) + .wrapper .sidebar-container {
-  top: var(--g-header-height);
+  --at-apply: top-[--g-header-height];
 }
 
 header:not(.header-leave-active) + .wrapper .sidebar-container :deep(.sidebar-logo) {
-  display: none;
+  --at-apply: hidden;
 }
 
 header:not(.header-leave-active) + .wrapper .main-container .topbar-container {
-  top: var(--g-header-height);
+  --at-apply: top-[--g-header-height];
 }
 
 header:not(.header-leave-active) + .wrapper .main-container .topbar-container :deep(.tools) {
-  display: none;
+  --at-apply: hidden;
 }
 
 /* 顶部栏 */
 .topbar-container {
-  position: absolute;
-  top: 0;
-  z-index: 100;
-  display: flex;
-  flex-direction: column;
+  --at-apply: absolute top-0 z-100 flex flex-col;
   box-shadow: 0 1px 0 0 var(--g-border-color);
   transition: width 0.3s, top 0.3s, transform 0.3s, box-shadow 0.3s;
 }
 
 .topbar-container.topbar-fixed,
 .topbar-container.topbar-sticky {
-  position: fixed;
+  --at-apply: fixed;
 }
 
 .topbar-container.topbar-fixed.shadow,

package/src/built-in/layout-component/components/Copyright/index.vue

@@ -35,40 +35,14 @@ const { settingsStore } = useContext();
 
 <style scoped>
 .copyright {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-wrap: wrap;
-  margin-top: 1rem; /* 16px */
-  margin-bottom: 1rem; /* 16px */
-  padding-left: 1rem; /* 16px */
-  padding-right: 1rem; /* 16px */
-  font-size: 0.875rem; /* 14px */
-  line-height: 1.25rem; /* 20px */
-  color: #78716c;
+  --at-apply: flex items-center justify-center flex-wrap my-4 px-4 text-sm text-stone-5;
 }
 
 .copyright span,a {
-  padding-left: 0.25rem; /* 4px */
-  padding-right: 0.25rem; /* 4px */
+  --at-apply: px-1;
 }
 
 .copyright a {
-  & {
-  text-align: center;
-  text-decoration: none;
-  color: #78716c;
-  transition-property: color, background-color, border-color,
-    text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter,
-    backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
-}
-&:hover {
-  color: #222222;
-}
-.dark &:hover {
-  color: #f6f6f6;
-}
+  --at-apply: text-center no-underline text-stone-5 hover:text-dark dark:hover:text-light transition;
 }
 </style>

package/src/built-in/layout-component/components/Header/HeaderFullMenu/More.vue

@@ -56,13 +56,11 @@ function menuClick(index: number, item: Menu.recordMainRaw) {
 
 <style scoped>
 .menu-more-container {
-  min-width: 180px;
-  padding: 10px;
-  padding-bottom: 0;
+  --at-apply: min-w-180px p-10px pb-0;
 }
 
 .menu-more-container .is-dev {
-  cursor: not-allowed;
+  --at-apply: cursor-not-allowed;
 }
 
 .menu-more-container .is-dev i {
@@ -76,31 +74,22 @@ function menuClick(index: number, item: Menu.recordMainRaw) {
 
 <style>
 .v-popper--theme-more-appley {
-  z-index: 1000;
+  --at-apply: z-1000;
   z-index: 1000;
 }
 
 .v-popper--theme-more-appley .v-popper__inner {
-  border-width: 1px;
-  border-color: white;
-  border-style: solid;
-  border-radius: 8px;
+  --at-apply: border border-white border-solid rounded-8px;
   background-image: linear-gradient(-43deg, #fff 0%, #eaf3ff 87%);
   box-shadow: 8px 16px 28px -8px #8195b74f;
 }
 
 .v-popper--theme-more-appley .v-popper__arrow-container {
-  display: none;
+  --at-apply: hidden;
 }
 
 .dark .v-popper--theme-more-appley .v-popper__inner {
-  border-width: 1px;
-  border-color: #4b4f53;
-  border-style: solid;
-  border-radius: 8px;
-  --un-shadow: none;
-  box-shadow: var(--un-ring-offset-shadow), var(--un-ring-shadow),
-    var(--un-shadow);
+  --at-apply: border border-#4b4f53 border-solid rounded-8px shadow-[none];
   background-image: linear-gradient(-43deg, #141414 0%, #141414 87%);
 }
 </style>

package/src/built-in/layout-component/components/Header/HeaderFullMenu/NotCursor.vue

@@ -38,44 +38,33 @@ withDefaults(defineProps<{
 
 <style scoped>
 .not-cursor-container {
-  width: 100%;
-  height: 100%;
+--at-apply: size-full;
 }
 </style>
 
 <style>
 .v-popper--theme-not-cursor {
-  z-index: 1000;
+  --at-apply: z-1000;
 }
 
 .v-popper--theme-not-cursor .v-popper__inner {
-  width: 228px;
-  height: 123px;
-  border-width: 1px;
-  border-style: solid;
-  border-color: rgb(255 255 255 / 1);
-  border-radius: 0.375rem; /* 6px */
+  --at-apply: w-228px h-123px border border-solid border-white rounded-md;
+
   background-image: linear-gradient(-55deg, #fff 0%, #eaf3ff 87%);
   box-shadow: 4px 8px 14px -4px #8195b74f;
 }
 
 .v-popper--theme-not-cursor .v-popper__inner > div {
-  width: 100%;
-  height: 100%;
+  --at-apply: size-full;
 }
 
 .v-popper--theme-not-cursor .v-popper__arrow-container {
+  --at-apply: hidden;
   display: none;
 }
 
 .dark .v-popper--theme-not-cursor .v-popper__inner {
-  --un-shadow: none;
-  box-shadow: var(--un-ring-offset-shadow), var(--un-ring-shadow),
-    var(--un-shadow);
-  border-radius: 8px;
-  border-width: 1px;
-  border-style: solid;
-  border-color: #4b4f53;
+  --at-apply: shadow-[none] rounded-8px border border-solid border-[#4b4f53];
   background-image: linear-gradient(-43deg, #141414 0%, #141414 87%);
 }
 </style>