@pantograph/styles 0.0.1 → 0.0.2

package/dist/thead.d.ts

@@ -1,4 +1,5 @@
-declare const cssText: string;
+declare const theadId: string;
 declare const addTheadCss: () => void;
+declare const removeTheadCss: () => void;
 declare const theadCss: string;
-export { addTheadCss, theadCss };
+export { theadId, addTheadCss, removeTheadCss, theadCss };

package/dist/thead.js

@@ -1,4 +1,7 @@
-import { addCssToHead, prefix } from "@pantograph/tokens";
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
 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";
-export const addTheadCss = () => addCssToHead(`${prefix}s-thead`, cssText);
-export const theadCss = cssText;
+const theadId = `${prefix}s-thead`;
+const addTheadCss = () => addCssToHead(theadId, cssText);
+const removeTheadCss = () => removeCssFromHead(theadId);
+const theadCss = cssText;
+export { theadId, addTheadCss, removeTheadCss, theadCss };

package/dist/thead.umd.cjs

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const { addCssToHead, prefix } = require("@pantograph/tokens");
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
 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";
-const addTheadCss = () => addCssToHead(`${prefix}s-thead`, cssText);
+const theadId = `${prefix}s-thead`;
+const addTheadCss = () => addCssToHead(theadId, cssText);
+const removeTheadCss = () => removeCssFromHead(theadId);
+const theadCss = cssText;
+exports.theadId = theadId;
 exports.addTheadCss = addTheadCss;
-exports.theadCss = cssText;
+exports.removeTheadCss = removeTheadCss;
+exports.theadCss = theadCss;

package/dist/toast.d.ts

@@ -1,4 +1,5 @@
-declare const cssText: string;
+declare const toastId: string;
 declare const addToastCss: () => void;
+declare const removeToastCss: () => void;
 declare const toastCss: string;
-export { addToastCss, toastCss };
+export { toastId, addToastCss, removeToastCss, toastCss };

package/dist/toast.js

@@ -1,4 +1,7 @@
-import { addCssToHead, prefix } from "@pantograph/tokens";
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
 const cssText = ".pc_toast{pointer-events:auto;position:relative;display:flex;-webkit-user-select:none;user-select:none;gap:var(--pt-dimension-300, 6px);overflow:hidden;border-width: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:var(--pt-dimension-400, 8px);padding-inline-start:var(--pt-dimension-600, 12px);--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);min-width:256px;width:448px}.pc_toast.pc_toast--info{--ptc-toast-fg: rgba(var(--pt-sky-fg));--ptc-toast-bg: rgba(var(--pt-sky-fill-subtle));--ptc-toast-br: rgba(var(--pt-info-br-subtle))}.pc_toast.pc_toast--success{--ptc-toast-fg: rgba(var(--pt-success-fg));--ptc-toast-bg: rgba(var(--pt-success-fill-subtle));--ptc-toast-br: rgba(var(--pt-success-br-subtle))}.pc_toast.pc_toast--warning{--ptc-toast-fg: rgba(var(--pt-warning-fg));--ptc-toast-bg: rgba(var(--pt-warning-fill-subtle));--ptc-toast-br: rgba(var(--pt-warning-br-subtle))}.pc_toast.pc_toast--error{--ptc-toast-fg: rgba(var(--pt-danger-fg));--ptc-toast-bg: rgba(var(--pt-danger-fill-subtle));--ptc-toast-br: rgba(var(--pt-danger-subtle-br))}.pc_toast .pc_toast__body{display:flex;flex-direction:column;flex:1 1 0%;gap:var(--pt-dimension-400, 8px);width:calc(100% - var(--pt-dimension-600) - var(--pt-dimension-400))}.pc_toast .pc_toast__content{width:100%;display:flex;flex-direction:column}.pc_toast .pc_toast__header{height:var(--pt-size-md, 32px);display:flex;align-items:flex-start;gap:var(--pt-dimension-400, 8px)}.pc_toast .pc_toast__header .pc_toast__title{height:var(--pt-size-md, 32px);flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;--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-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;line-height:var(--pt-dimension-1600)}.pc_toast .pc_toast__description{--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-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_toast .pc_toast__actions{display:flex;justify-content:flex-end;gap:var(--pt-dimension-300, 6px)}.pc_toast .pc_toast__icon{padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);color:var(--ptc-toast-fg)}.pc_toast .pc_toast__progress{position:absolute;inset-inline-start:var(--pt-dimension-0, 0px);bottom:var(--pt-dimension-0, 0px)}.pc_toast .pc_toast__progress .pc_progress__line__value{animation-name:progressGrow;animation-timing-function:linear;animation-fill-mode:forwards;animation-duration:calc(var(--ptc-progress-animation-duration) * 1s)}.pc_toast.pc_toast--paused .pc_progress__line__value{animation-play-state:paused}@keyframes progressGrow{0%{width:0}to{width:100%}}\n";
