@pantograph/styles 0.0.7 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/input.css CHANGED
@@ -1 +1 @@
1
- .pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover){padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}
1
+ .pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover),.pc_input:not(.pc_input--simple).pc_input--steps[data-disabled=true]{padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input .pc_input__input:disabled{cursor:not-allowed}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}
package/dist/input.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover){padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}\n";
2
+ const cssText = ".pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover),.pc_input:not(.pc_input--simple).pc_input--steps[data-disabled=true]{padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input .pc_input__input:disabled{cursor:not-allowed}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}\n";
3
3
  const inputId = `${prefix}s-input`;
4
4
  const addInputCss = () => addCssToHead(inputId, cssText);
5
5
  const removeInputCss = () => removeCssFromHead(inputId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover){padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}\n";
4
+ const cssText = ".pc_input{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);overflow:hidden;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0;color:var(--ptc-input-fg);background:var(--ptc-input-bg)}.pc_input .pc_input__number_steps{grid-template-rows:repeat(2,minmax(0,1fr));display:none;height:100%}.pc_input .pc_input__number_steps .pc_input__number_steps__down,.pc_input .pc_input__number_steps .pc_input__number_steps__up{display:flex;justify-content:center;border-width:var(--pt-stroke-0, 0px);outline:0}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]),.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]){cursor:pointer;--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));width:var(--ptc-input-step-w);min-width:var(--ptc-input-step-w);max-width:var(--ptc-input-step-w)}.pc_input .pc_input__number_steps .pc_input__number_steps__down:not([data-disabled=true]):hover,.pc_input .pc_input__number_steps .pc_input__number_steps__up:not([data-disabled=true]):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down[data-disabled=true],.pc_input .pc_input__number_steps .pc_input__number_steps__up[data-disabled=true]{cursor:not-allowed;--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_input .pc_input__number_steps .pc_input__number_steps__down{align-items:flex-start}.pc_input .pc_input__number_steps .pc_input__number_steps__up{align-items:flex-end}.pc_input.pc_input--sm{--ptc-input-h: var(--pt-dimension-1200);--ptc-input-roundness: var(--pt-roundness-sm);--ptc-input-px: var(--pt-dimension-200);--ptc-input-step-w: var(--pt-dimension-1000)}.pc_input.pc_input--sm .pc_input__input{height:var(--pt-dimension-700, 14px);min-height:var(--pt-dimension-700, 14px);max-height:var(--pt-dimension-700, 14px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--sm .pc_input__leading,.pc_input.pc_input--sm .pc_input__trailing{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-500, 10px);line-height:var(--pt-lineheight-8, 12px);letter-spacing:0}.pc_input.pc_input--md{--ptc-input-h: var(--pt-dimension-1600);--ptc-input-roundness: var(--pt-roundness-md);--ptc-input-px: var(--pt-dimension-300);--ptc-input-step-w: var(--pt-dimension-1200)}.pc_input.pc_input--md .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--md .pc_input__leading,.pc_input.pc_input--md .pc_input__trailing{height:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input.pc_input--lg{--ptc-input-h: var(--pt-dimension-2000);--ptc-input-px: var(--pt-dimension-400);--ptc-input-roundness: var(--pt-roundness-lg);--ptc-input-step-w: var(--pt-dimension-1600)}.pc_input.pc_input--lg .pc_input__input{height:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_input.pc_input--lg .pc_input__leading,.pc_input.pc_input--lg .pc_input__trailing{height:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_input:not(.pc_input--simple){border-start-start-radius:var(--ptc-input-group-ss-radius, var(--ptc-input-roundness));border-start-end-radius:var(--ptc-input-group-se-radius, var(--ptc-input-roundness));border-end-start-radius:var(--ptc-input-group-es-radius, var(--ptc-input-roundness));border-end-end-radius:var(--ptc-input-group-ee-radius, var(--ptc-input-roundness));height:var(--ptc-input-h);min-height:var(--ptc-input-h);max-height:var(--ptc-input-h);padding-inline-start:var(--ptc-input-px)}.pc_input:not(.pc_input--simple):not(.pc_input--steps),.pc_input:not(.pc_input--simple).pc_input--steps:not(:hover),.pc_input:not(.pc_input--simple).pc_input--steps[data-disabled=true]{padding-inline-end:var(--ptc-input-px)}.pc_input:not(.pc_input--content-fit):not(.pc_input_group__item){width:100%}.pc_input.pc_input--content-fit .pc_input__input{field-sizing:content}.pc_input .pc_input__input{outline:0}.pc_input .pc_input__input:disabled{cursor:not-allowed}.pc_input:not(:disabled):not([data-disabled=true]){--ptc-input-bg: rgba(var(--pt-bg));--ptc-input-trailing: rgba(var(--pt-fg-subtle));--ptc-input-placeholder: rgba(var(--pt-gray-5))}.pc_input:not(:disabled):not([data-disabled=true]):not(:hover){--ptc-input-fg: rgba(var(--pt-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover{--ptc-input-fg: rgba(var(--pt-fg-target))}.pc_input:not(:disabled):not([data-disabled=true]):focus,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input:not(:disabled):not([data-disabled=true]):focus-visible{--ptu-shadow:0 0 0 var(--pt-stroke-30) var(--ptu-shadow-color, var(--pt-shadow-color, rgba(var(--pt-focus-br))));box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}.pc_input:disabled,.pc_input[data-disabled=true]{cursor:not-allowed;--ptc-input-bg: rgba(var(--pt-gray-05));--ptc-input-fg: rgba(var(--pt-disable-fg));--ptc-input-trailing: rgba(var(--pt-disable-fg));--ptc-input-placeholder: rgba(var(--pt-disable-fg))}.pc_input:not(:disabled):not([data-disabled=true]):hover .pc_input__number_steps{display:grid}.pc_input:not(:disabled):not([data-disabled=true]):focus.pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true])[data-focus=true].pc_input--simple,.pc_input:not(:disabled):not([data-disabled=true]):focus-visible.pc_input--simple{box-shadow:none}.pc_input.pc_input--bordered{border-width:1px;border-style:solid;border-color:var(--ptc-input-br)}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):not(.pc_input--error):not(.pc_input--success):not(.pc_input--warning):not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]){z-index:1}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-danger-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--error:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-danger-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-warning-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--warning:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-warning-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):not(:hover){--ptc-input-br: rgba(var(--pt-success-br))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]).pc_input--success:not(:focus):not([data-focus=true]):hover{--ptc-input-br: rgba(var(--pt-success-br-target))}.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus,.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true])[data-focus=true],.pc_input.pc_input--bordered:not(:disabled):not([data-disabled=true]):focus-visible{--ptc-input-br: rgba(var(--pt-primary-6))}.pc_input.pc_input--bordered:disabled,.pc_input.pc_input--bordered[data-disabled=true]{--ptc-input-br: rgba(var(--pt-gray-1))}.pc_input:not(.pc_input--bordered){border-width:var(--pt-stroke-0, 0px)}.pc_input .pc_input__input{box-sizing:border-box;min-width:64px;flex-shrink:1;flex-grow:1;overflow:hidden;border-width:var(--pt-stroke-0, 0px);padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;outline:0}.pc_input.pc_input--autofill-style .pc_input__input{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active,.pc_input.pc_input--autofill-style .pc_input__input:autofill,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input.pc_input--autofill-style .pc_input__input:-moz-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:-webkit-autofill:active::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:hover::placeholder,.pc_input.pc_input--autofill-style .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input.pc_input--autofill-style .pc_input__input::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input{background-color:transparent;color:var(--ptc-input-fg)}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus{color:var(--ptc-input-fg)!important;-webkit-text-fill-color:var(--ptc-input-fg)!important;caret-color:var(--ptc-input-fg)!important;background-color:var(--ptc-input-bg)!important;-webkit-box-shadow:0 0 0px 1000px var(--ptc-input-bg) inset!important;box-shadow:0 0 0 1000px var(--ptc-input-bg) inset!important;transition:background-color 5000s ease-in-out 0s!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input:-moz-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:focus::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:-webkit-autofill:active::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:hover::placeholder,.pc_input:not(.pc_input--autofill-style) .pc_input__input:autofill:focus::placeholder{color:var(--ptc-input-placeholder)!important;-webkit-text-fill-color:var(--ptc-input-placeholder)!important}.pc_input:not(.pc_input--autofill-style) .pc_input__input::placeholder{color:var(--ptc-input-placeholder);-webkit-text-fill-color:var(--ptc-input-placeholder)}.pc_input .pc_input__input_value{pointer-events:none;visibility:hidden;position:absolute;inset:var(--pt-dimension-0, 0px);display:inline;width:fit-content;opacity:0}.pc_input .pc_input__leading,.pc_input .pc_input__trailing{height:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_input .pc_input__leading{color:var(--ptc-input-fg)}.pc_input .pc_input__trailing{gap:var(--pt-dimension-200, 4px);color:var(--ptc-input-trailing)}.pc_input .pc_input__trailing .pc_input__clear_icon{cursor:pointer}.pc_input .pc_input__divider{height:var(--pt-dimension-700, 14px);min-height:unset}\n";
5
5
  const inputId = `${prefix}s-input`;
