@ncds/ui-admin 1.4.1 → 1.5.1

package/dist/ui-admin/assets/styles/style.css

@@ -754,6 +754,62 @@ button {
   background-color: rgba(255, 255, 255, 0.2);
 }
 
+.ncua-button-stepper {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 10px;
+  cursor: pointer;
+  background-color: var(--gray-100);
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7' height='4' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23757678'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: 6px 4px;
+  border-radius: 4px 4px 1px 1px;
+}
+.ncua-button-stepper:hover:not(:disabled), .ncua-button-stepper:focus:not(:disabled) {
+  background-color: var(--gray-200);
+}
+.ncua-button-stepper:disabled {
+  background-color: var(--gray-100);
+}
+.ncua-button-stepper--xs {
+  width: 20px;
+  height: 10px;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6px' height='4px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23757678'/%3E%3C/svg%3E");
+  background-size: 6px 4px;
+}
+.ncua-button-stepper--xs:hover:not(:disabled), .ncua-button-stepper--xs:focus:not(:disabled) {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6px' height='4px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23171818'/%3E%3C/svg%3E");
+}
+.ncua-input:focus-within .ncua-button-stepper--xs {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6px' height='4px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%232f2f30'/%3E%3C/svg%3E");
+}
+.ncua-input.is-disabled .ncua-button-stepper--xs, .ncua-button-stepper--xs:disabled {
+  cursor: not-allowed;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6px' height='4px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23a4a5a8'/%3E%3C/svg%3E");
+}
+.ncua-button-stepper--sm {
+  width: 22px;
+  height: 14px;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.2px' height='4.7px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23757678'/%3E%3C/svg%3E");
+  background-size: 8.2px 4.7px;
+}
+.ncua-button-stepper--sm:hover:not(:disabled), .ncua-button-stepper--sm:focus:not(:disabled) {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.2px' height='4.7px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23171818'/%3E%3C/svg%3E");
+}
+.ncua-input:focus-within .ncua-button-stepper--sm {
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.2px' height='4.7px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%232f2f30'/%3E%3C/svg%3E");
+}
+.ncua-input.is-disabled .ncua-button-stepper--sm, .ncua-button-stepper--sm:disabled {
+  cursor: not-allowed;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8.2px' height='4.7px' viewBox='0 0 7 4' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.14645 0.146447C3.34171 -0.0488155 3.65829 -0.0488155 3.85355 0.146447L6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355C6.65829 4.04882 6.34171 4.04882 6.14645 3.85355L3.5 1.20711L0.853553 3.85355C0.658291 4.04882 0.341709 4.04882 0.146447 3.85355C-0.0488155 3.65829 -0.0488155 3.34171 0.146447 3.14645L3.14645 0.146447Z' fill='%23a4a5a8'/%3E%3C/svg%3E");
+}
+.ncua-button-stepper--down {
+  transform: rotate(180deg);
+}
+
 .ncua-checkbox-input {
   --check-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10 3L4.5 8.5L2 6' stroke='%23171818' stroke-width='1.6666' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
   --check-icon-disabled: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10 3L4.5 8.5L2 6' stroke='%23d3d4d8' stroke-width='1.6666' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
@@ -1317,6 +1373,16 @@ button {
 .ncua-input__field--sm {
   padding: 6px 12px;
 }
+.ncua-input__field:has(.ncua-input__stepper-button-group ~ .ncua-input__number) {
+  padding-top: 2px;
+  padding-bottom: 2px;
+  padding-left: 2px;
+}
+.ncua-input__field:has(.ncua-input__number ~ .ncua-input__stepper-button-group) {
+  padding-top: 2px;
+  padding-bottom: 2px;
+  padding-right: 2px;
+}
 .ncua-input__field {
   position: relative;
   flex: 1;
@@ -1449,16 +1515,6 @@ button {
 .ncua-input.is-disabled .ncua-input__field {
   overflow: hidden;
 }
-.ncua-input.is-disabled .ncua-input__field::after {
-  position: absolute;
-  top: 0;
-  left: 0;
-  content: "";
-  width: 100%;
-  height: 100%;
-  background: inherit;
-  opacity: 0.5;
-}
 .ncua-input.is-disabled input,
 .ncua-input.is-disabled textarea {
   color: var(--gray-300);
@@ -1473,6 +1529,31 @@ button {
 .ncua-input.full-width {
   width: 100%;
 }
+.ncua-input__number::-webkit-inner-spin-button, .ncua-input__number::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+.ncua-input__number {
+  -moz-appearance: textfield;
+  appearance: textfield;
+}
+.ncua-input__stepper-button-group {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.ncua-input__field--xs .ncua-input__stepper-button-group ~ .ncua-input__number {
+  padding-left: 10px;
+}
+.ncua-input__field--sm .ncua-input__stepper-button-group ~ .ncua-input__number {
+  padding-left: 12px;
+}
+.ncua-input__field--xs .ncua-input__icon-wrap + .ncua-input__stepper-button-group {
+  margin-left: 10px;
+}
+.ncua-input__field--sm .ncua-input__icon-wrap + .ncua-input__stepper-button-group {
+  margin-left: 12px;
+}
 
 .ncua-input__leading-text-wrap .ncua-input__leading-text {
   display: flex;
@@ -1782,12 +1863,14 @@ button {
   line-height: var(--line-heights-sm);
   color: var(--gray-700);
   word-break: break-all;
+  white-space: pre-line;
 }
 .ncua-modal__title .ncua-modal__title-subtitle {
   font-weight: var(--font-weights-commerce-sans-0);
   font-size: var(--font-size-xs);
   line-height: var(--line-heights-xs);
   color: var(--gray-400);
+  white-space: pre-line;
 }
 
 .ncua-modal__close-button {
@@ -2207,6 +2290,207 @@ button {
   }
 }
 
+.ncua-message-notification {
+  width: 100%;
+}
+.ncua-message-notification__container {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+  padding: 16px 24px;
+}
+@media (max-width: 768px) {
+  .ncua-message-notification__container {
+    padding: 16px;
+  }
+}
+.ncua-message-notification__content {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 24px;
+}
+@media (max-width: 768px) {
+  .ncua-message-notification__content {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 12px;
+  }
+}
+.ncua-message-notification__content-wrapper {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  min-width: 0;
+}
+.ncua-message-notification__icon {
+  flex-shrink: 0;
+}
+.ncua-message-notification__text-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+.ncua-message-notification__title {
+  font-size: var(--font-size-md);
+  line-height: var(--line-heights-md);
+  font-weight: var(--font-weights-commerce-sans-2);
+}
+.ncua-message-notification__supporting-text {
+  font-size: var(--font-size-sm);
+  line-height: var(--line-heights-sm);
+  font-weight: var(--font-weights-commerce-sans-0);
+}
+.ncua-message-notification__actions-container {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
+@media (max-width: 768px) {
+  .ncua-message-notification__actions-container {
+    width: 100%;
+    justify-content: flex-end;
+  }
+}
+.ncua-message-notification__actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.ncua-message-notification__footer-container {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  justify-content: flex-end;
+}
+.ncua-message-notification__hide-link {
+  text-decoration: underline;
+  cursor: pointer;
+  font-size: var(--font-size-xs);
+  line-height: var(--line-heights-xs);
+  font-weight: var(--font-weights-commerce-sans-0);
+}
+.ncua-message-notification__close-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  border-radius: 8px;
+  padding: 8px;
+  flex-shrink: 0;
+}
+.ncua-message-notification--neutral {
+  color: var(--gray-600);
+  background-color: var(--gray-50);
+  border-radius: 8px;
+  border: 1px solid var(--gray-300);
+  box-shadow: var(--shadow-lg);
+}
+.ncua-message-notification--neutral .ncua-message-notification__title {
+  color: var(--gray-600);
+}
+.ncua-message-notification--neutral .ncua-message-notification__supporting-text {
+  color: var(--gray-500);
+  opacity: 0.8;
+}
+.ncua-message-notification--neutral .ncua-notification__action-button {
+  color: var(--gray-500);
+}
+.ncua-message-notification--neutral .ncua-notification__action-button--text, .ncua-message-notification--neutral .ncua-notification__action-button--text-gray {
+  color: var(--gray-600);
+}
+.ncua-message-notification--neutral .ncua-message-notification__hide-link {
+  color: var(--gray-500);
+}
+.ncua-message-notification--error {
+  color: var(--primary-red-600);
+  background-color: var(--primary-red-50);
+  border-radius: 8px;
+  border: 1px solid var(--primary-red-300);
+  box-shadow: var(--shadow-lg);
+}
+.ncua-message-notification--error .ncua-message-notification__title {
+  color: var(--primary-red-600);
+}
+.ncua-message-notification--error .ncua-message-notification__supporting-text {
+  color: var(--gray-500);
+  opacity: 0.8;
+}
+.ncua-message-notification--error .ncua-notification__action-button {
+  color: var(--primary-red-500);
+}
+.ncua-message-notification--error .ncua-notification__action-button--text, .ncua-message-notification--error .ncua-notification__action-button--text-gray {
+  color: var(--primary-red-600);
+}
+.ncua-message-notification--error .ncua-message-notification__hide-link {
+  color: var(--gray-500);
+}
+.ncua-message-notification--warning {
+  color: var(--orange-600);
+  background-color: var(--orange-50);
+  border-radius: 8px;
+  border: 1px solid var(--orange-300);
+  box-shadow: var(--shadow-lg);
+}
+.ncua-message-notification--warning .ncua-message-notification__title {
+  color: var(--orange-600);
+}
+.ncua-message-notification--warning .ncua-message-notification__supporting-text {
+  color: var(--gray-500);
+  opacity: 0.8;
+}
+.ncua-message-notification--warning .ncua-notification__action-button {
+  color: var(--orange-500);
+}
+.ncua-message-notification--warning .ncua-notification__action-button--text, .ncua-message-notification--warning .ncua-notification__action-button--text-gray {
+  color: var(--orange-600);
+}
+.ncua-message-notification--warning .ncua-message-notification__hide-link {
+  color: var(--gray-500);
+}
+.ncua-message-notification--success {
+  color: var(--green-600);
+  background-color: var(--green-50);
+  border-radius: 8px;
+  border: 1px solid var(--green-300);
+  box-shadow: var(--shadow-lg);
+}
+.ncua-message-notification--success .ncua-message-notification__title {
+  color: var(--green-600);
+}
+.ncua-message-notification--success .ncua-message-notification__supporting-text {
+  color: var(--gray-500);
+  opacity: 0.8;
+}
+.ncua-message-notification--success .ncua-notification__action-button {
+  color: var(--green-500);
+}
+.ncua-message-notification--success .ncua-notification__action-button--text, .ncua-message-notification--success .ncua-notification__action-button--text-gray {
+  color: var(--green-600);
+}
+.ncua-message-notification--success .ncua-message-notification__hide-link {
+  color: var(--gray-500);
+}
+.ncua-message-notification .ncua-notification__action-button {
+  background: transparent;
+  border: none;
+  padding: 0;
+  vertical-align: middle;
+  font-size: var(--font-size-xs);
+  line-height: var(--line-heights-xs);
+  font-weight: var(--font-weights-commerce-sans-0);
+}
+.ncua-message-notification .ncua-notification__action-button--text, .ncua-message-notification .ncua-notification__action-button--text-gray {
+  font-weight: var(--font-weights-commerce-sans-1);
+}
+
 .ncua-radio-input {
   position: relative;
   flex: none;
@@ -4626,12 +4910,8 @@ button {
   bottom: 0;
   left: 0;
 }
-.ncua-horizontal-tab--button-primary .swiper-slide:first-child, .ncua-horizontal-tab--button-white .swiper-slide:first-child {
-  padding-left: 4px;
-}
-.ncua-horizontal-tab--button-primary .swiper-slide:last-child, .ncua-horizontal-tab--button-white .swiper-slide:last-child {
-  padding-right: 4px;
-  margin-right: 0;
+.ncua-horizontal-tab--button-primary .swiper-wrapper, .ncua-horizontal-tab--button-white .swiper-wrapper {
+  padding: 0 4px;
 }
 .ncua-horizontal-tab--button-primary .ncua-tab-button:hover, .ncua-horizontal-tab--button-primary .ncua-tab-button.is-active {
   background-color: var(--gray-50);
@@ -6042,7 +6322,7 @@ span.flatpickr-weekday {
   }
 }
 /**
- * Swiper 11.2.6
+ * Swiper 11.2.10
  * Most modern mobile touch slider and framework with hardware accelerated transitions
  * https://swiperjs.com
  *
@@ -6050,7 +6330,7 @@ span.flatpickr-weekday {
  *
  * Released under the MIT License
  *
- * Released on: March 19, 2025
+ * Released on: June 28, 2025
  */
 /* FONT_START */
 @font-face {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ncds/ui-admin",
-  "version": "1.4.1",
+  "version": "1.5.1",
   "description": "nhn-commerce의 어드민 디자인 시스템입니다.",
   "scripts": {
     "barrel": "node barrel.js",