-export const addToastCss = () => addCssToHead(`${prefix}s-toast`, cssText);
-export const toastCss = cssText;
+const toastId = `${prefix}s-toast`;
+const addToastCss = () => addCssToHead(toastId, cssText);
+const removeToastCss = () => removeCssFromHead(toastId);
+const toastCss = cssText;
+export { toastId, addToastCss, removeToastCss, toastCss };

package/dist/toast.umd.cjs

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const { addCssToHead, prefix } = require("@pantograph/tokens");
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
 const cssText = ".pc_toast{pointer-events:auto;position:relative;display:flex;-webkit-user-select:none;user-select:none;gap:var(--pt-dimension-300, 6px);overflow:hidden;border-width: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:var(--pt-dimension-400, 8px);padding-inline-start:var(--pt-dimension-600, 12px);--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);min-width:256px;width:448px}.pc_toast.pc_toast--info{--ptc-toast-fg: rgba(var(--pt-sky-fg));--ptc-toast-bg: rgba(var(--pt-sky-fill-subtle));--ptc-toast-br: rgba(var(--pt-info-br-subtle))}.pc_toast.pc_toast--success{--ptc-toast-fg: rgba(var(--pt-success-fg));--ptc-toast-bg: rgba(var(--pt-success-fill-subtle));--ptc-toast-br: rgba(var(--pt-success-br-subtle))}.pc_toast.pc_toast--warning{--ptc-toast-fg: rgba(var(--pt-warning-fg));--ptc-toast-bg: rgba(var(--pt-warning-fill-subtle));--ptc-toast-br: rgba(var(--pt-warning-br-subtle))}.pc_toast.pc_toast--error{--ptc-toast-fg: rgba(var(--pt-danger-fg));--ptc-toast-bg: rgba(var(--pt-danger-fill-subtle));--ptc-toast-br: rgba(var(--pt-danger-subtle-br))}.pc_toast .pc_toast__body{display:flex;flex-direction:column;flex:1 1 0%;gap:var(--pt-dimension-400, 8px);width:calc(100% - var(--pt-dimension-600) - var(--pt-dimension-400))}.pc_toast .pc_toast__content{width:100%;display:flex;flex-direction:column}.pc_toast .pc_toast__header{height:var(--pt-size-md, 32px);display:flex;align-items:flex-start;gap:var(--pt-dimension-400, 8px)}.pc_toast .pc_toast__header .pc_toast__title{height:var(--pt-size-md, 32px);flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;--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-medium, medium);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0;line-height:var(--pt-dimension-1600)}.pc_toast .pc_toast__description{--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-600, 12px);line-height:var(--pt-lineheight-7, 14px);letter-spacing:0}.pc_toast .pc_toast__actions{display:flex;justify-content:flex-end;gap:var(--pt-dimension-300, 6px)}.pc_toast .pc_toast__icon{padding-top:var(--pt-dimension-200, 4px);padding-bottom:var(--pt-dimension-200, 4px);color:var(--ptc-toast-fg)}.pc_toast .pc_toast__progress{position:absolute;inset-inline-start:var(--pt-dimension-0, 0px);bottom:var(--pt-dimension-0, 0px)}.pc_toast .pc_toast__progress .pc_progress__line__value{animation-name:progressGrow;animation-timing-function:linear;animation-fill-mode:forwards;animation-duration:calc(var(--ptc-progress-animation-duration) * 1s)}.pc_toast.pc_toast--paused .pc_progress__line__value{animation-play-state:paused}@keyframes progressGrow{0%{width:0}to{width:100%}}\n";
-const addToastCss = () => addCssToHead(`${prefix}s-toast`, cssText);
+const toastId = `${prefix}s-toast`;
+const addToastCss = () => addCssToHead(toastId, cssText);
+const removeToastCss = () => removeCssFromHead(toastId);
+const toastCss = cssText;
+exports.toastId = toastId;
 exports.addToastCss = addToastCss;
-exports.toastCss = cssText;
+exports.removeToastCss = removeToastCss;
+exports.toastCss = toastCss;

package/dist/tooltip.css

@@ -0,0 +1 @@
+.tippy-box[data-animation=scale][data-placement^=top]{transform-origin:bottom}.tippy-box[data-animation=scale][data-placement^=bottom]{transform-origin:top}.tippy-box[data-animation=scale][data-placement^=left]{transform-origin:right}.tippy-box[data-animation=scale][data-placement^=right]{transform-origin:left}.tippy-box[data-animation=scale][data-state=hidden]{transform:scale(.5);opacity:0}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}