6
6
  const addInputCss = () => addCssToHead(inputId, cssText);
7
7
  const removeInputCss = () => removeCssFromHead(inputId);
package/dist/table.css CHANGED
@@ -1 +1 @@
1
- .pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}
1
+ .pc_table{box-sizing:border-box}.pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}
package/dist/table.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}\n";
2
+ const cssText = ".pc_table{box-sizing:border-box}.pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}\n";
3
3
  const tableId = `${prefix}s-table`;
4
4
  const addTableCss = () => addCssToHead(tableId, cssText);
5
5
  const removeTableCss = () => removeCssFromHead(tableId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}\n";
4
+ const cssText = ".pc_table{box-sizing:border-box}.pc_table--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}\n";
5
5
  const tableId = `${prefix}s-table`;
6
6
  const addTableCss = () => addCssToHead(tableId, cssText);
7
7
  const removeTableCss = () => removeCssFromHead(tableId);
package/dist/tbody.css CHANGED
@@ -1 +1 @@
1
- .pc_table__tbody{border-width:var(--pt-stroke-0, 0px)}
1
+ .pc_table__tbody{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px)}
package/dist/tbody.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table__tbody{border-width:var(--pt-stroke-0, 0px)}\n";
2
+ const cssText = ".pc_table__tbody{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px)}\n";
3
3
  const tbodyId = `${prefix}s-tbody`;
