sakana-element 2.4.2 → 2.5.0

package/dist/theme/Collapsible.css

@@ -0,0 +1 @@
+.px-collapsible[data-v-c7c25702]{--px-collapsible-border-color:var(--px-border-color);--px-collapsible-shadow-color:var(--px-shadow-color);--px-collapsible-bg-color:var(--px-fill-color-blank);--px-collapsible-text-color:var(--px-text-color-primary);--px-collapsible-trigger-hover-bg:var(--px-fill-color-light);--px-collapsible-font-size:var(--px-font-size-base);font-family:var(--px-font-family);filter:drop-shadow(var(--px-shadow-offset-x) var(--px-shadow-offset-y) 0px var(--px-collapsible-shadow-color));background:0 0;border:none;position:relative}.px-collapsible[data-v-c7c25702]:before{content:"";background:var(--px-collapsible-border-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:0}.px-collapsible[data-v-c7c25702]:after{content:"";background:var(--px-collapsible-bg-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:2px}.px-collapsible.is-disabled[data-v-c7c25702]{opacity:.6;pointer-events:none}.px-collapsible-trigger[data-v-c7c25702]{z-index:1;cursor:pointer;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);-webkit-user-select:none;user-select:none;outline:none;justify-content:space-between;align-items:center;padding:10px 16px;display:flex;position:relative}.px-collapsible-trigger[data-v-c7c25702]:after{content:"";z-index:-1;clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));background:0 0;position:absolute;inset:2px}.px-collapsible-trigger[data-v-c7c25702]:hover:after,.px-collapsible-trigger[data-v-c7c25702]:focus-visible:after{background-color:var(--px-collapsible-trigger-hover-bg)}.px-collapsible-trigger[data-disabled][data-v-c7c25702]{cursor:not-allowed;opacity:.6}.px-collapsible-content__wrapper[data-v-c7c25702]{overflow:hidden}.px-collapsible-content[data-v-c7c25702]{z-index:1;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);padding:0 16px 12px;position:relative}.px-collapsible-content[data-v-c7c25702]:before{content:"";background-image:repeating-linear-gradient(to right, var(--px-collapsible-border-color) 0px, var(--px-collapsible-border-color) 6px, transparent 6px, transparent 12px);height:2px;position:absolute;top:0;left:4px;right:4px}.px-collapsible.is-ghost[data-v-c7c25702]{filter:none}.px-collapsible.is-ghost[data-v-c7c25702]:before,.px-collapsible.is-ghost[data-v-c7c25702]:after,.px-collapsible.is-ghost .px-collapsible-content[data-v-c7c25702]:before{display:none}.px-collapsible--primary[data-v-c7c25702]{--px-collapsible-border-color:var(--px-color-primary-dark);--px-collapsible-shadow-color:var(--px-color-primary-dark);--px-collapsible-trigger-hover-bg:var(--px-color-primary-light-9)}.px-collapsible--success[data-v-c7c25702]{--px-collapsible-border-color:var(--px-color-success-dark);--px-collapsible-shadow-color:var(--px-color-success-dark);--px-collapsible-trigger-hover-bg:var(--px-color-success-light-9)}.px-collapsible--warning[data-v-c7c25702]{--px-collapsible-border-color:var(--px-color-warning-dark);--px-collapsible-shadow-color:var(--px-color-warning-dark);--px-collapsible-trigger-hover-bg:var(--px-color-warning-light-9)}.px-collapsible--info[data-v-c7c25702]{--px-collapsible-border-color:var(--px-color-info-dark);--px-collapsible-shadow-color:var(--px-color-info-dark);--px-collapsible-trigger-hover-bg:var(--px-color-info-light-9)}.px-collapsible--danger[data-v-c7c25702]{--px-collapsible-border-color:var(--px-color-danger-dark);--px-collapsible-shadow-color:var(--px-color-danger-dark);--px-collapsible-trigger-hover-bg:var(--px-color-danger-light-9)}.px-collapsible-slide-enter-active[data-v-c7c25702],.px-collapsible-slide-leave-active[data-v-c7c25702]{transition:none}.px-collapsible[data-v-963ff22c]{--px-collapsible-border-color:var(--px-border-color);--px-collapsible-shadow-color:var(--px-shadow-color);--px-collapsible-bg-color:var(--px-fill-color-blank);--px-collapsible-text-color:var(--px-text-color-primary);--px-collapsible-trigger-hover-bg:var(--px-fill-color-light);--px-collapsible-font-size:var(--px-font-size-base);font-family:var(--px-font-family);filter:drop-shadow(var(--px-shadow-offset-x) var(--px-shadow-offset-y) 0px var(--px-collapsible-shadow-color));background:0 0;border:none;position:relative}.px-collapsible[data-v-963ff22c]:before{content:"";background:var(--px-collapsible-border-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:0}.px-collapsible[data-v-963ff22c]:after{content:"";background:var(--px-collapsible-bg-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:2px}.px-collapsible.is-disabled[data-v-963ff22c]{opacity:.6;pointer-events:none}.px-collapsible-trigger[data-v-963ff22c]{z-index:1;cursor:pointer;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);-webkit-user-select:none;user-select:none;outline:none;justify-content:space-between;align-items:center;padding:10px 16px;display:flex;position:relative}.px-collapsible-trigger[data-v-963ff22c]:after{content:"";z-index:-1;clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));background:0 0;position:absolute;inset:2px}.px-collapsible-trigger[data-v-963ff22c]:hover:after,.px-collapsible-trigger[data-v-963ff22c]:focus-visible:after{background-color:var(--px-collapsible-trigger-hover-bg)}.px-collapsible-trigger[data-disabled][data-v-963ff22c]{cursor:not-allowed;opacity:.6}.px-collapsible-content__wrapper[data-v-963ff22c]{overflow:hidden}.px-collapsible-content[data-v-963ff22c]{z-index:1;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);padding:0 16px 12px;position:relative}.px-collapsible-content[data-v-963ff22c]:before{content:"";background-image:repeating-linear-gradient(to right, var(--px-collapsible-border-color) 0px, var(--px-collapsible-border-color) 6px, transparent 6px, transparent 12px);height:2px;position:absolute;top:0;left:4px;right:4px}.px-collapsible.is-ghost[data-v-963ff22c]{filter:none}.px-collapsible.is-ghost[data-v-963ff22c]:before,.px-collapsible.is-ghost[data-v-963ff22c]:after,.px-collapsible.is-ghost .px-collapsible-content[data-v-963ff22c]:before{display:none}.px-collapsible--primary[data-v-963ff22c]{--px-collapsible-border-color:var(--px-color-primary-dark);--px-collapsible-shadow-color:var(--px-color-primary-dark);--px-collapsible-trigger-hover-bg:var(--px-color-primary-light-9)}.px-collapsible--success[data-v-963ff22c]{--px-collapsible-border-color:var(--px-color-success-dark);--px-collapsible-shadow-color:var(--px-color-success-dark);--px-collapsible-trigger-hover-bg:var(--px-color-success-light-9)}.px-collapsible--warning[data-v-963ff22c]{--px-collapsible-border-color:var(--px-color-warning-dark);--px-collapsible-shadow-color:var(--px-color-warning-dark);--px-collapsible-trigger-hover-bg:var(--px-color-warning-light-9)}.px-collapsible--info[data-v-963ff22c]{--px-collapsible-border-color:var(--px-color-info-dark);--px-collapsible-shadow-color:var(--px-color-info-dark);--px-collapsible-trigger-hover-bg:var(--px-color-info-light-9)}.px-collapsible--danger[data-v-963ff22c]{--px-collapsible-border-color:var(--px-color-danger-dark);--px-collapsible-shadow-color:var(--px-color-danger-dark);--px-collapsible-trigger-hover-bg:var(--px-color-danger-light-9)}.px-collapsible-slide-enter-active[data-v-963ff22c],.px-collapsible-slide-leave-active[data-v-963ff22c]{transition:none}.px-collapsible[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-border-color);--px-collapsible-shadow-color:var(--px-shadow-color);--px-collapsible-bg-color:var(--px-fill-color-blank);--px-collapsible-text-color:var(--px-text-color-primary);--px-collapsible-trigger-hover-bg:var(--px-fill-color-light);--px-collapsible-font-size:var(--px-font-size-base);font-family:var(--px-font-family);filter:drop-shadow(var(--px-shadow-offset-x) var(--px-shadow-offset-y) 0px var(--px-collapsible-shadow-color));background:0 0;border:none;position:relative}.px-collapsible[data-v-5dceb2bc]:before{content:"";background:var(--px-collapsible-border-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:0}.px-collapsible[data-v-5dceb2bc]:after{content:"";background:var(--px-collapsible-bg-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));z-index:0;position:absolute;inset:2px}.px-collapsible.is-disabled[data-v-5dceb2bc]{opacity:.6;pointer-events:none}.px-collapsible-trigger[data-v-5dceb2bc]{z-index:1;cursor:pointer;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);-webkit-user-select:none;user-select:none;outline:none;justify-content:space-between;align-items:center;padding:10px 16px;display:flex;position:relative}.px-collapsible-trigger[data-v-5dceb2bc]:after{content:"";z-index:-1;clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));background:0 0;position:absolute;inset:2px}.px-collapsible-trigger[data-v-5dceb2bc]:hover:after,.px-collapsible-trigger[data-v-5dceb2bc]:focus-visible:after{background-color:var(--px-collapsible-trigger-hover-bg)}.px-collapsible-trigger[data-disabled][data-v-5dceb2bc]{cursor:not-allowed;opacity:.6}.px-collapsible-content__wrapper[data-v-5dceb2bc]{overflow:hidden}.px-collapsible-content[data-v-5dceb2bc]{z-index:1;font-size:var(--px-collapsible-font-size);font-family:var(--px-font-family);color:var(--px-collapsible-text-color);padding:0 16px 12px;position:relative}.px-collapsible-content[data-v-5dceb2bc]:before{content:"";background-image:repeating-linear-gradient(to right, var(--px-collapsible-border-color) 0px, var(--px-collapsible-border-color) 6px, transparent 6px, transparent 12px);height:2px;position:absolute;top:0;left:4px;right:4px}.px-collapsible.is-ghost[data-v-5dceb2bc]{filter:none}.px-collapsible.is-ghost[data-v-5dceb2bc]:before,.px-collapsible.is-ghost[data-v-5dceb2bc]:after,.px-collapsible.is-ghost .px-collapsible-content[data-v-5dceb2bc]:before{display:none}.px-collapsible--primary[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-color-primary-dark);--px-collapsible-shadow-color:var(--px-color-primary-dark);--px-collapsible-trigger-hover-bg:var(--px-color-primary-light-9)}.px-collapsible--success[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-color-success-dark);--px-collapsible-shadow-color:var(--px-color-success-dark);--px-collapsible-trigger-hover-bg:var(--px-color-success-light-9)}.px-collapsible--warning[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-color-warning-dark);--px-collapsible-shadow-color:var(--px-color-warning-dark);--px-collapsible-trigger-hover-bg:var(--px-color-warning-light-9)}.px-collapsible--info[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-color-info-dark);--px-collapsible-shadow-color:var(--px-color-info-dark);--px-collapsible-trigger-hover-bg:var(--px-color-info-light-9)}.px-collapsible--danger[data-v-5dceb2bc]{--px-collapsible-border-color:var(--px-color-danger-dark);--px-collapsible-shadow-color:var(--px-color-danger-dark);--px-collapsible-trigger-hover-bg:var(--px-color-danger-light-9)}.px-collapsible-slide-enter-active[data-v-5dceb2bc],.px-collapsible-slide-leave-active[data-v-5dceb2bc]{transition:none}