package/dist/tooltip.d.ts

@@ -0,0 +1,5 @@
+declare const tooltipId: string;
+declare const addTooltipCss: () => void;
+declare const removeTooltipCss: () => void;
+declare const tooltipCss: string;
+export { tooltipId, addTooltipCss, removeTooltipCss, tooltipCss };

package/dist/tooltip.js

@@ -0,0 +1,7 @@
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
+const cssText = ".tippy-box[data-animation=scale][data-placement^=top]{transform-origin:bottom}.tippy-box[data-animation=scale][data-placement^=bottom]{transform-origin:top}.tippy-box[data-animation=scale][data-placement^=left]{transform-origin:right}.tippy-box[data-animation=scale][data-placement^=right]{transform-origin:left}.tippy-box[data-animation=scale][data-state=hidden]{transform:scale(.5);opacity:0}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:\"\";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}\n";
+const tooltipId = `${prefix}s-tooltip`;
+const addTooltipCss = () => addCssToHead(tooltipId, cssText);
+const removeTooltipCss = () => removeCssFromHead(tooltipId);
+const tooltipCss = cssText;
+export { tooltipId, addTooltipCss, removeTooltipCss, tooltipCss };

package/dist/tooltip.umd.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
+const cssText = ".tippy-box[data-animation=scale][data-placement^=top]{transform-origin:bottom}.tippy-box[data-animation=scale][data-placement^=bottom]{transform-origin:top}.tippy-box[data-animation=scale][data-placement^=left]{transform-origin:right}.tippy-box[data-animation=scale][data-placement^=right]{transform-origin:left}.tippy-box[data-animation=scale][data-state=hidden]{transform:scale(.5);opacity:0}.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:\"\";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}\n";
+const tooltipId = `${prefix}s-tooltip`;
+const addTooltipCss = () => addCssToHead(tooltipId, cssText);
+const removeTooltipCss = () => removeCssFromHead(tooltipId);
+const tooltipCss = cssText;
+exports.tooltipId = tooltipId;
+exports.addTooltipCss = addTooltipCss;
+exports.removeTooltipCss = removeTooltipCss;
+exports.tooltipCss = tooltipCss;

package/dist/tr.d.ts

@@ -1,4 +1,5 @@
-declare const cssText: string;
+declare const trId: string;
 declare const addTrCss: () => void;
+declare const removeTrCss: () => void;
 declare const trCss: string;
-export { addTrCss, trCss };
+export { trId, addTrCss, removeTrCss, trCss };

package/dist/tr.js

@@ -1,4 +1,7 @@
-import { addCssToHead, prefix } from "@pantograph/tokens";
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
 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";
-export const addTrCss = () => addCssToHead(`${prefix}s-tr`, cssText);
-export const trCss = cssText;
+const trId = `${prefix}s-tr`;
+const addTrCss = () => addCssToHead(trId, cssText);
+const removeTrCss = () => removeCssFromHead(trId);
+const trCss = cssText;
+export { trId, addTrCss, removeTrCss, trCss };

package/dist/tr.umd.cjs

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const { addCssToHead, prefix } = require("@pantograph/tokens");
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
 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";
-const addTrCss = () => addCssToHead(`${prefix}s-tr`, cssText);
+const trId = `${prefix}s-tr`;
+const addTrCss = () => addCssToHead(trId, cssText);
+const removeTrCss = () => removeCssFromHead(trId);
+const trCss = cssText;
+exports.trId = trId;
 exports.addTrCss = addTrCss;
-exports.trCss = cssText;
+exports.removeTrCss = removeTrCss;
+exports.trCss = trCss;

package/dist/tree.d.ts

@@ -1,4 +1,5 @@
-declare const cssText: string;
+declare const treeId: string;
 declare const addTreeCss: () => void;
+declare const removeTreeCss: () => void;
 declare const treeCss: string;
-export { addTreeCss, treeCss };
+export { treeId, addTreeCss, removeTreeCss, treeCss };

package/dist/tree.js

