@pantograph/styles 0.0.17 → 0.0.19
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/accordion.css +1 -1
- package/dist/accordion.js +1 -1
- package/dist/accordion.umd.cjs +1 -1
- package/dist/avatar.css +1 -1
- package/dist/avatar.js +1 -1
- package/dist/avatar.umd.cjs +1 -1
- package/dist/breadcrumb.css +1 -1
- package/dist/breadcrumb.js +1 -1
- package/dist/breadcrumb.umd.cjs +1 -1
- package/dist/button.css +1 -1
- package/dist/button.js +1 -1
- package/dist/button.umd.cjs +1 -1
- package/dist/combobox.css +1 -1
- package/dist/combobox.js +1 -1
- package/dist/combobox.umd.cjs +1 -1
- package/dist/comment.css +1 -1
- package/dist/comment.js +1 -1
- package/dist/comment.umd.cjs +1 -1
- package/dist/data_table.css +1 -1
- package/dist/data_table.js +1 -1
- package/dist/data_table.umd.cjs +1 -1
- package/dist/icon.css +1 -1
- package/dist/icon.js +1 -1
- package/dist/icon.umd.cjs +1 -1
- package/dist/image.css +1 -1
- package/dist/image.js +1 -1
- package/dist/image.umd.cjs +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/index.umd.cjs +4 -4
- package/dist/list_view.css +1 -0
- package/dist/list_view.d.ts +5 -0
- package/dist/list_view.js +7 -0
- package/dist/list_view.umd.cjs +12 -0
- package/dist/menu_item.css +1 -1
- package/dist/menu_item.js +1 -1
- package/dist/menu_item.umd.cjs +1 -1
- package/dist/progress.css +1 -1
- package/dist/progress.js +1 -1
- package/dist/progress.umd.cjs +1 -1
- package/dist/tabs.css +1 -1
- package/dist/tabs.js +1 -1
- package/dist/tabs.umd.cjs +1 -1
- package/dist/tbody.css +1 -1
- package/dist/tbody.js +1 -1
- package/dist/tbody.umd.cjs +1 -1
- package/dist/tcell.css +1 -1
- package/dist/tcell.js +1 -1
- package/dist/tcell.umd.cjs +1 -1
- package/dist/textarea.css +1 -1
- package/dist/textarea.js +1 -1
- package/dist/textarea.umd.cjs +1 -1
- package/dist/thead.css +1 -1
- package/dist/thead.js +1 -1
- package/dist/thead.umd.cjs +1 -1
- package/dist/tree.css +1 -1
- package/dist/tree.js +1 -1
- package/dist/tree.umd.cjs +1 -1
- package/package.json +2 -2
- package/dist/spinner.css +0 -1
- package/dist/spinner.d.ts +0 -5
- package/dist/spinner.js +0 -7
- package/dist/spinner.umd.cjs +0 -12
package/dist/accordion.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pc_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;
|
|
1
|
+
.pc_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-expand-size: var(--pt-size-2xsm);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-expand-size: var(--pt-size-xsm);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-expand-size: var(--pt-size-sm);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);width:var(--ptc-accordion-expand-size);height:var(--ptc-accordion-expand-size);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);outline:0;height:var(--ptc-accordion-header-h);min-height:var(--ptc-accordion-header-h);padding:var(--ptc-accordion-header-py) var(--ptc-accordion-header-px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header:hover{--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header: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_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;flex:1 1 0%;width:calc(100% - calc(var(--ptc-accordion-header-px) * 2) - var(--ptc-accordion-header-gap) - var(--ptc-accordion-expand-size))}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper .pc_accordion__item__header__content{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__leading{height:100%;display:flex;align-items:center;justify-content:center}.pc_accordion .pc_accordion__item .pc_accordion__item__header:disabled .pc_accordion__item__expand{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__content{box-sizing:border-box}.pc_accordion .pc_accordion__item .pc_accordion__item__content .pc_accordion__item__content__wrapper{padding:var(--ptc-accordion-content-p)}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=closed]{animation:slideUp .3s ease both}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=open]{animation:slideDown .3s ease both}.pc_accordion .pc_accordion__item__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes slideDown{0%{height:0;opacity:0}to{height:var(--reka-accordion-content-height);opacity:1}}@keyframes slideUp{0%{height:var(--reka-accordion-content-height);opacity:1}to{height:0;opacity:0}}
|
package/dist/accordion.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
|
|
2
|
-
const cssText = ".pc_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;
|
|
2
|
+
const cssText = ".pc_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-expand-size: var(--pt-size-2xsm);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-expand-size: var(--pt-size-xsm);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-expand-size: var(--pt-size-sm);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);width:var(--ptc-accordion-expand-size);height:var(--ptc-accordion-expand-size);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);outline:0;height:var(--ptc-accordion-header-h);min-height:var(--ptc-accordion-header-h);padding:var(--ptc-accordion-header-py) var(--ptc-accordion-header-px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header:hover{--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header: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_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;flex:1 1 0%;width:calc(100% - calc(var(--ptc-accordion-header-px) * 2) - var(--ptc-accordion-header-gap) - var(--ptc-accordion-expand-size))}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper .pc_accordion__item__header__content{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__leading{height:100%;display:flex;align-items:center;justify-content:center}.pc_accordion .pc_accordion__item .pc_accordion__item__header:disabled .pc_accordion__item__expand{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__content{box-sizing:border-box}.pc_accordion .pc_accordion__item .pc_accordion__item__content .pc_accordion__item__content__wrapper{padding:var(--ptc-accordion-content-p)}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=closed]{animation:slideUp .3s ease both}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=open]{animation:slideDown .3s ease both}.pc_accordion .pc_accordion__item__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes slideDown{0%{height:0;opacity:0}to{height:var(--reka-accordion-content-height);opacity:1}}@keyframes slideUp{0%{height:var(--reka-accordion-content-height);opacity:1}to{height:0;opacity:0}}\n";
|
|
3
3
|
const accordionId = `${prefix}s-accordion`;
|
|
4
4
|
const addAccordionCss = () => addCssToHead(accordionId, cssText);
|
|
5
5
|
const removeAccordionCss = () => removeCssFromHead(accordionId);
|
package/dist/accordion.umd.cjs
CHANGED
|
@@ -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_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;
|
|
4
|
+
const cssText = ".pc_accordion{width:100%;display:flex;flex-direction:column;gap:var(--ptc-accordion-gap)}.pc_accordion.pc_accordion--sm{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-sm);--ptc-accordion-header-gap: var(--pt-dimension-100);--ptc-accordion-header-px: var(--pt-dimension-200);--ptc-accordion-header-py: var(--pt-dimension-100);--ptc-accordion-content-p: var(--pt-dimension-200);--ptc-accordion-expand-size: var(--pt-size-2xsm);--ptc-accordion-header-h: var(--pt-size-sm)}.pc_accordion.pc_accordion--sm .pc_accordion__item__title{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_accordion.pc_accordion--md{--ptc-accordion-gap: var(--pt-dimension-200);--ptc-accordion-roundness: var(--pt-roundness-md);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-300);--ptc-accordion-header-py: var(--pt-dimension-200);--ptc-accordion-content-p: var(--pt-dimension-300);--ptc-accordion-expand-size: var(--pt-size-xsm);--ptc-accordion-header-h: var(--pt-size-md)}.pc_accordion.pc_accordion--md .pc_accordion__item__title{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_accordion.pc_accordion--lg{--ptc-accordion-gap: var(--pt-dimension-300);--ptc-accordion-roundness: var(--pt-roundness-lg);--ptc-accordion-header-gap: var(--pt-dimension-200);--ptc-accordion-header-px: var(--pt-dimension-400);--ptc-accordion-header-py: var(--pt-dimension-400);--ptc-accordion-content-p: var(--pt-dimension-400);--ptc-accordion-expand-size: var(--pt-size-sm);--ptc-accordion-header-h: var(--pt-size-lg)}.pc_accordion.pc_accordion--lg .pc_accordion__item__title{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_accordion.pc_accordion--bordered .pc_accordion__item{border-width:1px;border-style:solid;border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=closed] .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open]:not(:hover) .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-secondary),var(--ptu-bg-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item[data-state=open] .pc_accordion__item__header{border-top-left-radius:var(--ptc-accordion-roundness);border-top-right-radius:var(--ptc-accordion-roundness)}.pc_accordion.pc_accordion--bordered .pc_accordion__item:not(:hover){--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity))}.pc_accordion.pc_accordion--bordered .pc_accordion__item:hover{--ptu-border-opacity:1;border-color:rgba(var(--pt-br-target),var(--ptu-border-opacity))}.pc_accordion:not(.pc_accordion--bordered) .pc_accordion__item__header{border-radius:var(--ptc-accordion-roundness)}.pc_accordion .pc_accordion__item{box-sizing:border-box;width:100%;display:flex;flex-direction:column}.pc_accordion .pc_accordion__item:hover .pc_accordion__item__header{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand{box-sizing:border-box;border-radius:var(--pt-roundness-sm, 4px);width:var(--ptc-accordion-expand-size);height:var(--ptc-accordion-expand-size);outline:0}.pc_accordion .pc_accordion__item .pc_accordion__item__expand>*{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_accordion .pc_accordion__item .pc_accordion__item__expand:not(:disabled):hover{--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg-target),var(--ptu-bg-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__expand:not(: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_accordion .pc_accordion__item .pc_accordion__item__expand:disabled{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item[data-state=open] .pc_accordion__item__expand>*{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-180deg;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_accordion .pc_accordion__item .pc_accordion__item__header{box-sizing:border-box;width:100%;display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);outline:0;height:var(--ptc-accordion-header-h);min-height:var(--ptc-accordion-header-h);padding:var(--ptc-accordion-header-py) var(--ptc-accordion-header-px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header:hover{--ptu-text-opacity:1;color:rgba(var(--pt-fg-target),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__header: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_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;flex:1 1 0%;width:calc(100% - calc(var(--ptc-accordion-header-px) * 2) - var(--ptc-accordion-header-gap) - var(--ptc-accordion-expand-size))}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__header__wrapper .pc_accordion__item__header__content{display:flex;align-items:center;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;gap:var(--ptc-accordion-header-gap);box-sizing:border-box;height:100%;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_accordion .pc_accordion__item .pc_accordion__item__header .pc_accordion__item__leading{height:100%;display:flex;align-items:center;justify-content:center}.pc_accordion .pc_accordion__item .pc_accordion__item__header:disabled .pc_accordion__item__expand{--ptu-text-opacity:1;color:rgba(var(--pt-disable-fg),var(--ptu-text-opacity))}.pc_accordion .pc_accordion__item .pc_accordion__item__content{box-sizing:border-box}.pc_accordion .pc_accordion__item .pc_accordion__item__content .pc_accordion__item__content__wrapper{padding:var(--ptc-accordion-content-p)}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=closed]{animation:slideUp .3s ease both}.pc_accordion .pc_accordion__item .pc_accordion__item__content:not([data-opened])[data-state=open]{animation:slideDown .3s ease both}.pc_accordion .pc_accordion__item__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes slideDown{0%{height:0;opacity:0}to{height:var(--reka-accordion-content-height);opacity:1}}@keyframes slideUp{0%{height:var(--reka-accordion-content-height);opacity:1}to{height:0;opacity:0}}\n";
|
|
5
5
|
const accordionId = `${prefix}s-accordion`;
|
|
6
6
|
const addAccordionCss = () => addCssToHead(accordionId, cssText);
|
|
7
7
|
const removeAccordionCss = () => removeCssFromHead(accordionId);
|
package/dist/avatar.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pc_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}
|
|
1
|
+
.pc_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--truncate{cursor:pointer}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}
|
package/dist/avatar.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
|
|
2
|
-
const cssText = ".pc_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}\n";
|
|
2
|
+
const cssText = ".pc_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--truncate{cursor:pointer}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}\n";
|
|
3
3
|
const avatarId = `${prefix}s-avatar`;
|
|
4
4
|
const addAvatarCss = () => addCssToHead(avatarId, cssText);
|
|
5
5
|
const removeAvatarCss = () => removeCssFromHead(avatarId);
|
package/dist/avatar.umd.cjs
CHANGED
|
@@ -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_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}\n";
|
|
4
|
+
const cssText = ".pc_avatar{position:relative;box-sizing:border-box;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center;--ptu-bg-opacity:1;background-color:rgba(var(--pt-gray-1),var(--ptu-bg-opacity));--ptu-text-opacity:1;color:rgba(var(--pt-gray-6),var(--ptu-text-opacity))}.pc_avatar.pc_avatar--truncate{cursor:pointer}.pc_avatar.pc_avatar--2xsm{width:var(--pt-dimension-800, 16px);height:var(--pt-dimension-800, 16px);min-width:var(--pt-dimension-800, 16px);max-width:var(--pt-dimension-800, 16px);min-height:var(--pt-dimension-800, 16px);max-height:var(--pt-dimension-800, 16px)}.pc_avatar.pc_avatar--xsm{width:var(--pt-dimension-1000, 20px);height:var(--pt-dimension-1000, 20px);min-width:var(--pt-dimension-1000, 20px);max-width:var(--pt-dimension-1000, 20px);min-height:var(--pt-dimension-1000, 20px);max-height:var(--pt-dimension-1000, 20px)}.pc_avatar.pc_avatar--sm{width:var(--pt-dimension-1200, 24px);height:var(--pt-dimension-1200, 24px);min-width:var(--pt-dimension-1200, 24px);max-width:var(--pt-dimension-1200, 24px);min-height:var(--pt-dimension-1200, 24px);max-height:var(--pt-dimension-1200, 24px)}.pc_avatar.pc_avatar--md{width:var(--pt-dimension-1600, 32px);height:var(--pt-dimension-1600, 32px);min-width:var(--pt-dimension-1600, 32px);max-width:var(--pt-dimension-1600, 32px);min-height:var(--pt-dimension-1600, 32px);max-height:var(--pt-dimension-1600, 32px)}.pc_avatar.pc_avatar--lg{width:var(--pt-dimension-2000, 40px);height:var(--pt-dimension-2000, 40px);min-width:var(--pt-dimension-2000, 40px);max-width:var(--pt-dimension-2000, 40px);min-height:var(--pt-dimension-2000, 40px);max-height:var(--pt-dimension-2000, 40px)}.pc_avatar.pc_avatar--xlg{width:var(--pt-dimension-2400, 48px);height:var(--pt-dimension-2400, 48px);min-width:var(--pt-dimension-2400, 48px);max-width:var(--pt-dimension-2400, 48px);min-height:var(--pt-dimension-2400, 48px);max-height:var(--pt-dimension-2400, 48px)}.pc_avatar.pc_avatar--2xsm,.pc_avatar.pc_avatar--xsm,.pc_avatar.pc_avatar--sm{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_avatar.pc_avatar--md,.pc_avatar.pc_avatar--lg,.pc_avatar.pc_avatar--xlg{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_avatar .pc_avatar__image,.pc_avatar .pc_avatar__fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pc_avatar.pc_avatar--circle,.pc_avatar.pc_avatar--circle .pc_avatar__image,.pc_avatar.pc_avatar--circle .pc_avatar__fallback{border-radius:var(--pt-roundness-full, 88px)}.pc_avatar.pc_avatar--square,.pc_avatar.pc_avatar--square .pc_avatar__image,.pc_avatar.pc_avatar--square .pc_avatar__fallback{border-radius:var(--pt-roundness-sm, 4px)}.pc_avatar.pc_avatar--rect,.pc_avatar.pc_avatar--rect .pc_avatar__image,.pc_avatar.pc_avatar--rect .pc_avatar__fallback{border-radius:var(--pt-roundness-zero, 0px)}.pc_avatar .pc_avatar__image{aspect-ratio:1/1;object-fit:cover}.pc_avatar .pc_avatar__online{position:absolute;bottom:var(--pt-dimension-0, 0px);z-index:1;--ptu-outline-color-opacity:1;outline-color:rgba(var(--pt-gray-0),var(--ptu-outline-color-opacity));outline-style:solid}.pc_avatar--online-start .pc_avatar__online{inset-inline-start:var(--pt-dimension-0, 0px)}.pc_avatar--online-end .pc_avatar__online{inset-inline-end:var(--pt-dimension-0, 0px)}.pc_avatar.pc_avatar--red{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-red-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--orange{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-orange-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--blue{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-blue-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--lime{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-lime-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--green{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-green-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--cyan{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-cyan-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--sky{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-sky-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--violet{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-violet-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--pink{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-pink-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--teal{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-teal-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amber{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amber-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--fuchsia{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-fuchsia-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--amethyst{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-amethyst-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--mallard{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-mallard-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--ocean{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-ocean-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--primary{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-primary-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-5),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--white{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-0),var(--ptu-border-opacity))}.pc_avatar.pc_avatar--gray-subtle{border-width:var(--pt-stroke-10, 1px);border-style:solid;--ptu-border-opacity:1;border-color:rgba(var(--pt-gray-2),var(--ptu-border-opacity))}.pc_avatar__group{width:fit-content;display:flex;align-items:center}.pc_avatar__group.pc_avatar__group--gutter{gap:var(--pt-dimension-200, 4px)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child){z-index:1}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--sm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xsm,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--2xsm{margin-inline-start:calc(var(--pt-dimension-500, 10px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--md{margin-inline-start:calc(var(--pt-dimension-600, 12px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--lg,.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:not(:first-child).pc_avatar--xlg{margin-inline-start:calc(var(--pt-dimension-700, 14px) * -1)}.pc_avatar__group:not(.pc_avatar__group--gutter) .pc_avatar:first-child{border-width:var(--pt-stroke-0, 0px)}\n";
|
|
5
5
|
const avatarId = `${prefix}s-avatar`;
|
|
6
6
|
const addAvatarCss = () => addCssToHead(avatarId, cssText);
|
|
7
7
|
const removeAvatarCss = () => removeCssFromHead(avatarId);
|
package/dist/breadcrumb.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.pc_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}
|
|
1
|
+
.pc_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{outline:0;box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}
|
package/dist/breadcrumb.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
|
|
2
|
-
const cssText = ".pc_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}\n";
|
|
2
|
+
const cssText = ".pc_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{outline:0;box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}\n";
|
|
3
3
|
const breadcrumbId = `${prefix}s-breadcrumb`;
|
|
4
4
|
const addBreadcrumbCss = () => addCssToHead(breadcrumbId, cssText);
|
|
5
5
|
const removeBreadcrumbCss = () => removeCssFromHead(breadcrumbId);
|
package/dist/breadcrumb.umd.cjs
CHANGED
|
@@ -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_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}\n";
|
|
4
|
+
const cssText = ".pc_breadcrumb{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb.pc_breadcrumb--md{--ptc-breadcrumb-h: var(--pt-size-md);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--md .pc_breadcrumb__item__title{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_breadcrumb.pc_breadcrumb--lg{--ptc-breadcrumb-h: var(--pt-size-lg);--ptc-breadcrumb-content-min-h: var(--pt-dimension-1400)}.pc_breadcrumb.pc_breadcrumb--lg .pc_breadcrumb__item__title{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_breadcrumb .pc_breadcrumb__list{margin:var(--pt-dimension-0, 0px);box-sizing:border-box;display:inline-flex;align-items:center;padding:var(--pt-dimension-0, 0px)}.pc_breadcrumb .pc_breadcrumb__item{box-sizing:border-box;display:inline-flex;align-items:center;gap:var(--pt-dimension-200, 4px);text-decoration:none;height:var(--ptc-breadcrumb-h);min-height:var(--ptc-breadcrumb-h);max-height:var(--ptc-breadcrumb-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content{outline:0;box-sizing:border-box;display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:var(--pt-dimension-200, 4px);border-radius:var(--pt-roundness-lg, 8px);outline-width:var(--pt-stroke-0, 0px);min-height:var(--ptc-breadcrumb-content-min-h);height:var(--ptc-breadcrumb-content-min-h)}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__title{box-sizing:border-box;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_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__content .pc_breadcrumb__item__leading{box-sizing:border-box;display:inline-flex;align-items:center}.pc_breadcrumb .pc_breadcrumb__item .pc_breadcrumb__item__separator{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content{height:var(--pt-size-md, 32px);gap:var(--pt-dimension-200, 4px);padding-left:var(--pt-dimension-200, 4px);padding-right:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item.pc_breadcrumb__item--current .pc_breadcrumb__item__content .pc_breadcrumb__item__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current){padding-inline-end:var(--pt-dimension-200, 4px);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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content{padding:var(--pt-dimension-200, 4px)}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content:not(:hover){--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity))}.pc_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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_breadcrumb .pc_breadcrumb__item:not(.pc_breadcrumb__item--current) .pc_breadcrumb__item__content: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)}\n";
|
|
5
5
|
const breadcrumbId = `${prefix}s-breadcrumb`;
|
|
6
6
|
const addBreadcrumbCss = () => addCssToHead(breadcrumbId, cssText);
|
|
7
7
|
const removeBreadcrumbCss = () => removeCssFromHead(breadcrumbId);
|