package/dist/theme/Command.css

@@ -0,0 +1 @@
+.px-command{--px-command-highlight-bg-color:var(--px-color-primary-light-9);--px-command-highlight-text-color:var(--px-text-color-primary);--px-command-highlight-icon-color:var(--px-color-primary);width:100%;font-family:var(--px-font-family);background:0 0;flex-direction:column;display:flex;position:relative;overflow:hidden}.px-command:before{content:"";background:var(--px-border-color);clip-path:polygon(0 2px,2px 2px,2px 0,calc(100% - 2px) 0,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,2px 100%,2px calc(100% - 2px),0 calc(100% - 2px));z-index:0;position:absolute;inset:0}.px-command:after{content:"";background:var(--px-bg-color-overlay);z-index:0;position:absolute;inset:2px}.px-command{filter:drop-shadow(3px 3px 0px var(--px-border-color))}.px-command-input{border-bottom:2px dashed var(--px-border-color);z-index:1;align-items:center;gap:8px;padding:10px 12px;display:flex;position:relative}.px-command-input__icon{color:var(--px-text-color-placeholder);flex-shrink:0}.px-command-input__input{font-family:var(--px-font-family);font-size:var(--px-font-size-base);color:var(--px-text-color-primary);background:0 0;border:none;outline:none;flex:1;padding:0;line-height:1.5}.px-command-input__input::placeholder{color:var(--px-text-color-placeholder)}.px-command-list{z-index:1;padding:4px 2px;position:relative;overflow-y:auto}.px-command-list::-webkit-scrollbar{width:6px}.px-command-list::-webkit-scrollbar-track{background:var(--px-bg-color-page)}.px-command-list::-webkit-scrollbar-thumb{background:var(--px-border-color)}.px-command-item{cursor:pointer;font-size:var(--px-font-size-base);color:var(--px-text-color-primary);-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:8px 12px;transition:none;display:flex;position:relative}.px-command-item.is-highlighted{background:var(--px-command-highlight-bg-color);color:var(--px-command-highlight-text-color)}.px-command-item.is-highlighted:before{content:"▶";color:var(--px-command-highlight-icon-color);font-size:8px;position:absolute;left:2px}.px-command-item.is-disabled{opacity:.45;cursor:not-allowed}.px-command-item.is-hidden{display:none}.px-command-item__icon{flex-shrink:0;align-items:center;display:inline-flex}.px-command-item__label{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.px-command-item__shortcut{flex-shrink:0;gap:4px;margin-left:auto;display:flex}.px-command-item__shortcut kbd{min-width:20px;height:20px;font-family:var(--px-font-family);background:var(--px-bg-color-page);border:1px solid var(--px-border-color);color:var(--px-text-color-secondary);justify-content:center;align-items:center;padding:0 4px;font-size:10px;display:inline-flex}.px-command-group.is-hidden{display:none}.px-command-group__heading{font-size:var(--px-font-size-extra-small);color:var(--px-text-color-secondary);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px dashed var(--px-border-color-light);padding:8px 12px 4px;font-weight:600}.px-command-separator{background:var(--px-border-color-light);background-image:repeating-linear-gradient(90deg, var(--px-border-color) 0px, var(--px-border-color) 4px, transparent 4px, transparent 8px);height:2px;margin:4px 8px}.px-command-empty{text-align:center;font-size:var(--px-font-size-base);color:var(--px-text-color-placeholder);padding:24px 12px}.px-command-empty.is-hidden{display:none}.px-command-dialog{justify-content:center;align-items:flex-start;padding-top:15vh;display:flex;position:fixed;inset:0}.px-command-dialog__overlay{background:#00000080;position:fixed;inset:0}.px-command-dialog__content{z-index:1;width:90%;max-width:520px;position:relative}.px-command-dialog__content .px-command{filter:drop-shadow(4px 4px #0000004d)}html.dark .px-command,.px-dark .px-command{--px-command-highlight-text-color:var(--px-color-white);--px-command-highlight-icon-color:var(--px-color-primary-light-3)}

package/dist/theme/Diff.css

@@ -1,110 +1 @@
-/* Diff Variables */
-.px-diff {
-  --px-diff-handle-color: var(--px-text-color-primary);
-  --px-diff-handle-bg: var(--px-fill-color-blank);
-}
-/* Base Diff Container */
-.px-diff {
-  position: relative;
-  overflow: hidden;
-  display: inline-block;
-  width: 100%;
-  user-select: none;
-  -webkit-user-select: none;
-  touch-action: none;
-  font-size: 0;
-  line-height: 0;
-  box-sizing: border-box;
-}
-/* After panel flows normally — establishes container height */
-.px-diff__after {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  z-index: 1;
-}
-/* Before panel overlays — clipped to show left side */
-.px-diff__before {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 2;
-}
-/* Images fill the container */
-.px-diff__img {
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-.px-diff__canvas {
-  display: block;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  image-rendering: pixelated;
-}
-/* Handle — centers the grip vertically */
-.px-diff__handle {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  z-index: 3;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transform: translateX(-50%);
-  outline: none;
-  pointer-events: none;
-}
-/* Vertical divider line */
-.px-diff__handle::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 50%;
-    width: 2px;
-    transform: translateX(-50%);
-    background: var(--px-diff-handle-bg);
-    box-shadow: 0 0 4px rgba(0, 0, 0, 0.12);
-    pointer-events: none;
-}
-/* Grip button — circular pill shape (daisyUI-style) */
-.px-diff__handle-grip {
-  width: 20px;
-  height: 32px;
-  border-radius: 10px;
-  background: var(--px-diff-handle-bg);
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
-  cursor: ew-resize;
-  pointer-events: auto;
-  flex-shrink: 0;
-}
-/* Focus ring */
-.px-diff__handle:focus-visible .px-diff__handle-grip {
-  box-shadow: 0 0 0 2px var(--px-diff-handle-color), 0 1px 4px rgba(0, 0, 0, 0.18);
-}
-/* Color variants */
-.px-diff--primary {
-    --px-diff-handle-color: var(--px-color-primary);
-}
-.px-diff--success {
-    --px-diff-handle-color: var(--px-color-success);
-}
-.px-diff--warning {
-    --px-diff-handle-color: var(--px-color-warning);
-}
-.px-diff--info {
-    --px-diff-handle-color: var(--px-color-info);
-}
-.px-diff--danger {
-    --px-diff-handle-color: var(--px-color-danger);
-}
-/* Dark mode */
-html.dark .px-diff,
-.px-dark .px-diff {
-  --px-diff-handle-bg: var(--px-fill-color-light);
-}
+.px-diff{--px-diff-handle-color:var(--px-text-color-primary);--px-diff-handle-bg:var(--px-fill-color-blank);-webkit-user-select:none;user-select:none;touch-action:none;box-sizing:border-box;width:100%;font-size:0;line-height:0;display:inline-block;position:relative;overflow:hidden}.px-diff__after{z-index:1;width:100%;height:100%;position:relative}.px-diff__before{z-index:2;width:100%;height:100%;position:absolute;top:0;left:0}.px-diff__img{object-fit:cover;width:100%;height:100%;display:block}.px-diff__canvas{object-fit:cover;width:100%;height:100%;image-rendering:pixelated;display:block}.px-diff__handle{z-index:3;pointer-events:none;outline:none;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;transform:translate(-50%)}.px-diff__handle:before{content:"";background:var(--px-diff-handle-bg);pointer-events:none;width:2px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 0 4px #0000001f}.px-diff__handle-grip{background:var(--px-diff-handle-bg);cursor:ew-resize;pointer-events:auto;border-radius:10px;flex-shrink:0;width:20px;height:32px;box-shadow:0 1px 4px #0000002e}.px-diff__handle:focus-visible .px-diff__handle-grip{box-shadow:0 0 0 2px var(--px-diff-handle-color), 0 1px 4px #0000002e}.px-diff--primary{--px-diff-handle-color:var(--px-color-primary)}.px-diff--success{--px-diff-handle-color:var(--px-color-success)}.px-diff--warning{--px-diff-handle-color:var(--px-color-warning)}.px-diff--info{--px-diff-handle-color:var(--px-color-info)}.px-diff--danger{--px-diff-handle-color:var(--px-color-danger)}html.dark .px-diff,.px-dark .px-diff{--px-diff-handle-bg:var(--px-fill-color-light)}

package/dist/theme/Divider.css

@@ -1,150 +1 @@
-/* Divider Variables */
-.px-divider {
-  --px-divider-line-color: var(--px-border-color);
-  --px-divider-text-color: var(--px-text-color-regular);
-}
-/* Base Divider – Horizontal */
-.px-divider {
-  display: flex;
-  align-items: center;
-  margin: 16px 0;
-  font-family: var(--px-font-family);
-  font-size: var(--px-font-size-small);
-  color: var(--px-divider-text-color);
-}
-.px-divider::before,
-  .px-divider::after {
-    content: "";
-    flex: 1;
-    height: 2px;
-    /* Pixel-textured line: 2px on / 2px off */
-    background: repeating-linear-gradient(
-      to right,
-      var(--px-divider-line-color) 0px,
-      var(--px-divider-line-color) 2px,
-      transparent 2px,
-      transparent 4px
-    );
-}
-/* Vertical mode */
-.px-divider.is-vertical {
-    display: inline-flex;
-    flex-direction: column;
-    height: 1em;
-    margin: 0 8px;
-    vertical-align: middle;
-}
-.px-divider.is-vertical::before,
-    .px-divider.is-vertical::after {
-      flex: 1;
-      width: 2px;
-      height: auto;
-      /* Vertical pixel-textured line */
-      background: repeating-linear-gradient(
-        to bottom,
-        var(--px-divider-line-color) 0px,
-        var(--px-divider-line-color) 2px,
-        transparent 2px,
-        transparent 4px
-      );
-}
-/* Content text – pixel-art badge styling */
-.px-divider__text {
-  position: relative;
-  padding: 2px 12px;
-  white-space: nowrap;
-  line-height: 1;
-}
-/* Pixel-corner border behind text */
-.px-divider__text::before {
-    content: "";
-    position: absolute;
-    inset: 0;
-    background: var(--px-divider-line-color);
-    opacity: 0.15;
-    clip-path: polygon(
-      0 2px,
-      2px 2px,
-      2px 0,
-      calc(100% - 2px) 0,
-      calc(100% - 2px) 2px,
-      100% 2px,
-      100% calc(100% - 2px),
-      calc(100% - 2px) calc(100% - 2px),
-      calc(100% - 2px) 100%,
-      2px 100%,
-      2px calc(100% - 2px),
-      0 calc(100% - 2px)
-    );
-    z-index: -1;
-}
-/* Content position */
-.px-divider--left::before {
-    flex: 0 0 5%;
-}
-.px-divider--right::after {
-    flex: 0 0 5%;
-}
-/* Border style – dashed (pixel pattern) */
-.px-divider--dashed::before,
-  .px-divider--dashed::after {
-    background: repeating-linear-gradient(
-      to right,
-      var(--px-divider-line-color) 0px,
-      var(--px-divider-line-color) 6px,
-      transparent 6px,
-      transparent 12px
-    );
-}
-.px-divider--dashed.is-vertical::before,
-    .px-divider--dashed.is-vertical::after {
-      background: repeating-linear-gradient(
-        to bottom,
-        var(--px-divider-line-color) 0px,
-        var(--px-divider-line-color) 6px,
-        transparent 6px,
-        transparent 12px
-      );
-}
-/* Border style – dotted (pixel pattern) */
-.px-divider--dotted::before,
-  .px-divider--dotted::after {
-    background: repeating-linear-gradient(
-      to right,
-      var(--px-divider-line-color) 0px,
-      var(--px-divider-line-color) 2px,
-      transparent 2px,
-      transparent 6px
-    );
-}
-.px-divider--dotted.is-vertical::before,
-    .px-divider--dotted.is-vertical::after {
-      background: repeating-linear-gradient(
-        to bottom,
-        var(--px-divider-line-color) 0px,
-        var(--px-divider-line-color) 2px,
-        transparent 2px,
-        transparent 6px
-      );
-}
-/* Type variants */
-.px-divider--primary {
-    --px-divider-line-color: var(--px-color-primary);
-    --px-divider-text-color: var(--px-color-primary);
-}
-.px-divider--success {
-    --px-divider-line-color: var(--px-color-success);
-    --px-divider-text-color: var(--px-color-success);
-}
-.px-divider--info {
-    --px-divider-line-color: var(--px-color-info);
-    --px-divider-text-color: var(--px-color-info);
-}
-.px-divider--warning {
-    --px-divider-line-color: var(--px-color-warning);
-    --px-divider-text-color: var(--px-color-warning);
-}
-.px-divider--danger {
-    --px-divider-line-color: var(--px-color-danger);
-    --px-divider-text-color: var(--px-color-danger);
-}
+.px-divider{--px-divider-line-color:var(--px-border-color);--px-divider-text-color:var(--px-text-color-regular);font-family:var(--px-font-family);font-size:var(--px-font-size-small);color:var(--px-divider-text-color);align-items:center;margin:16px 0;display:flex}.px-divider:before,.px-divider:after{content:"";background:repeating-linear-gradient(to right, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 2px, transparent 2px, transparent 4px);flex:1;height:2px}.px-divider.is-vertical{vertical-align:middle;flex-direction:column;height:1em;margin:0 8px;display:inline-flex}.px-divider.is-vertical:before,.px-divider.is-vertical:after{background:repeating-linear-gradient(to bottom, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 2px, transparent 2px, transparent 4px);flex:1;width:2px;height:auto}.px-divider__text{white-space:nowrap;padding:2px 12px;line-height:1;position:relative}.px-divider__text:before{content:"";background:var(--px-divider-line-color);opacity:.15;clip-path:polygon(0 2px,2px 2px,2px 0,calc(100% - 2px) 0,calc(100% - 2px) 2px,100% 2px,100% calc(100% - 2px),calc(100% - 2px) calc(100% - 2px),calc(100% - 2px) 100%,2px 100%,2px calc(100% - 2px),0 calc(100% - 2px));z-index:-1;position:absolute;inset:0}.px-divider--left:before,.px-divider--right:after{flex:0 0 5%}.px-divider--dashed:before,.px-divider--dashed:after{background:repeating-linear-gradient(to right, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 6px, transparent 6px, transparent 12px)}.px-divider--dashed.is-vertical:before,.px-divider--dashed.is-vertical:after{background:repeating-linear-gradient(to bottom, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 6px, transparent 6px, transparent 12px)}.px-divider--dotted:before,.px-divider--dotted:after{background:repeating-linear-gradient(to right, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 2px, transparent 2px, transparent 6px)}.px-divider--dotted.is-vertical:before,.px-divider--dotted.is-vertical:after{background:repeating-linear-gradient(to bottom, var(--px-divider-line-color) 0px, var(--px-divider-line-color) 2px, transparent 2px, transparent 6px)}.px-divider--primary{--px-divider-line-color:var(--px-color-primary);--px-divider-text-color:var(--px-color-primary)}.px-divider--success{--px-divider-line-color:var(--px-color-success);--px-divider-text-color:var(--px-color-success)}.px-divider--info{--px-divider-line-color:var(--px-color-info);--px-divider-text-color:var(--px-color-info)}.px-divider--warning{--px-divider-line-color:var(--px-color-warning);--px-divider-text-color:var(--px-color-warning)}.px-divider--danger{--px-divider-line-color:var(--px-color-danger);--px-divider-text-color:var(--px-color-danger)}

package/dist/theme/Drawer.css

@@ -1,206 +1 @@
-/* Drawer Variables */
-.px-drawer[data-v-647267d6] {
-  position: relative;
-  display: block;
-}
-.px-drawer__content[data-v-647267d6] {
-  position: relative;
-  z-index: 0;
-}
-/* Overlay backdrop */
-.px-drawer-overlay[data-v-647267d6] {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.45);
-}
-/* Sidebar panel — pixel-art style
-   Variables defined here (not on .px-drawer) because
-   <Teleport to="body"> moves this node out of .px-drawer
-   in the DOM, breaking CSS custom-property inheritance. */
-.px-drawer__sidebar[data-v-647267d6] {
-  --px-drawer-bg-color: var(--px-bg-color);
-  --px-drawer-border-color: var(--px-border-color);
-  --px-drawer-shadow-color: var(--px-shadow-color);
-  --px-drawer-text-color: var(--px-text-color-primary);
-  --px-drawer-header-border-color: var(--px-border-color-light);
-  --px-drawer-padding: 16px;
-  --px-drawer-inset-highlight: inset 2px 2px 0 0 rgba(255, 255, 255, 0.35);
-  --px-drawer-inset-shadow: inset -2px -2px 0 0 rgba(0, 0, 0, 0.08);
-
-  position: fixed;
-  top: 0;
-  bottom: 0;
-  background: transparent;
-  color: var(--px-drawer-text-color);
-  font-family: var(--px-font-family);
-  font-size: var(--px-font-size-base);
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-  box-sizing: border-box;
-
-  /* Pixel shadow */
-  filter: drop-shadow(
-    var(--px-shadow-offset-x) var(--px-shadow-offset-y) 0px var(--px-drawer-shadow-color)
-  );
-}
-/* Left placement — inner edge is the right side */
-.px-drawer__sidebar--left[data-v-647267d6] {
-  left: 0;
-}
-/* Border layer — staircase only on right (inner) edge */
-.px-drawer__sidebar--left[data-v-647267d6]::before {
-    content: '';
-    position: absolute;
-    inset: 0;
-    background: var(--px-drawer-border-color);
-    clip-path: polygon(
-      0 0,
-      calc(100% - 8px) 0,
-      calc(100% - 8px) 2px,
-      calc(100% - 4px) 2px,
-      calc(100% - 4px) 4px,
-      calc(100% - 2px) 4px,
-      calc(100% - 2px) 8px,
-      100% 8px,
-      100% calc(100% - 8px),
-      calc(100% - 2px) calc(100% - 8px),
-      calc(100% - 2px) calc(100% - 4px),
-      calc(100% - 4px) calc(100% - 4px),
-      calc(100% - 4px) calc(100% - 2px),
-      calc(100% - 8px) calc(100% - 2px),
-      calc(100% - 8px) 100%,
-      0 100%
-    );
-    z-index: 0;
-}
-/* Fill layer — inset with bevel */
-.px-drawer__sidebar--left[data-v-647267d6]::after {
-    content: '';
-    position: absolute;
-    top: 4px;
-    left: 0;
-    right: 4px;
-    bottom: 4px;
-    background: var(--px-drawer-bg-color);
-    clip-path: polygon(
-      0 0,
-      calc(100% - 4px) 0,
-      calc(100% - 4px) 2px,
-      calc(100% - 2px) 2px,
-      calc(100% - 2px) 4px,
-      100% 4px,
-      100% calc(100% - 4px),
-      calc(100% - 2px) calc(100% - 4px),
-      calc(100% - 2px) calc(100% - 2px),
-      calc(100% - 4px) calc(100% - 2px),
-      calc(100% - 4px) 100%,
-      0 100%
-    );
-    box-shadow: var(--px-drawer-inset-highlight), var(--px-drawer-inset-shadow);
-    z-index: 0;
-}
-/* Right placement — inner edge is the left side */
-.px-drawer__sidebar--right[data-v-647267d6] {
-  right: 0;
-}
-/* Border layer — staircase only on left (inner) edge */
-.px-drawer__sidebar--right[data-v-647267d6]::before {
-    content: '';
-    position: absolute;
-    inset: 0;
-    background: var(--px-drawer-border-color);
-    clip-path: polygon(
-      0 8px,
-      2px 8px,
-      2px 4px,
-      4px 4px,
-      4px 2px,
-      8px 2px,
-      8px 0,
-      100% 0,
-      100% 100%,
-      8px 100%,
-      8px calc(100% - 2px),
-      4px calc(100% - 2px),
-      4px calc(100% - 4px),
-      2px calc(100% - 4px),
-      2px calc(100% - 8px),
-      0 calc(100% - 8px)
-    );
-    z-index: 0;
-}
-/* Fill layer — inset with bevel */
-.px-drawer__sidebar--right[data-v-647267d6]::after {
-    content: '';
-    position: absolute;
-    top: 4px;
-    left: 4px;
-    right: 0;
-    bottom: 4px;
-    background: var(--px-drawer-bg-color);
-    clip-path: polygon(
-      0 4px,
-      2px 4px,
-      2px 2px,
-      4px 2px,
-      4px 0,
-      100% 0,
-      100% 100%,
-      4px 100%,
-      4px calc(100% - 2px),
-      2px calc(100% - 2px),
-      2px calc(100% - 4px),
-      0 calc(100% - 4px)
-    );
-    box-shadow: var(--px-drawer-inset-highlight), var(--px-drawer-inset-shadow);
-    z-index: 0;
-}
-/* Header with pixel-dashed divider */
-.px-drawer__header[data-v-647267d6] {
-  position: relative;
-  z-index: 1;
-  padding: var(--px-drawer-padding);
-  font-weight: 600;
-}
-.px-drawer__header[data-v-647267d6]::after {
-    content: "";
-    position: absolute;
-    bottom: 0;
-    left: 4px;
-    right: 4px;
-    height: 2px;
-    background-image: repeating-linear-gradient(
-      to right,
-      var(--px-drawer-header-border-color) 0px,
-      var(--px-drawer-header-border-color) 6px,
-      transparent 6px,
-      transparent 12px
-    );
-}
-.px-drawer__body[data-v-647267d6] {
-  position: relative;
-  z-index: 1;
-  padding: var(--px-drawer-padding);
-  flex: 1;
-  overflow-y: auto;
-}
-/* Slide transitions — pixel-feel with steps(12)
-   steps(4) was too coarse (75 px jumps for a 300 px drawer).
-   steps(12) gives ~25 px jumps — still visibly discrete but not jarring. */
-.px-drawer-slide-left-enter-active[data-v-647267d6],
-.px-drawer-slide-left-leave-active[data-v-647267d6] {
-  transition: transform 0.25s steps(12);
-}
-.px-drawer-slide-left-enter-from[data-v-647267d6],
-.px-drawer-slide-left-leave-to[data-v-647267d6] {
-  transform: translateX(-100%);
-}
-.px-drawer-slide-right-enter-active[data-v-647267d6],
-.px-drawer-slide-right-leave-active[data-v-647267d6] {
-  transition: transform 0.25s steps(12);
-}
-.px-drawer-slide-right-enter-from[data-v-647267d6],
-.px-drawer-slide-right-leave-to[data-v-647267d6] {
-  transform: translateX(100%);
-}
+.px-drawer[data-v-647267d6]{display:block;position:relative}.px-drawer__content[data-v-647267d6]{z-index:0;position:relative}.px-drawer-overlay[data-v-647267d6]{background:#00000073;position:fixed;inset:0}.px-drawer__sidebar[data-v-647267d6]{--px-drawer-bg-color:var(--px-bg-color);--px-drawer-border-color:var(--px-border-color);--px-drawer-shadow-color:var(--px-shadow-color);--px-drawer-text-color:var(--px-text-color-primary);--px-drawer-header-border-color:var(--px-border-color-light);--px-drawer-padding:16px;--px-drawer-inset-highlight:inset 2px 2px 0 0 #ffffff59;--px-drawer-inset-shadow:inset -2px -2px 0 0 #00000014;color:var(--px-drawer-text-color);font-family:var(--px-font-family);font-size:var(--px-font-size-base);box-sizing:border-box;filter:drop-shadow(var(--px-shadow-offset-x) var(--px-shadow-offset-y) 0px var(--px-drawer-shadow-color));background:0 0;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;overflow:hidden}.px-drawer__sidebar--left[data-v-647267d6]{left:0}.px-drawer__sidebar--left[data-v-647267d6]:before{content:"";background:var(--px-drawer-border-color);clip-path:polygon(0 0,calc(100% - 8px) 0,calc(100% - 8px) 2px,calc(100% - 4px) 2px,calc(100% - 4px) 4px,calc(100% - 2px) 4px,calc(100% - 2px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 2px) calc(100% - 8px),calc(100% - 2px) calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) calc(100% - 2px),calc(100% - 8px) calc(100% - 2px),calc(100% - 8px) 100%,0 100%);z-index:0;position:absolute;inset:0}.px-drawer__sidebar--left[data-v-647267d6]:after{content:"";background:var(--px-drawer-bg-color);clip-path:polygon(0 0,calc(100% - 4px) 0,calc(100% - 4px) 2px,calc(100% - 2px) 2px,calc(100% - 2px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 2px) calc(100% - 4px),calc(100% - 2px) calc(100% - 2px),calc(100% - 4px) calc(100% - 2px),calc(100% - 4px) 100%,0 100%);box-shadow:var(--px-drawer-inset-highlight), var(--px-drawer-inset-shadow);z-index:0;position:absolute;inset:4px 4px 4px 0}.px-drawer__sidebar--right[data-v-647267d6]{right:0}.px-drawer__sidebar--right[data-v-647267d6]:before{content:"";background:var(--px-drawer-border-color);clip-path:polygon(0 8px,2px 8px,2px 4px,4px 4px,4px 2px,8px 2px,8px 0,100% 0,100% 100%,8px 100%,8px calc(100% - 2px),4px calc(100% - 2px),4px calc(100% - 4px),2px calc(100% - 4px),2px calc(100% - 8px),0 calc(100% - 8px));z-index:0;position:absolute;inset:0}.px-drawer__sidebar--right[data-v-647267d6]:after{content:"";background:var(--px-drawer-bg-color);clip-path:polygon(0 4px,2px 4px,2px 2px,4px 2px,4px 0,100% 0,100% 100%,4px 100%,4px calc(100% - 2px),2px calc(100% - 2px),2px calc(100% - 4px),0 calc(100% - 4px));box-shadow:var(--px-drawer-inset-highlight), var(--px-drawer-inset-shadow);z-index:0;position:absolute;inset:4px 0 4px 4px}.px-drawer__header[data-v-647267d6]{z-index:1;padding:var(--px-drawer-padding);font-weight:600;position:relative}.px-drawer__header[data-v-647267d6]:after{content:"";background-image:repeating-linear-gradient(to right, var(--px-drawer-header-border-color) 0px, var(--px-drawer-header-border-color) 6px, transparent 6px, transparent 12px);height:2px;position:absolute;bottom:0;left:4px;right:4px}.px-drawer__body[data-v-647267d6]{z-index:1;padding:var(--px-drawer-padding);flex:1;position:relative;overflow-y:auto}.px-drawer-slide-left-enter-active[data-v-647267d6],.px-drawer-slide-left-leave-active[data-v-647267d6]{transition:transform .25s steps(12,end)}.px-drawer-slide-left-enter-from[data-v-647267d6],.px-drawer-slide-left-leave-to[data-v-647267d6]{transform:translate(-100%)}.px-drawer-slide-right-enter-active[data-v-647267d6],.px-drawer-slide-right-leave-active[data-v-647267d6]{transition:transform .25s steps(12,end)}.px-drawer-slide-right-enter-from[data-v-647267d6],.px-drawer-slide-right-leave-to[data-v-647267d6]{transform:translate(100%)}