@@ -1,4 +1,7 @@
-import { addCssToHead, prefix } from "@pantograph/tokens";
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
 const cssText = ".pc_sort_placeholder{box-sizing:border-box;height:100%;min-width:var(--pt-dimension-4800, 96px);flex:1 1 0%;border-width:1px;border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:dashed;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_sort_placeholder.pc_sort_placeholder--sm{height:var(--pt-size-sm, 24px);min-height:var(--pt-size-sm, 24px);max-height:var(--pt-size-sm, 24px);border-radius:var(--pt-roundness-sm, 4px)}.pc_sort_placeholder.pc_sort_placeholder--md{height:var(--pt-size-md, 32px);min-height:var(--pt-size-md, 32px);max-height:var(--pt-size-md, 32px);border-radius:var(--pt-roundness-md, 6px)}.pc_sort_placeholder.pc_sort_placeholder--lg{height:var(--pt-size-lg, 40px);min-height:var(--pt-size-lg, 40px);max-height:var(--pt-size-lg, 40px);border-radius:var(--pt-roundness-lg, 8px)}.pc_tree{gap:var(--ptc-tree-gap)}.pc_tree .pc_tree__sort_placeholder{padding-inline-start:calc(var(--ptc-tree-node-padding-start) + var(--ptc-tree-node-draggable-size));width:100%;display:flex;align-items:center}.pc_tree:not(.pc_tree--inline-node){display:flex;flex-direction:column}.pc_tree:not(.pc_tree--inline-node) .pc_tree__node{display:flex}.pc_tree.pc_tree--inline-node{width:fit-content;height:fit-content;display:flex;flex-direction:column}.pc_tree.pc_tree--inline-node .pc_tree__node{width:fit-content;display:inline-flex}.pc_tree.pc_tree--gap-none{--ptc-tree-gap: 0px}.pc_tree.pc_tree--gap-sm{--ptc-tree-gap: var(--pt-dimension-200)}.pc_tree.pc_tree--gap-md{--ptc-tree-gap: var(--pt-dimension-300)}.pc_tree.pc_tree--gap-lg{--ptc-tree-gap: var(--pt-dimension-400)}.pc_tree .pc_tree__node{padding-inline-start:var(--ptc-tree-node-padding-start);height:var(--ptc-tree-node-height);min-height:var(--ptc-tree-node-height);max-height:var(--ptc-tree-node-height);-webkit-user-select:none;user-select:none;align-items:center;outline:0}.pc_tree .pc_tree__node .pc_tree__node__indent .pc_indent_level__item:not(.pc_indent_level--expand){--ptc-tree-item-indent-h: calc(var(--ptc-tree-node-height) + var(--ptc-tree-gap));margin-top:calc(-2 * var(--ptc-tree-gap));height:var(--ptc-tree-item-indent-h);min-height:var(--ptc-tree-item-indent-h);max-height:var(--ptc-tree-item-indent-h)}.pc_tree .pc_tree__node .pc_tree__node__title{padding-inline-start:var(--pt-dimension-200, 4px)}.pc_tree .pc_tree__node__slot{box-sizing:border-box;height:100%;min-width:var(--pt-dimension-4800, 96px);flex:1 1 0%;border-width:1px;border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:dashed;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_tree.pc_tree--dragging{padding-bottom:var(--pt-dimension-1000, 20px)}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled){cursor:pointer;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_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-0),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active:hover,.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-1),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active:active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-2),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active):hover,.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active)[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active):active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-2),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):focus{--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_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled) .pc_tree__node__draggable .pc_tree__node__draggable__icon{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle-target),var(--ptu-text-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node.pc_tree__node--disabled.pc_tree__node--active{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_tree.pc_tree--sm{--ptc-tree-node-height: var(--pt-size-sm);--ptc-tree-node-padding-start: var(--pt-dimension-200);--ptc-tree-node-draggable-size: var(--pt-dimension-800)}.pc_tree.pc_tree--sm .pc_tree__node,.pc_tree.pc_tree--sm .pc_tree__node__slot{border-radius:var(--pt-roundness-sm, 4px)}.pc_tree.pc_tree--md{--ptc-tree-node-height: var(--pt-size-md);--ptc-tree-node-padding-start: var(--pt-dimension-300);--ptc-tree-node-draggable-size: var(--pt-dimension-1000)}.pc_tree.pc_tree--md .pc_tree__node,.pc_tree.pc_tree--md .pc_tree__node__slot{border-radius:var(--pt-roundness-md, 6px)}.pc_tree.pc_tree--lg{--ptc-tree-node-height: var(--pt-size-lg);--ptc-tree-node-padding-start: var(--pt-dimension-400);--ptc-tree-node-draggable-size: var(--pt-dimension-1000)}.pc_tree.pc_tree--lg .pc_tree__node,.pc_tree.pc_tree--lg .pc_tree__node__slot{border-radius:var(--pt-roundness-lg, 8px)}.pc_tree__node__draggable{display:flex;align-items:center;justify-content:center;width:var(--ptc-tree-node-draggable-size);min-width:var(--ptc-tree-node-draggable-size)}@media (min-width: 768px){.pc_tree__node .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:none}.pc_tree__node:hover .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:flex;cursor:grab}}@media (max-width: 767.9px){.pc_tree__node .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:flex;cursor:grab}}.pc_tree--disabled .pc_tree__node__draggable,.pc_tree__node--disabled .pc_tree__node__draggable{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_tree--disabled .pc_tree__node__draggable>.pc_tree__node__draggable__icon,.pc_tree__node--disabled .pc_tree__node__draggable>.pc_tree__node__draggable__icon{cursor:not-allowed!important}\n";