4
4
  const addTbodyCss = () => addCssToHead(tbodyId, cssText);
5
5
  const removeTbodyCss = () => removeCssFromHead(tbodyId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_table__tbody{border-width:var(--pt-stroke-0, 0px)}\n";
4
+ const cssText = ".pc_table__tbody{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px)}\n";
5
5
  const tbodyId = `${prefix}s-tbody`;
6
6
  const addTbodyCss = () => addCssToHead(tbodyId, cssText);
7
7
  const removeTbodyCss = () => removeCssFromHead(tbodyId);
package/dist/tcell.css CHANGED
@@ -1 +1 @@
1
- .pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:"";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}
1
+ .pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:"";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}
package/dist/tcell.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:\"\";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}\n";
2
+ const cssText = ".pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:\"\";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}\n";
3
3
  const tcellId = `${prefix}s-tcell`;
4
4
  const addTcellCss = () => addCssToHead(tcellId, cssText);
5
5
  const removeTcellCss = () => removeCssFromHead(tcellId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:\"\";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}\n";
4
+ const cssText = ".pc_table__td,.pc_table__th{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;min-height:var(--ptc-cell-height);height:var(--ptc-cell-height)}.pc_table__td:not(.pc_table__td--no-px),.pc_table__th:not(.pc_table__td--no-px){padding-left:var(--pt-dimension-400, 8px);padding-right:var(--pt-dimension-400, 8px)}.pc_table__td--lg,.pc_table__th--lg{--ptc-cell-height: var(--pt-size-lg);--ptc-hover-cell-action-offset: var(--pt-dimension-200)}.pc_table__td--xlg,.pc_table__th--xlg{--ptc-cell-height: var(--pt-size-xlg);--ptc-hover-cell-action-offset: var(--pt-dimension-400)}.pc_table__td--fixed,.pc_table__th--fixed{background:var(--ptc-cell-bg);position:sticky!important}.pc_table__td--after-shadow,.pc_table__th--after-shadow{overflow:visible!important}.pc_table__td--after-shadow:after,.pc_table__th--after-shadow:after{content:\"\";transform:translate(100%);box-shadow:inset 10px 0 8px -8px var(--pt-alpha-gray-2);pointer-events:none;position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);z-index:4;height:100%;width:30px;transition-property:box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer){--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):not(.pc_table__td--fixed){position:relative}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse{box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__ellipse--h-full{height:100%}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer).pc_table__td--wrap:not(.pc_table__td--no-py){padding-top:var(--pt-dimension-600, 12px);padding-bottom:var(--pt-dimension-600, 12px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__absolute_action{position:absolute;top:var(--pt-dimension-0, 0px);display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer) .pc_table__td__hover_actions{display:none}.pc_table__td:not(.pc_table__td--empty):not(.pc_table__td--lazy-load-observer):hover .pc_table__td__absolute_action{display:flex;align-items:center;gap:var(--pt-dimension-300, 6px);top:var(--ptc-hover-cell-action-offset);inset-inline-end:var(--ptc-hover-cell-action-offset)}.pc_table__td--lazy-load-observer:not(.pc_table__td--empty){position:absolute;width:100%;padding:var(--pt-dimension-0, 0px);top:calc(var(--ptc-cell-height) * -1)}.pc_table__td__empty{display:flex;align-items:center;justify-content:center}.pc_table__th{width:fit-content;text-align:start;--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.pc_table__th:not(.pc_table__th--fixed){position:relative}.pc_table__th__content{height:100%;width:100%;display:flex;align-items:flex-end;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_table__th:not([data-dragging]):hover,.pc_table__th:not([data-dragging])[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}\n";
5
5
  const tcellId = `${prefix}s-tcell`;
6
6
  const addTcellCss = () => addCssToHead(tcellId, cssText);
7
7
  const removeTcellCss = () => removeCssFromHead(tcellId);
package/dist/tfoot.css CHANGED
@@ -1 +1 @@
1
- .pc_table__tfoot{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:"";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}
1
+ .pc_table__tfoot{box-sizing:border-box;--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:"";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}
package/dist/tfoot.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table__tfoot{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:\"\";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}\n";
2
+ const cssText = ".pc_table__tfoot{box-sizing:border-box;--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:\"\";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}\n";
3
3
  const tfootId = `${prefix}s-tfoot`;
4
4
  const addTfootCss = () => addCssToHead(tfootId, cssText);
5
5
  const removeTfootCss = () => removeCssFromHead(tfootId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_table__tfoot{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:\"\";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}\n";
4
+ const cssText = ".pc_table__tfoot{box-sizing:border-box;--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg)}.pc_table__tfoot--sticky{position:sticky;bottom:var(--pt-dimension-0, 0px);z-index:3}.pc_table__tfoot--sticky:before{content:\"\";position:absolute;top:var(--pt-dimension-0, 0px);z-index:3;width:100%;height:1px;--ptu-bg-opacity:1;background-color:rgba(var(--pt-br),var(--ptu-bg-opacity))}.pc_table__tfoot:not(.pc_table__tfoot--sticky){border-width:var(--pt-stroke-0, 0px);border-top-width:1px;--ptu-border-opacity:1;--ptu-border-top-opacity:var(--ptu-border-opacity);border-top-color:rgba(var(--pt-br),var(--ptu-border-top-opacity));border-top-style:solid}\n";
5
5
  const tfootId = `${prefix}s-tfoot`;
6
6
  const addTfootCss = () => addCssToHead(tfootId, cssText);
7
7
  const removeTfootCss = () => removeCssFromHead(tfootId);
package/dist/thead.css CHANGED
@@ -1 +1 @@
1
- .pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}
1
+ .pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}
package/dist/thead.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}\n";
2
+ const cssText = ".pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}\n";
3
3
  const theadId = `${prefix}s-thead`;
4
4
  const addTheadCss = () => addCssToHead(theadId, cssText);
5
5
  const removeTheadCss = () => removeCssFromHead(theadId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}\n";
4
+ const cssText = ".pc_table__thead{--ptc-cell-bg: rgba(var(--pt-bg));background:var(--ptc-cell-bg);box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-bottom-width:1px;--ptu-border-opacity:1;--ptu-border-bottom-opacity:var(--ptu-border-opacity);border-bottom-color:rgba(var(--pt-br),var(--ptu-border-bottom-opacity));border-bottom-style:solid}.pc_table__thead--sticky{position:sticky;top:var(--pt-dimension-0, 0px);z-index:3;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_table__thead--sticky:not(.pc_table__thead--hide-shadow){--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow)}\n";
5
5
  const theadId = `${prefix}s-thead`;
6
6
  const addTheadCss = () => addCssToHead(theadId, cssText);
7
7
  const removeTheadCss = () => removeCssFromHead(theadId);
package/dist/tooltip.css CHANGED
@@ -1 +1 @@
1
- .pc_tooltip__content{position:relative;box-sizing:border-box;display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:"";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:"";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}
1
+ .pc_tooltip__content{position:relative;box-sizing:border-box;min-height:var(--pt-size-md, 32px);display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:"";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;min-height:var(--pt-size-md, 32px);padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;line-height:var(--pt-size-sm);text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:"";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}
package/dist/tooltip.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_tooltip__content{position:relative;box-sizing:border-box;display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:\"\";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}\n";
2
+ const cssText = ".pc_tooltip__content{position:relative;box-sizing:border-box;min-height:var(--pt-size-md, 32px);display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;min-height:var(--pt-size-md, 32px);padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;line-height:var(--pt-size-sm);text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:\"\";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}\n";
3
3
  const tooltipId = `${prefix}s-tooltip`;
4
4
  const addTooltipCss = () => addCssToHead(tooltipId, cssText);
5
5
  const removeTooltipCss = () => removeCssFromHead(tooltipId);
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_tooltip__content{position:relative;box-sizing:border-box;display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:\"\";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}\n";
4
+ const cssText = ".pc_tooltip__content{position:relative;box-sizing:border-box;min-height:var(--pt-size-md, 32px);display:flex;gap:var(--pt-dimension-300, 6px);border-width:var(--pt-stroke-10, 1px);--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;max-height:var(--reka-tooltip-content-available-height);max-width:var(--reka-tooltip-content-available-width);width:var(--ptc-tooltip-w, auto);outline:0}.pc_tooltip__content:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_tooltip__content[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_tooltip__content[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_tooltip__content[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_tooltip__content[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_tooltip__content[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_tooltip__content[data-side=right]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_tooltip__content[data-side=left]:before{top:50%;--ptu-translate-y:-50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_tooltip__content .pc_tooltip__text{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_tooltip{position:relative}.pc_tooltip:before{content:attr(data-tooltip);pointer-events:none;box-sizing:border-box;border-width:1px;--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-radius:var(--pt-roundness-lg, 8px);border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));--ptu-shadow:0px 0px var(--pt-dimension-100) 0px var(--pt-alpha-gray-2), 0 var(--pt-dimension-400) var(--pt-dimension-800) 0px var(--pt-alpha-gray-2);box-shadow:var(--ptu-ring-offset-shadow),var(--ptu-ring-shadow),var(--ptu-shadow);position:absolute;z-index:1000;max-width:80vw;min-height:var(--pt-size-md, 32px);padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-300, 6px);padding-right:var(--pt-dimension-300, 6px);--ptu-text-opacity:1;color:rgba(var(--pt-grayscale-dark-8),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;line-height:var(--pt-size-sm);text-wrap:nowrap;opacity:0;visibility:hidden}.pc_tooltip:after{pointer-events:none;position:absolute;z-index:1000;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-grayscale-dark-2),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-grayscale-dark-0),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px;content:\"\";opacity:0;visibility:hidden}.pc_tooltip:hover:before,.pc_tooltip:hover:after{opacity:1;visibility:visible}.pc_tooltip.pc_tooltip--top:before,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):before{bottom:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--top:after,.pc_tooltip:not(.pc_tooltip--bottom):not(.pc_tooltip--right):not(.pc_tooltip--left):after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--bottom:before{top:calc(100% + 12px);left:50%;transform:translate(-50%)}.pc_tooltip.pc_tooltip--bottom:after{--ptu-translate-x:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:calc(100% + 8px);left:calc(50% - 8px)}.pc_tooltip.pc_tooltip--right:before{left:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--right:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:calc(100% + 8px);top:calc(50% - 8px)}.pc_tooltip.pc_tooltip--left:before{right:calc(100% + 12px);top:50%;transform:translateY(-50%)}.pc_tooltip.pc_tooltip--left:after{--ptu-translate-y:50%;--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:calc(100% + 8px);top:calc(50% - 8px)}\n";
5
5
  const tooltipId = `${prefix}s-tooltip`;
6
6
  const addTooltipCss = () => addCssToHead(tooltipId, cssText);
7
7
  const removeTooltipCss = () => removeCssFromHead(tooltipId);
package/dist/tr.css CHANGED
@@ -1 +1 @@
1
- .pc_table__tr{border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ptc-cell-bg)}.pc_table__tr--empty{height:100%}.pc_table__tr--checked:not(.pc_table__tr--empty){--ptc-cell-bg: rgba(var(--pt-primary-0))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(odd){--ptc-cell-bg: rgba(var(--pt-bg-secondary))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(2n){--ptc-cell-bg: rgba(var(--pt-bg))}.pc_table__tr--lazy-load-observer{pointer-events:none;position:relative;height:var(--pt-dimension-0, 0px)}.pc_table__tr:hover .pc_table__td__hover_actions{display:flex;gap:var(--pt-dimension-200, 4px)}
1
+ .pc_table__tr{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ptc-cell-bg)}.pc_table__tr--empty{height:100%}.pc_table__tr--checked:not(.pc_table__tr--empty){--ptc-cell-bg: rgba(var(--pt-primary-0))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(odd){--ptc-cell-bg: rgba(var(--pt-bg-secondary))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(2n){--ptc-cell-bg: rgba(var(--pt-bg))}.pc_table__tr--lazy-load-observer{pointer-events:none;position:relative;height:var(--pt-dimension-0, 0px)}.pc_table__tr:hover .pc_table__td__hover_actions{display:flex;gap:var(--pt-dimension-200, 4px)}
package/dist/tr.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_table__tr{border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ptc-cell-bg)}.pc_table__tr--empty{height:100%}.pc_table__tr--checked:not(.pc_table__tr--empty){--ptc-cell-bg: rgba(var(--pt-primary-0))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(odd){--ptc-cell-bg: rgba(var(--pt-bg-secondary))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(2n){--ptc-cell-bg: rgba(var(--pt-bg))}.pc_table__tr--lazy-load-observer{pointer-events:none;position:relative;height:var(--pt-dimension-0, 0px)}.pc_table__tr:hover .pc_table__td__hover_actions{display:flex;gap:var(--pt-dimension-200, 4px)}\n";
2
+ const cssText = ".pc_table__tr{box-sizing:border-box;border-width:var(--pt-stroke-0, 0px);border-style:none;padding:var(--pt-dimension-0, 0px);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ptc-cell-bg)}.pc_table__tr--empty{height:100%}.pc_table__tr--checked:not(.pc_table__tr--empty){--ptc-cell-bg: rgba(var(--pt-primary-0))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(odd){--ptc-cell-bg: rgba(var(--pt-bg-secondary))}.pc_table__tr--zebra:not(.pc_table__tr--empty):not(.pc_table__tr--checked):not(.pc_table__tr--lazy-load-observer):nth-child(2n){--ptc-cell-bg: rgba(var(--pt-bg))}.pc_table__tr--lazy-load-observer{pointer-events:none;position:relative;height:var(--pt-dimension-0, 0px)}.pc_table__tr:hover .pc_table__td__hover_actions{display:flex;gap:var(--pt-dimension-200, 4px)}\n";
3
3
  const trId = `${prefix}s-tr`;
4
4
  const addTrCss = () => addCssToHead(trId, cssText);
5
5
  const removeTrCss = () => removeCssFromHead(trId);