-export const addTreeCss = () => addCssToHead(`${prefix}s-tree`, cssText);
-export const treeCss = cssText;
+const treeId = `${prefix}s-tree`;
+const addTreeCss = () => addCssToHead(treeId, cssText);
+const removeTreeCss = () => removeCssFromHead(treeId);
+const treeCss = cssText;
+export { treeId, addTreeCss, removeTreeCss, treeCss };

package/dist/tree.umd.cjs

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const { addCssToHead, prefix } = require("@pantograph/tokens");
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
 const cssText = ".pc_sort_placeholder{box-sizing:border-box;height:100%;min-width:var(--pt-dimension-4800, 96px);flex:1 1 0%;border-width:1px;border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:dashed;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_sort_placeholder.pc_sort_placeholder--sm{height:var(--pt-size-sm, 24px);min-height:var(--pt-size-sm, 24px);max-height:var(--pt-size-sm, 24px);border-radius:var(--pt-roundness-sm, 4px)}.pc_sort_placeholder.pc_sort_placeholder--md{height:var(--pt-size-md, 32px);min-height:var(--pt-size-md, 32px);max-height:var(--pt-size-md, 32px);border-radius:var(--pt-roundness-md, 6px)}.pc_sort_placeholder.pc_sort_placeholder--lg{height:var(--pt-size-lg, 40px);min-height:var(--pt-size-lg, 40px);max-height:var(--pt-size-lg, 40px);border-radius:var(--pt-roundness-lg, 8px)}.pc_tree{gap:var(--ptc-tree-gap)}.pc_tree .pc_tree__sort_placeholder{padding-inline-start:calc(var(--ptc-tree-node-padding-start) + var(--ptc-tree-node-draggable-size));width:100%;display:flex;align-items:center}.pc_tree:not(.pc_tree--inline-node){display:flex;flex-direction:column}.pc_tree:not(.pc_tree--inline-node) .pc_tree__node{display:flex}.pc_tree.pc_tree--inline-node{width:fit-content;height:fit-content;display:flex;flex-direction:column}.pc_tree.pc_tree--inline-node .pc_tree__node{width:fit-content;display:inline-flex}.pc_tree.pc_tree--gap-none{--ptc-tree-gap: 0px}.pc_tree.pc_tree--gap-sm{--ptc-tree-gap: var(--pt-dimension-200)}.pc_tree.pc_tree--gap-md{--ptc-tree-gap: var(--pt-dimension-300)}.pc_tree.pc_tree--gap-lg{--ptc-tree-gap: var(--pt-dimension-400)}.pc_tree .pc_tree__node{padding-inline-start:var(--ptc-tree-node-padding-start);height:var(--ptc-tree-node-height);min-height:var(--ptc-tree-node-height);max-height:var(--ptc-tree-node-height);-webkit-user-select:none;user-select:none;align-items:center;outline:0}.pc_tree .pc_tree__node .pc_tree__node__indent .pc_indent_level__item:not(.pc_indent_level--expand){--ptc-tree-item-indent-h: calc(var(--ptc-tree-node-height) + var(--ptc-tree-gap));margin-top:calc(-2 * var(--ptc-tree-gap));height:var(--ptc-tree-item-indent-h);min-height:var(--ptc-tree-item-indent-h);max-height:var(--ptc-tree-item-indent-h)}.pc_tree .pc_tree__node .pc_tree__node__title{padding-inline-start:var(--pt-dimension-200, 4px)}.pc_tree .pc_tree__node__slot{box-sizing:border-box;height:100%;min-width:var(--pt-dimension-4800, 96px);flex:1 1 0%;border-width:1px;border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:dashed;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_tree.pc_tree--dragging{padding-bottom:var(--pt-dimension-1000, 20px)}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled){cursor:pointer;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_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-0),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active:hover,.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-1),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled).pc_tree__node--active:active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-primary-2),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active):hover,.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active)[data-highlighted]{--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):not(.pc_tree__node--active):active{--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-2),var(--ptu-bg-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled):focus{--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_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node:not(.pc_tree__node--disabled) .pc_tree__node__draggable .pc_tree__node__draggable__icon{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle-target),var(--ptu-text-opacity))}.pc_tree.pc_tree--selectable:not(.pc_tree--disabled):not(.pc_tree--dragging) .pc_tree__node.pc_tree__node--disabled.pc_tree__node--active{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_tree.pc_tree--sm{--ptc-tree-node-height: var(--pt-size-sm);--ptc-tree-node-padding-start: var(--pt-dimension-200);--ptc-tree-node-draggable-size: var(--pt-dimension-800)}.pc_tree.pc_tree--sm .pc_tree__node,.pc_tree.pc_tree--sm .pc_tree__node__slot{border-radius:var(--pt-roundness-sm, 4px)}.pc_tree.pc_tree--md{--ptc-tree-node-height: var(--pt-size-md);--ptc-tree-node-padding-start: var(--pt-dimension-300);--ptc-tree-node-draggable-size: var(--pt-dimension-1000)}.pc_tree.pc_tree--md .pc_tree__node,.pc_tree.pc_tree--md .pc_tree__node__slot{border-radius:var(--pt-roundness-md, 6px)}.pc_tree.pc_tree--lg{--ptc-tree-node-height: var(--pt-size-lg);--ptc-tree-node-padding-start: var(--pt-dimension-400);--ptc-tree-node-draggable-size: var(--pt-dimension-1000)}.pc_tree.pc_tree--lg .pc_tree__node,.pc_tree.pc_tree--lg .pc_tree__node__slot{border-radius:var(--pt-roundness-lg, 8px)}.pc_tree__node__draggable{display:flex;align-items:center;justify-content:center;width:var(--ptc-tree-node-draggable-size);min-width:var(--ptc-tree-node-draggable-size)}@media (min-width: 768px){.pc_tree__node .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:none}.pc_tree__node:hover .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:flex;cursor:grab}}@media (max-width: 767.9px){.pc_tree__node .pc_tree__node__draggable>.pc_tree__node__draggable__icon{display:flex;cursor:grab}}.pc_tree--disabled .pc_tree__node__draggable,.pc_tree__node--disabled .pc_tree__node__draggable{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_tree--disabled .pc_tree__node__draggable>.pc_tree__node__draggable__icon,.pc_tree__node--disabled .pc_tree__node__draggable>.pc_tree__node__draggable__icon{cursor:not-allowed!important}\n";
-const addTreeCss = () => addCssToHead(`${prefix}s-tree`, cssText);
+const treeId = `${prefix}s-tree`;
+const addTreeCss = () => addCssToHead(treeId, cssText);
+const removeTreeCss = () => removeCssFromHead(treeId);
+const treeCss = cssText;
+exports.treeId = treeId;
 exports.addTreeCss = addTreeCss;
-exports.treeCss = cssText;
+exports.removeTreeCss = removeTreeCss;
+exports.treeCss = treeCss;

package/dist/upload.d.ts

@@ -1,4 +1,5 @@
-declare const cssText: string;
+declare const uploadId: string;
 declare const addUploadCss: () => void;
+declare const removeUploadCss: () => void;
 declare const uploadCss: string;
-export { addUploadCss, uploadCss };
+export { uploadId, addUploadCss, removeUploadCss, uploadCss };

package/dist/upload.js

@@ -1,4 +1,7 @@
-import { addCssToHead, prefix } from "@pantograph/tokens";
+import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
 const cssText = ".pc_upload__list{width:100%}.pc_upload__list.pc_upload__list--card{display:flex;flex-direction:column;gap:var(--pt-dimension-200, 4px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list.pc_upload__list--image{display:flex;flex-wrap:wrap;gap:var(--pt-dimension-300, 6px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--md{--ptc-upload-item-gap: var(--pt-dimension-200);--ptc-upload-item-padding: var(--pt-dimension-200);--ptc-upload-item-roundness: var(--pt-roundness-md);--ptc-upload-image-roundness: var(--pt-roundness-sm);--ptc-upload-item-height: var(--pt-size-md)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--lg{--ptc-upload-item-gap: var(--pt-dimension-300);--ptc-upload-item-padding: var(--pt-dimension-400);--ptc-upload-item-roundness: var(--pt-roundness-lg);--ptc-upload-image-roundness: var(--pt-roundness-md);--ptc-upload-item-height: var(--pt-size-lg)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--xlg{--ptc-upload-item-gap: var(--pt-dimension-300);--ptc-upload-item-padding: var(--pt-dimension-400);--ptc-upload-item-roundness: var(--pt-roundness-lg);--ptc-upload-image-roundness: var(--pt-roundness-md);--ptc-upload-item-height: var(--pt-size-xlg)}.pc_upload__list .pc_upload__list__item:not(.pc_upload__list__item--paused):not(.pc_upload__list__item--error){--ptc-upload-border: rgba(var(--pt-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--paused{--ptc-upload-border: rgba(var(--pt-warning-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--error{--ptc-upload-border: rgba(var(--pt-danger-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card{box-sizing:border-box;width:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;gap:var(--ptc-upload-item-gap);padding:var(--ptc-upload-item-padding);border-radius:var(--ptc-upload-item-roundness);min-height:var(--ptc-upload-item-height);height:var(--ptc-upload-item-height);max-height:var(--ptc-upload-item-height);border-color:var(--ptc-upload-border)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__thumb{aspect-ratio:1/1;height:100%;object-fit:cover}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__progress{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--md .pc_upload__list__item__content{display:flex;gap:var(--pt-dimension-200, 4px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card:not(.pc_upload__list__item--md) .pc_upload__list__item__content{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content .pc_upload__list__item__title{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;--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_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content .pc_upload__list__item__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));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_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__percent{overflow:clip}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--outline{border-width:1px;border-style:solid}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--outline:not(:hover){--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card:not(.pc_upload__list__item--outline){--ptc-upload-border: var(--pt-alpha-gray-0);background-color:var(--pt-alpha-gray-0)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--done:hover,.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--error:hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image{position:relative;aspect-ratio:1/1;border-width:1px;border-style:solid;padding:var(--pt-dimension-100, 2px);min-height:var(--ptc-upload-item-height);height:var(--ptc-upload-item-height);max-height:var(--ptc-upload-item-height);border-radius:var(--ptc-upload-item-roundness);border-color:var(--ptc-upload-border)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__image{border-radius:var(--ptc-upload-image-roundness)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image.pc_upload__list__item--waiting{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__progress{position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);inset-inline-start:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);bottom:var(--pt-dimension-0, 0px);width:100%;height:100%}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__cancel{visibility:hidden;position:absolute;inset-inline-end:calc(var(--pt-dimension-600, 12px) * -1);top:calc(var(--pt-dimension-600, 12px) * -1);z-index:1;border-radius:var(--pt-roundness-full, 88px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image:hover .pc_upload__list__item__cancel{visibility:visible}\n";
-export const addUploadCss = () => addCssToHead(`${prefix}s-upload`, cssText);
-export const uploadCss = cssText;
+const uploadId = `${prefix}s-upload`;
+const addUploadCss = () => addCssToHead(uploadId, cssText);
+const removeUploadCss = () => removeCssFromHead(uploadId);
+const uploadCss = cssText;
+export { uploadId, addUploadCss, removeUploadCss, uploadCss };

package/dist/upload.umd.cjs

@@ -1,7 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const { addCssToHead, prefix } = require("@pantograph/tokens");
+const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
 const cssText = ".pc_upload__list{width:100%}.pc_upload__list.pc_upload__list--card{display:flex;flex-direction:column;gap:var(--pt-dimension-200, 4px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list.pc_upload__list--image{display:flex;flex-wrap:wrap;gap:var(--pt-dimension-300, 6px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--md{--ptc-upload-item-gap: var(--pt-dimension-200);--ptc-upload-item-padding: var(--pt-dimension-200);--ptc-upload-item-roundness: var(--pt-roundness-md);--ptc-upload-image-roundness: var(--pt-roundness-sm);--ptc-upload-item-height: var(--pt-size-md)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--lg{--ptc-upload-item-gap: var(--pt-dimension-300);--ptc-upload-item-padding: var(--pt-dimension-400);--ptc-upload-item-roundness: var(--pt-roundness-lg);--ptc-upload-image-roundness: var(--pt-roundness-md);--ptc-upload-item-height: var(--pt-size-lg)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--xlg{--ptc-upload-item-gap: var(--pt-dimension-300);--ptc-upload-item-padding: var(--pt-dimension-400);--ptc-upload-item-roundness: var(--pt-roundness-lg);--ptc-upload-image-roundness: var(--pt-roundness-md);--ptc-upload-item-height: var(--pt-size-xlg)}.pc_upload__list .pc_upload__list__item:not(.pc_upload__list__item--paused):not(.pc_upload__list__item--error){--ptc-upload-border: rgba(var(--pt-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--paused{--ptc-upload-border: rgba(var(--pt-warning-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--error{--ptc-upload-border: rgba(var(--pt-danger-br))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card{box-sizing:border-box;width:100%;display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;gap:var(--ptc-upload-item-gap);padding:var(--ptc-upload-item-padding);border-radius:var(--ptc-upload-item-roundness);min-height:var(--ptc-upload-item-height);height:var(--ptc-upload-item-height);max-height:var(--ptc-upload-item-height);border-color:var(--ptc-upload-border)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__thumb{aspect-ratio:1/1;height:100%;object-fit:cover}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__progress{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--md .pc_upload__list__item__content{display:flex;gap:var(--pt-dimension-200, 4px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card:not(.pc_upload__list__item--md) .pc_upload__list__item__content{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content .pc_upload__list__item__title{flex:1 1 0%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;--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_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__content .pc_upload__list__item__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));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_upload__list .pc_upload__list__item.pc_upload__list__item--card .pc_upload__list__item__percent{overflow:clip}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--outline{border-width:1px;border-style:solid}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--outline:not(:hover){--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card:not(.pc_upload__list__item--outline){--ptc-upload-border: var(--pt-alpha-gray-0);background-color:var(--pt-alpha-gray-0)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--done:hover,.pc_upload__list .pc_upload__list__item.pc_upload__list__item--card.pc_upload__list__item--error:hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image{position:relative;aspect-ratio:1/1;border-width:1px;border-style:solid;padding:var(--pt-dimension-100, 2px);min-height:var(--ptc-upload-item-height);height:var(--ptc-upload-item-height);max-height:var(--ptc-upload-item-height);border-radius:var(--ptc-upload-item-roundness);border-color:var(--ptc-upload-border)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__image{border-radius:var(--ptc-upload-image-roundness)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image.pc_upload__list__item--waiting{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__progress{position:absolute;inset-inline-end:var(--pt-dimension-0, 0px);inset-inline-start:var(--pt-dimension-0, 0px);top:var(--pt-dimension-0, 0px);bottom:var(--pt-dimension-0, 0px);width:100%;height:100%}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image .pc_upload__list__item__cancel{visibility:hidden;position:absolute;inset-inline-end:calc(var(--pt-dimension-600, 12px) * -1);top:calc(var(--pt-dimension-600, 12px) * -1);z-index:1;border-radius:var(--pt-roundness-full, 88px)}.pc_upload__list .pc_upload__list__item.pc_upload__list__item--image:hover .pc_upload__list__item__cancel{visibility:visible}\n";
-const addUploadCss = () => addCssToHead(`${prefix}s-upload`, cssText);
+const uploadId = `${prefix}s-upload`;
+const addUploadCss = () => addCssToHead(uploadId, cssText);
+const removeUploadCss = () => removeCssFromHead(uploadId);
+const uploadCss = cssText;
+exports.uploadId = uploadId;
 exports.addUploadCss = addUploadCss;
-exports.uploadCss = cssText;
+exports.removeUploadCss = removeUploadCss;
+exports.uploadCss = uploadCss;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pantograph/styles",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "id": "styles",
   "private": false,
   "publishConfig": {
@@ -9,9 +9,8 @@
   "scripts": {
     "build": "vite build",
     "dev": "vite build --watch",
-    "lint": "stylelint '**/*.{css,less}'",
     "release": "node ../../scripts/release.cjs",
-    "style-format": "npx prettier --write \"**/*.{css,scss,sass,less}\""
+    "format": "npx prettier --write \"**/*.less\""
   },
   "type": "module",
   "exports": {
@@ -33,7 +32,8 @@
     "@pantograph/tokens": "^1.0.9"
   },
   "devDependencies": {
+    "tippy.js": "^6.3.7",
     "eslint-config-custom": "*",
     "@pantograph/unocss-preset": "*"
   }
-}
+}

package/dist/form.d.ts

@@ -1,4 +0,0 @@
-declare const cssText: string;
-declare const addFormCss: () => void;
-declare const formCss: string;
-export { addFormCss, formCss };

package/dist/go_group.d.ts

@@ -1,4 +0,0 @@
-declare const cssText: string;
-declare const addGoGroupCss: () => void;
-declare const goGroupCss: string;
-export { addGoGroupCss, goGroupCss };

package/dist/radio.d.ts

@@ -1,4 +0,0 @@
-declare const cssText: string;
-declare const addRadioCss: () => void;
-declare const radioCss: string;
-export { addRadioCss, radioCss };

package/dist/sortPlaceholder.d.ts

@@ -1,4 +0,0 @@
-declare const cssText: string;
-declare const addSortplaceholderCss: () => void;
-declare const sortPlaceholderCss: string;
-export { addSortplaceholderCss, sortPlaceholderCss };