@elcrm/components 0.0.3 → 0.1.1

package/dist/index.css

@@ -1,35 +1,49 @@
-@layer elcrm-components{.car{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border-radius:var(--avatar-radius);border:var(--avatar-border);background:var(--avatar-background);color:var(--avatar-color);font-weight:var(--avatar-font-weight);line-height:1;-webkit-user-select:none;user-select:none;vertical-align:middle}.car:is(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;font:inherit;font-weight:var(--avatar-font-weight);cursor:pointer}.cas{width:var(--avatar-size-s);height:var(--avatar-size-s);font-size:var(--avatar-font-size-s)}.cam{width:var(--avatar-size-m);height:var(--avatar-size-m);font-size:var(--avatar-font-size-m)}.cal{width:var(--avatar-size-l);height:var(--avatar-size-l);font-size:var(--avatar-font-size-l)}.caa,.car[data-active=true]{outline:var(--avatar-outline-active);outline-offset:var(--avatar-outline-offset)}.cai{width:100%;height:100%;object-fit:cover;display:block}}
+@layer elcrm-components{.car{position:relative;box-sizing:border-box;display:inline-flex;flex-shrink:0;width:fit-content;height:fit-content;border-radius:var(--avatar-radius);-webkit-user-select:none;user-select:none;vertical-align:middle}.car:is(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;font:inherit;cursor:pointer;background:transparent;border:none}.cav{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;width:100%;height:100%;border-radius:inherit;border:var(--avatar-border);background:var(--avatar-background);color:var(--avatar-color);font-weight:var(--avatar-font-weight);line-height:1}.cas{width:var(--avatar-size-s);height:var(--avatar-size-s);font-size:var(--avatar-font-size-s)}.cas .cav{font-size:inherit}.cam{width:var(--avatar-size-m);height:var(--avatar-size-m);font-size:var(--avatar-font-size-m)}.cam .cav{font-size:inherit}.cal{width:var(--avatar-size-l);height:var(--avatar-size-l);font-size:var(--avatar-font-size-l)}.cal .cav{font-size:inherit}.caa .cav,.car[data-active=true] .cav{outline:var(--avatar-outline-active);outline-offset:var(--avatar-outline-offset)}.cai{width:100%;height:100%;object-fit:cover;display:block}.cab{position:absolute;right:0;bottom:0;box-sizing:border-box;width:var(--shell-status-size);height:var(--shell-status-size);border-radius:50%;border:2px solid var(--shell-background);pointer-events:none}.cas .cab{width:8px;height:8px}.cam .cab{width:var(--shell-status-size);height:var(--shell-status-size)}.cal .cab{width:12px;height:12px}.cao{background:var(--shell-color-success)}.caf{background:var(--shell-color-muted)}}
 
-@layer elcrm-components{.cjr{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:var(--badge-padding);border-radius:var(--badge-radius);border:var(--badge-border);font-size:var(--badge-font-size);font-weight:var(--badge-font-weight);line-height:1;white-space:nowrap}.cjn{background:var(--badge-neutral-background);color:var(--badge-neutral-color)}.cja{background:var(--badge-accent-background);color:var(--badge-accent-color)}.cju{background:var(--badge-success-background);color:var(--badge-success-color)}.cjw{background:var(--badge-warning-background);color:var(--badge-warning-color)}.cjd{background:var(--badge-danger-background);color:var(--badge-danger-color)}}
+@layer elcrm-components{.cyr{display:inline-flex;align-items:center;vertical-align:middle}.cyi{position:relative;margin-left:var(--avatar-group-overlap);box-shadow:0 0 0 var(--avatar-group-ring) var(--shell-background);border-radius:var(--avatar-radius)}.cyi:first-child{margin-left:0}.cyo,.cyd{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:var(--avatar-group-overlap);border-radius:var(--avatar-radius);font-weight:var(--avatar-font-weight);line-height:1;-webkit-user-select:none;user-select:none}.cyo{z-index:20;color:var(--shell-color-muted);background:var(--shell-background-muted);border:1px solid var(--shell-border);box-shadow:0 0 0 var(--avatar-group-ring) var(--shell-background)}.cyd{z-index:21;margin-left:var(--shell-gap-sm);color:var(--shell-color-muted);background:var(--shell-background);border:1px dashed var(--shell-border);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;font:inherit;font-weight:var(--avatar-font-weight)}.cyd:hover{background:var(--shell-background-hover)}.cys{width:var(--avatar-size-s);height:var(--avatar-size-s);font-size:var(--avatar-font-size-s)}.cym{width:var(--avatar-size-m);height:var(--avatar-size-m);font-size:var(--avatar-font-size-m)}.cyl{width:var(--avatar-size-l);height:var(--avatar-size-l);font-size:var(--avatar-font-size-l)}}
 
-@layer elcrm-components{.cbr{display:flex;flex-direction:column;gap:var(--block-gap);padding:var(--block-padding)}.cbh{flex-direction:row;flex-wrap:wrap;align-items:center}}
+@layer elcrm-components{.czr{display:inline-flex;align-items:center;gap:var(--shell-gap);max-width:100%;text-align:left;vertical-align:middle}.czr:is(button,a){-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;border:none;background:transparent;font:inherit;color:inherit;cursor:pointer;text-decoration:none}.czc{display:flex;flex-direction:column;gap:2px;min-width:0}.czt{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.czd{margin:0;font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color-muted);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.czs{gap:var(--shell-gap-sm)}.czs .czt{font-size:var(--shell-font-size-sm)}.czm{gap:var(--shell-gap)}.czl{gap:var(--shell-gap-lg)}.czl .czt{font-size:var(--shell-font-size-lg)}.czl .czd{font-size:var(--shell-font-size)}}
 
-@layer elcrm-components{.cnr{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;border:0;background:transparent;font:inherit;font-weight:var(--brand-font-weight);letter-spacing:var(--brand-letter-spacing);color:var(--brand-color);white-space:nowrap;cursor:pointer;text-decoration:none}.cnr:hover{color:var(--brand-color-hover)}}
+@layer elcrm-components{.cjr{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;padding:.2rem .5rem;border-radius:999px;border:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);line-height:1;white-space:nowrap}.cjn{background:var(--shell-background-hover);color:var(--shell-color)}.cja{background:color-mix(in srgb,var(--shell-color-accent) 16%,transparent);color:var(--shell-color-accent)}.cju{background:color-mix(in srgb,var(--shell-color-success) 16%,transparent);color:var(--shell-color-success)}.cjw{background:color-mix(in srgb,var(--shell-color-warning) 16%,transparent);color:var(--shell-color-warning)}.cjd{background:color-mix(in srgb,var(--shell-color-danger) 16%,transparent);color:var(--shell-color-danger)}}
 
-@layer elcrm-components{.cdr{background:var(--card-background);border:1px solid var(--card-border);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--card-shadow)}.cdt{margin:0 0 .5rem;font-size:1.125rem;font-weight:600}}
+@layer elcrm-components{.cnr{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;border:0;background:transparent;font:inherit;font-weight:700;letter-spacing:.02em;color:var(--shell-color);white-space:nowrap;cursor:pointer;text-decoration:none}.cnr:hover{color:var(--shell-color-accent)}}
 
-@layer elcrm-components{.cor{display:flex;flex-direction:column;gap:var(--column-gap)}}
+@layer elcrm-components{.c0r{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm);list-style:none;margin:0;padding:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-muted);line-height:1.3}.c0i{display:inline-flex;align-items:center;gap:var(--shell-gap-sm);min-width:0;color:inherit}.c0i:is(a,button){-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;border:none;background:transparent;font:inherit;font-weight:inherit;color:inherit;cursor:pointer;text-decoration:none}.c0i:is(a,button):hover{color:var(--shell-color)}.c0c,.c0i[aria-current=page]{color:var(--shell-color-accent);cursor:default}.c0n{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-icon-size);height:var(--shell-icon-size);overflow:hidden;border-radius:calc(var(--shell-radius) * .5);color:inherit}.c0n img{width:100%;height:100%;object-fit:cover;display:block}.c0l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.c0d{display:inline-flex;flex-shrink:0;width:.75rem;height:.75rem;color:var(--shell-color-muted)}.c0s{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;color:var(--shell-color-muted);-webkit-user-select:none;user-select:none}.c0v{width:.75rem;height:.75rem;display:block}.c0e{display:inline-flex;align-items:center;justify-content:center;min-width:1em;color:var(--shell-color-muted);letter-spacing:.05em}.c0e:is(button){-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:.15rem .35rem;border:none;border-radius:calc(var(--shell-radius) * .4);background:transparent;font:inherit;color:inherit;cursor:pointer}.c0e:is(button):hover{background:var(--shell-background-hover);color:var(--shell-color)}}
 
-@layer elcrm-components{.cpr{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--empty-state-gap);padding:var(--empty-state-padding);text-align:center;color:var(--empty-state-color)}.cpi{display:flex;margin-bottom:var(--empty-state-icon-gap);color:var(--empty-state-icon-color)}.cpt{margin:0;font-size:var(--empty-state-title-size);font-weight:600;color:var(--empty-state-title-color);line-height:1.3}.cpd{margin:0;max-width:var(--empty-state-max-width);font-size:var(--empty-state-description-size);color:var(--empty-state-description-color);line-height:1.45}.cpa{display:flex;flex-wrap:wrap;gap:var(--empty-state-actions-gap);justify-content:center;margin-top:var(--empty-state-actions-margin-top)}}
+@layer elcrm-components{.cdr{background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);padding:var(--shell-padding);box-shadow:var(--shell-shadow)}.cdt{margin:0 0 var(--shell-gap-sm);font-size:var(--shell-font-size-lg);font-weight:var(--shell-font-weight);color:var(--shell-color)}}
 
-@layer elcrm-components{.cfr{padding:var(--footer-padding);color:var(--footer-color);background:var(--footer-background);border-top:1px solid var(--footer-border);font-size:var(--footer-font-size)}}
+@layer elcrm-components{.crr{position:relative;display:inline-flex;vertical-align:middle}.crt{display:inline-flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:var(--shell-padding);box-sizing:border-box;font:inherit;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.2}.crt:hover{background:var(--shell-background-hover)}.crt[data-open=true]{border-color:var(--shell-color-accent);color:var(--shell-color-accent)}.crc{display:inline-flex;width:var(--shell-icon-size);height:var(--shell-icon-size);flex-shrink:0;color:var(--shell-color-muted)}.crt[data-open=true] .crc{color:var(--shell-color-accent)}.crp{position:absolute;top:calc(100% + var(--shell-gap-sm));z-index:var(--shell-z);min-width:var(--dropdown-min-width);max-width:var(--dropdown-max-width);max-height:var(--dropdown-max-height);overflow:auto;padding:var(--shell-gap-sm);box-sizing:border-box;background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);box-shadow:var(--popup-shadow)}.crp[data-align=start]{left:0}.crp[data-align=end]{right:0}.crh{margin:0;padding:var(--shell-padding);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-muted);line-height:1.3}.crg{display:flex;flex-direction:column;gap:2px}.crd{height:0;margin:var(--shell-gap-sm) 0;border:0;border-top:1px solid var(--shell-border)}.cri{display:flex;align-items:center;gap:var(--shell-gap-sm);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;font-size:var(--shell-font-size);font-weight:500;color:var(--shell-color);background:transparent;border:none;border-radius:calc(var(--shell-radius) * .7);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;line-height:1.35}.cri:hover:not(:disabled),.cri:focus-visible:not(:disabled){background:var(--shell-background-hover);outline:none}.cri[data-checked=true]{background:var(--shell-background-selected)}.cri[data-danger=true]{color:var(--shell-color-danger)}.cri:disabled,.cri[aria-disabled=true]{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.crn,.crk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crk{color:var(--shell-color-accent)}.crl{flex:1;min-width:0}.cru{flex-shrink:0;margin-left:auto;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.crm{display:inline-flex;flex-shrink:0;margin-left:auto;width:var(--shell-icon-size);height:var(--shell-icon-size);color:var(--shell-color-muted)}.crb{display:inline-flex;flex-shrink:0;width:var(--shell-status-size);height:var(--shell-status-size);border-radius:50%}.cro{background:var(--shell-color-success)}.crf{background:var(--shell-color-muted)}.crx{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:var(--shell-check-size);height:var(--shell-check-size);border:1px solid var(--shell-border);border-radius:calc(var(--shell-radius) * .4);background:var(--shell-background);color:#fff}.cry{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.crv{width:70%;height:70%;display:block}}
 
-@layer elcrm-components{.chr{display:flex;align-items:center;gap:var(--header-gap);flex-shrink:0;min-height:var(--header-height);padding:var(--header-padding);color:var(--header-color);background:var(--header-background);border-bottom:1px solid var(--header-border);border-radius:var(--header-radius);box-shadow:var(--header-shadow);margin:var(--header-margin);position:relative;z-index:var(--header-z)}.chb{flex-shrink:0}.chn{display:flex;align-items:center;min-width:0}.chs{flex:1;min-width:0;margin-left:auto;max-width:18rem}.cha{display:flex;align-items:center;gap:.5rem;flex-shrink:0;margin-left:auto}.chs+.cha{margin-left:0}}
+@layer elcrm-components{.cpr{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--shell-gap);padding:var(--shell-padding);text-align:center;color:var(--shell-color-muted)}.cpi{display:flex;margin-bottom:var(--shell-gap-sm);color:var(--shell-color-muted)}.cpt{margin:0;font-size:var(--shell-font-size-lg);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cpd{margin:0;max-width:22rem;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.cpa{display:flex;flex-wrap:wrap;gap:var(--shell-gap-sm);justify-content:center;margin-top:var(--shell-gap)}}
 
-@layer elcrm-components{.cir{display:flex;align-items:center;gap:var(--item-gap);padding:var(--item-padding);color:var(--item-color);background:var(--item-background);border:1px solid var(--item-border);border-radius:var(--item-radius);cursor:default}.cir:is(button,a){-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;text-align:left;width:100%;cursor:pointer}.cir:hover{background:var(--item-background-hover)}.cia,.cir[aria-current=true],.cir[data-active=true]{background:var(--item-background-active)}}
+@layer elcrm-components{.cfr{padding:var(--shell-padding);color:var(--shell-color-muted);background:transparent;border-top:1px solid var(--shell-border);font-size:var(--shell-font-size-sm)}}
 
-@layer elcrm-components{.clr{display:flex;flex-direction:column;flex:1 1 auto;height:100%;min-height:0;max-height:100%;overflow:hidden;background:var(--layout-background);gap:var(--layout-gap)}.clm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}}
+@layer elcrm-components{.chr{display:flex;align-items:center;gap:var(--shell-gap);flex-shrink:0;min-height:var(--header-height);padding:var(--shell-padding);color:var(--shell-color);background:var(--shell-background);border-bottom:1px solid var(--shell-border);border-radius:var(--header-radius);box-shadow:var(--header-shadow);margin:var(--header-margin);position:relative;z-index:var(--header-z)}.chb{flex-shrink:0}.chn{display:flex;align-items:center;min-width:0}.chs{flex:1;min-width:0;margin-left:auto;max-width:18rem}.cha{display:flex;align-items:center;gap:var(--shell-gap-sm);flex-shrink:0;margin-left:auto}.chs+.cha{margin-left:0}}
 
-@layer elcrm-components{.csr{display:flex;flex-direction:column;gap:var(--list-gap);padding:var(--list-padding);margin:0;list-style:none}.csh{flex-direction:row;flex-wrap:wrap}}
+@layer elcrm-components{.cir{display:flex;align-items:center;gap:var(--shell-gap-sm);padding:var(--shell-padding);color:var(--shell-color);background:transparent;border:1px solid transparent;border-radius:var(--shell-radius);cursor:default}.cir:is(button,a){-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;text-align:left;width:100%;cursor:pointer}.cir:hover{background:var(--shell-background-hover)}.cia,.cir[aria-current=true],.cir[data-active=true]{background:var(--shell-background-selected)}}
 
-@layer elcrm-components{.cgr{display:flex;align-items:center;justify-content:center;padding:var(--loading-padding);color:var(--loading-color)}}
+@layer elcrm-components{.clr{display:flex;flex-direction:column;flex:1 1 auto;height:100%;min-height:0;max-height:100%;overflow:hidden;background:var(--shell-background-muted);gap:0}.clm{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0;overflow:hidden}}
 
-@layer elcrm-components{.cmr{display:flex;align-items:center;gap:var(--menu-gap);margin:0;padding:0;list-style:none}.cmv{flex-direction:column;align-items:stretch}.cmi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--menu-item-background);color:var(--menu-item-color);padding:var(--menu-item-padding);border-radius:var(--menu-item-radius);font:inherit;line-height:1;cursor:pointer;text-align:left}.cmi>svg{display:block;flex-shrink:0}.cmi:hover{background:var(--menu-item-background-hover);color:var(--menu-item-color-active)}.cma,.cmi[aria-current=page],.cmi[data-active=true]{background:var(--menu-item-background-active);color:var(--menu-item-color-active)}}
+@layer elcrm-components{.csr{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:0;margin:0;list-style:none}.csh{flex-direction:row;flex-wrap:wrap}}
 
-@layer elcrm-components{.cvr{display:flex;align-items:stretch;gap:var(--nav-sections-gap);width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:var(--nav-sections-padding)}.cvn{display:flex;flex-direction:column;gap:1rem;flex:0 0 var(--nav-sections-nav-width);width:var(--nav-sections-nav-width);min-width:var(--nav-sections-nav-width);box-sizing:border-box}.cvg{display:flex;flex-direction:column;gap:2px;padding-bottom:.75rem;border-bottom:1px solid var(--nav-sections-group-border)}.cvg:last-of-type{border-bottom:none;padding-bottom:0}.cvl{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--nav-sections-label-color);padding:0 10px 6px}.cvi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;border-radius:var(--nav-sections-item-radius);background:transparent;color:var(--nav-sections-item-color);font:inherit;font-size:14px;padding:var(--nav-sections-item-padding);cursor:pointer;position:relative;transition:background .12s ease,color .12s ease}.cvi:hover:not(:disabled){background:var(--nav-sections-item-background-hover)}.cva{background:var(--nav-sections-item-background-active)}.cva:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 2px 2px 0;background:var(--nav-sections-accent)}.cvi:disabled{opacity:.45;cursor:not-allowed}.cvc{display:inline-flex;flex:0 0 auto;color:var(--nav-sections-icon-color);line-height:0}.cva .cvc{color:var(--nav-sections-item-color)}.cvt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cvf{margin-top:auto;padding-top:.75rem;border-top:1px solid var(--nav-sections-footer-border)}.cvm{flex:1 1 auto;min-width:0;max-width:var(--nav-sections-main-max-width);width:100%;min-height:0;overflow:auto;--section-padding: 0}@media (max-width: 720px){.cvr{flex-direction:column}.cvn{flex:none;width:100%;min-width:0;max-width:none}}}
+@layer elcrm-components{.cgr{display:flex;align-items:center;justify-content:center;padding:var(--shell-gap-lg);color:var(--shell-color-muted)}}
 
-@layer elcrm-components{.cwr{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--row-gap)}}
+@layer elcrm-components{.cmr{display:flex;align-items:center;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.cmv{flex-direction:column;align-items:stretch}.cmi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--shell-color-muted);padding:var(--shell-padding);border-radius:var(--shell-radius);font:inherit;line-height:1;cursor:pointer;text-align:left}.cmi>svg{display:block;flex-shrink:0}.cmi:hover{background:var(--shell-background-hover);color:var(--shell-color)}.cma,.cmi[aria-current=page],.cmi[data-active=true]{background:var(--shell-background-selected);color:var(--shell-color)}}
 
-@layer elcrm-components{.cep{display:flex;flex-direction:column;gap:var(--section-gap);padding:var(--section-padding);flex:1;min-width:0}.ceu{box-sizing:border-box;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:var(--section-auth-padding)}.cek{box-sizing:border-box;width:100%;max-width:var(--section-auth-card-max-width);padding:var(--section-auth-card-padding);background:var(--section-auth-card-background);border:1px solid var(--section-auth-card-border);border-radius:var(--section-auth-card-radius);box-shadow:var(--section-auth-card-shadow);display:flex;flex-direction:column;gap:var(--section-gap)}.ceh{display:flex;flex-direction:column;gap:.35rem}.cec{text-align:center;align-items:center}.cei{display:flex;margin-bottom:var(--section-icon-gap)}.cec .cei{justify-content:center}.cet{margin:0;font-size:var(--section-title-size);font-weight:600;letter-spacing:-.02em;color:var(--section-title-color);line-height:1.25}.ced{font-size:var(--section-title-size-md)}.cee{margin:0;font-size:var(--section-description-size);color:var(--section-description-color);line-height:1.45}.ceb{display:flex;flex-direction:column;gap:var(--section-body-gap);width:100%;text-align:left}.ces{display:flex;flex-direction:column;gap:var(--section-actions-gap);width:100%}.cel{display:flex;flex-direction:column;gap:var(--section-gap);margin-bottom:var(--section-block-margin-bottom);padding-bottom:var(--section-block-padding-bottom);border-bottom:1px solid var(--section-block-border)}.cel:last-of-type{margin-bottom:0;padding-bottom:0;border-bottom:none}.cel .cet{font-size:.95rem;font-weight:600}}
+@layer elcrm-components{.cvr{display:flex;align-items:stretch;gap:var(--shell-gap-lg);width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;padding:var(--nav-sections-padding)}.cvn{display:flex;flex-direction:column;gap:var(--shell-gap);flex:0 0 var(--nav-sections-nav-width);width:var(--nav-sections-nav-width);min-width:var(--nav-sections-nav-width);box-sizing:border-box}.cvg{display:flex;flex-direction:column;gap:2px;padding-bottom:var(--shell-gap);border-bottom:1px solid var(--shell-border)}.cvg:last-of-type{border-bottom:none;padding-bottom:0}.cvl{font-size:11px;font-weight:var(--shell-font-weight);letter-spacing:.04em;text-transform:uppercase;color:var(--shell-color-muted);padding:0 var(--shell-padding-inline) var(--shell-gap-sm)}.cvi{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:flex;align-items:center;gap:var(--shell-gap-sm);width:100%;text-align:left;border:none;border-radius:var(--shell-radius);background:transparent;color:var(--shell-color);font:inherit;font-size:var(--shell-font-size-sm);padding:var(--shell-padding);cursor:pointer;position:relative}.cvi:hover:not(:disabled){background:var(--shell-background-hover)}.cva{background:var(--shell-background-selected)}.cva:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:0 2px 2px 0;background:var(--shell-color-accent)}.cvi:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cvc{display:inline-flex;flex:0 0 auto;color:var(--shell-color-muted);line-height:0}.cva .cvc{color:var(--shell-color)}.cvt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cvf{margin-top:auto;padding-top:var(--shell-gap);border-top:1px solid var(--shell-border)}.cvm{flex:1 1 auto;min-width:0;max-width:var(--nav-sections-main-max-width);width:100%;min-height:0;overflow:auto}@media (max-width: 720px){.cvr{flex-direction:column}.cvn{flex:none;width:100%;min-width:0;max-width:none}}}
 
-@layer elcrm-components{.ctr{display:flex;flex-direction:column;gap:var(--tab-sections-gap);width:100%;min-width:0}.ctb{display:flex;align-items:flex-end;gap:1rem;border-bottom:1px solid var(--tab-sections-border);min-width:0}.ctn{display:flex;align-items:stretch;gap:var(--tab-sections-tab-gap);flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin}.ctt{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;margin:0 0 -1px;padding:var(--tab-sections-tab-padding);border:none;border-bottom:2px solid transparent;background:transparent;color:var(--tab-sections-color);font:inherit;font-size:.95rem;font-weight:500;white-space:nowrap;cursor:pointer;transition:color .12s ease,border-color .12s ease}.ctt:hover:not(:disabled){color:var(--tab-sections-color-active)}.cta{color:var(--tab-sections-color-active);border-bottom-color:var(--tab-sections-accent)}.ctt:disabled{opacity:.45;cursor:not-allowed}.cte{display:inline-flex;align-items:center;justify-content:center;min-width:1.15em;height:1.15em;padding:0 .35em;border-radius:999px;background:var(--tab-sections-badge-background);color:var(--tab-sections-badge-color);font-size:var(--tab-sections-badge-size);font-style:normal;font-weight:700;line-height:1}.cts{flex:0 0 auto;display:flex;align-items:center;padding-bottom:.35rem}.ctm{min-width:0;width:100%}}
+@layer elcrm-components{.ccr{margin:0 0 var(--shell-gap-lg)}.ccw{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:var(--shell-gap)}.cct{min-width:0;max-width:36rem}.cch{margin:0;font-size:var(--section-title-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.25}.ccs{margin:var(--shell-gap-sm) 0 0;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.cca{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}}
+
+@layer elcrm-components{.ckr{flex:1 1 auto;min-height:0;height:100%;width:100%;display:flex;flex-direction:column;box-sizing:border-box;padding:var(--shell-padding);overflow:hidden}.ckw{max-width:none}.ckb{flex:1 1 auto;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:var(--shell-gap)}.ckf{flex:0 0 auto;padding-top:var(--shell-gap-sm)}}
+
+@layer elcrm-components{.cur{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--pricing-card-min-width),1fr));gap:var(--shell-gap-lg);align-items:stretch}.cui{position:relative;display:flex;flex-direction:column;gap:var(--shell-gap);padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);box-shadow:var(--shell-shadow)}.cui[data-selectable=true]{cursor:pointer}.cui:disabled,.cui[aria-disabled=true]{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cus,.cui[data-selected=true],.cui[data-highlighted=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected);box-shadow:var(--shell-shadow)}.cub{display:flex;align-items:center;justify-content:center;margin:calc(-1 * var(--shell-padding-block)) calc(-1 * var(--shell-padding-inline)) 0;padding:var(--shell-gap-sm) var(--shell-padding-inline);border-radius:var(--shell-radius) var(--shell-radius) 0 0;background:var(--shell-color-accent);color:#fff;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);text-align:center}.cug{display:inline-flex;align-items:center;width:fit-content;padding:.15rem .5rem;border-radius:999px;background:var(--shell-background-hover);color:var(--shell-color-accent);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);line-height:1.2}.cua{position:absolute;top:0;left:50%;transform:translate(-50%,-50%)}.cum{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:calc(var(--shell-icon-size) * 1.6);height:calc(var(--shell-icon-size) * 1.6);color:var(--shell-color-accent);background:var(--shell-background-hover);border-radius:50%;overflow:hidden}.cuh{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.cut{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cup{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm)}.cuz{font-size:calc(var(--shell-font-size-lg) * 1.35);font-weight:700;color:var(--shell-color);line-height:1.15}.cui[data-highlighted=true] .cuz,.cui[data-selected=true] .cuz{color:var(--shell-color-accent)}.cuo{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);text-decoration:line-through}.cue{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.cud{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cux{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cuf{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin:auto calc(-1 * var(--shell-padding-inline)) calc(-1 * var(--shell-padding-block));padding:var(--shell-padding);background:var(--shell-background-muted);border-top:1px solid var(--shell-border);border-radius:0 0 var(--shell-radius) var(--shell-radius)}.cuy{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin-top:auto}.cul{margin:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);letter-spacing:.04em;text-transform:uppercase;color:var(--shell-color-muted)}.cuu{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.4}.cun{display:flex;flex-direction:column;gap:var(--shell-gap-sm);margin:0;padding:0;list-style:none}.cuc{display:flex;align-items:flex-start;gap:var(--shell-gap-sm);font-size:var(--shell-font-size-sm);color:var(--shell-color);line-height:1.4}.cuk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);margin-top:.1em;color:#fff;background:var(--shell-color-success);border-radius:50%}.cuw{width:60%;height:60%;display:block}}
+
+@layer elcrm-components{.cxr{display:grid;width:100%;column-gap:var(--shell-gap);row-gap:0;align-items:stretch;overflow-x:auto}.cxh{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box;color:var(--shell-color);background:var(--shell-background);border:1px solid transparent;border-radius:var(--shell-radius)}.cxh[data-highlighted=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cxm{display:flex;align-items:center;justify-content:center;width:calc(var(--shell-icon-size) * 1.4);height:calc(var(--shell-icon-size) * 1.4);color:var(--shell-color-accent);background:var(--shell-background-hover);border-radius:var(--shell-radius);overflow:hidden}.cxn{display:flex;flex-wrap:wrap;align-items:center;gap:var(--shell-gap-sm)}.cxt{margin:0;font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cxg{display:inline-flex;align-items:center;padding:.15rem .5rem;border-radius:999px;background:var(--shell-background-hover);color:var(--shell-color-accent);font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight)}.cxp{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm)}.cxz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.15}.cxo{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);text-decoration:line-through}.cxe{font-size:var(--shell-font-size-sm);color:var(--shell-color-muted)}.cxd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cxx{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cxb{grid-column:1 / -1;margin:var(--shell-gap) 0 var(--shell-gap-sm);padding:0;font-size:var(--shell-font-size-sm);font-weight:var(--shell-font-weight);color:var(--shell-color-accent)}.cxf,.cxy{display:contents}.cxy>*{padding:var(--shell-padding);box-sizing:border-box;border-bottom:1px solid var(--shell-border);background:var(--shell-background)}.cxy[data-alt=true]>*{background:var(--shell-background-muted)}.cxl{display:flex;align-items:center;gap:var(--shell-gap-sm);font-size:var(--shell-font-size-sm);color:var(--shell-color);line-height:1.4}.cxw{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-status-size);height:var(--shell-status-size);padding:0;border:1px solid var(--shell-border);border-radius:50%;background:transparent;color:var(--shell-color-muted);font-size:9px;line-height:1;cursor:help}.cxc{display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--shell-font-size-sm);color:var(--shell-color);font-weight:500}.cxk{display:inline-flex;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);color:#fff;background:var(--shell-color-success);border-radius:50%}.cxv{width:60%;height:60%;display:block}.cxa{color:var(--shell-color-muted)}.cxu{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding);box-sizing:border-box}.cxq{min-width:var(--pricing-table-label-width)}}
+
+@layer elcrm-components{.cqr{display:flex;flex-direction:column;gap:var(--shell-gap)}.cqi{display:flex;align-items:flex-start;gap:var(--shell-gap);width:100%;margin:0;padding:var(--shell-padding);box-sizing:border-box;text-align:left;font:inherit;color:var(--shell-color);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.cqi:hover:not(:disabled){background:var(--shell-background-hover)}.cqi:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cqs,.cqi[data-selected=true]{border-color:var(--shell-color-accent);background:var(--shell-background-selected)}.cqp{flex-direction:column;align-items:stretch;padding:0;gap:0}.cqp.cqs .cqh,.cqp[data-selected=true] .cqh{border-bottom-color:var(--shell-color-accent)}.cqn{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.cqm{display:flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden}.cqf{width:var(--shell-icon-size);height:var(--shell-icon-size);padding:var(--shell-gap-sm);box-sizing:content-box;color:var(--shell-color-muted);background:var(--shell-background-muted);border:1px solid var(--shell-border);border-radius:var(--shell-radius)}.cqc{display:flex;flex:1;flex-direction:column;gap:var(--shell-gap-sm);min-width:0}.cqt{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--shell-gap-sm);font-size:var(--shell-font-size);font-weight:var(--shell-font-weight);color:var(--shell-color);line-height:1.3}.cqe{font-size:var(--shell-font-size-sm);font-weight:400;color:var(--shell-color-muted)}.cqd{margin:0;font-size:var(--shell-font-size-sm);color:var(--shell-color-muted);line-height:1.45}.cqx{display:flex;flex-wrap:wrap;gap:var(--shell-gap-sm);margin-top:var(--shell-gap-sm)}.cqh{display:flex;align-items:center;gap:var(--shell-gap);padding:var(--shell-padding);border-bottom:1px solid var(--shell-border)}.cqh .cqt{flex:1;min-width:0}.cqy{display:flex;flex-direction:column;gap:var(--shell-gap-sm);padding:var(--shell-padding)}.cqz{font-size:var(--shell-font-size-lg);font-weight:700;color:var(--shell-color);line-height:1.2}.cqk{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;width:var(--shell-check-size);height:var(--shell-check-size);margin-left:auto;box-sizing:border-box;border:1px solid var(--shell-border);background:var(--shell-background);color:#fff}.cqi[data-indicator=start]>.cqk{margin-left:0;order:-1}.cqo{border-radius:50%}.cqo[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent);box-shadow:inset 0 0 0 3px var(--shell-background-selected)}.cqq{border-radius:calc(var(--shell-radius) * .4)}.cqq[data-on=true]{border-color:var(--shell-color-accent);background:var(--shell-color-accent)}.cqw{width:60%;height:60%;display:block}}
+
+@layer elcrm-components{.cep{display:flex;flex-direction:column;gap:var(--shell-gap);padding:var(--section-padding);flex:1;min-width:0}.ceu{box-sizing:border-box;min-height:100svh;display:flex;align-items:center;justify-content:center;padding:var(--section-padding)}.cek{box-sizing:border-box;width:100%;max-width:var(--section-auth-card-max-width);padding:var(--shell-gap-lg);background:var(--shell-background);border:1px solid var(--shell-border);border-radius:var(--shell-radius);box-shadow:var(--shell-shadow);display:flex;flex-direction:column;gap:var(--shell-gap)}.ceh{display:flex;flex-direction:column;gap:var(--shell-gap-sm)}.cec{text-align:center;align-items:center}.cei{display:flex;margin-bottom:var(--shell-gap-sm)}.cec .cei{justify-content:center}.cet{margin:0;font-size:var(--section-title-size);font-weight:var(--shell-font-weight);letter-spacing:-.02em;color:var(--shell-color);line-height:1.25}.ced{font-size:var(--section-title-size-md)}.cee{margin:0;font-size:var(--shell-font-size);color:var(--shell-color-muted);line-height:1.45}.ceb{display:flex;flex-direction:column;gap:var(--shell-gap);width:100%;text-align:left}.ces{display:flex;flex-direction:column;gap:var(--shell-gap-sm);width:100%}.cel{display:flex;flex-direction:column;gap:var(--shell-gap);margin-bottom:var(--shell-gap-lg);padding-bottom:var(--shell-gap-lg);border-bottom:1px solid var(--shell-border)}.cel:last-of-type{margin-bottom:0;padding-bottom:0;border-bottom:none}.cel .cet{font-size:var(--shell-font-size);font-weight:var(--shell-font-weight)}}
+
+@layer elcrm-components{.c1r{display:flex;flex-direction:column;gap:var(--shell-gap)}.c1h{flex-direction:row;flex-wrap:wrap;align-items:center}}
+
+@layer elcrm-components{.ctr{display:flex;flex-direction:column;gap:var(--shell-gap);width:100%;min-width:0}.ctb{display:flex;align-items:flex-end;gap:var(--shell-gap);border-bottom:1px solid var(--shell-border);min-width:0}.ctn{display:flex;align-items:stretch;gap:var(--shell-gap-lg);flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin}.ctt{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:var(--shell-gap-sm);flex:0 0 auto;margin:0 0 -1px;padding:var(--shell-padding-block) .15rem;border:none;border-bottom:2px solid transparent;background:transparent;color:var(--shell-color-muted);font:inherit;font-size:var(--shell-font-size);font-weight:500;white-space:nowrap;cursor:pointer}.ctt:hover:not(:disabled){color:var(--shell-color)}.cta{color:var(--shell-color);border-bottom-color:var(--shell-color-accent)}.ctt:disabled{opacity:var(--shell-disabled-opacity);cursor:not-allowed}.cte{display:inline-flex;align-items:center;justify-content:center;min-width:1.15em;height:1.15em;padding:0 .35em;border-radius:999px;background:var(--shell-color-danger);color:#fff;font-size:11px;font-style:normal;font-weight:700;line-height:1}.cts{flex:0 0 auto;display:flex;align-items:center;padding-bottom:var(--shell-gap-sm)}.ctm{min-width:0;width:100%}}

package/dist/index.d.ts

@@ -16,8 +16,14 @@ export { Row } from './Row';
 export type { RowProps } from './Row';
 export { Column } from './Column';
 export type { ColumnProps } from './Column';
+export { Stack } from './Stack';
+export type { StackProps, StackDirection } from './Stack';
 export { Menu } from './Menu';
 export type { MenuProps, MenuItem } from './Menu';
+export { Dropdown } from './Dropdown';
+export type { DropdownProps, DropdownItem, DropdownGroup, } from './Dropdown';
+export { Breadcrumb } from './Breadcrumb';
+export type { BreadcrumbProps, BreadcrumbItem, BreadcrumbSeparator, } from './Breadcrumb';
 export { Loading } from './Loading';
 export type { LoadingProps } from './Loading';
 export { Section } from './Section';
@@ -27,13 +33,27 @@ export type { NavSectionsProps, NavSectionsGroup, NavSectionsItem, } from './Nav
 export { TabSections } from './TabSections';
 export type { TabSectionsProps, TabSectionsItem } from './TabSections';
 export { Avatar, initialsFromName } from './Avatar';
-export type { AvatarProps } from './Avatar';
+export type { AvatarProps, AvatarStatus } from './Avatar';
+export { AvatarGroup } from './AvatarGroup';
+export type { AvatarGroupProps, AvatarGroupItem } from './AvatarGroup';
+export { AvatarName } from './AvatarName';
+export type { AvatarNameProps } from './AvatarName';
 export { Badge } from './Badge';
 export type { BadgeProps } from './Badge';
 export { Brand } from './Brand';
 export type { BrandProps } from './Brand';
 export { EmptyState } from './EmptyState';
 export type { EmptyStateProps } from './EmptyState';
+export { RadioGroup } from './RadioGroup';
+export type { RadioGroupProps, RadioGroupItem, RadioIndicator, RadioIndicatorSide, } from './RadioGroup';
+export { PricingGroup } from './PricingGroup';
+export type { PricingGroupProps, PricingPlan, PricingGroupItem, PricingFeature, } from './PricingGroup';
+export { PricingTable } from './PricingTable';
+export type { PricingTableProps, PricingTableItem, PricingTableSection, PricingTableRow, PricingTableCellValue, } from './PricingTable';
+export { PageHead } from './PageHead';
+export type { PageHeadProps } from './PageHead';
+export { PageShell } from './PageShell';
+export type { PageShellProps } from './PageShell';
 export { createLazyResolver } from './lazyRoute';
 export type { LazyRouteChunk } from './lazyRoute';
 export { cx } from './cx';

package/dist/index.es.js

@@ -1,47 +1,67 @@
-import { L as p } from "./Layout-Xb3-xsmA.js";
+import { L as f } from "./Layout-Xb3-xsmA.js";
 import { H as i } from "./Header-Cf28eyjW.js";
 import { F as n } from "./Footer-qxUlnPR9.js";
-import { L as u } from "./List-BgKkYaGO.js";
-import { I as d } from "./Item-CaU4RW2G.js";
+import { L as d } from "./List-BgKkYaGO.js";
+import { I as B } from "./Item-CaU4RW2G.js";
 import { C as S } from "./Card-hn37Opo3.js";
-import { B as C } from "./Block-CVKukh1e.js";
-import { R as F } from "./Row-CnD7Q7pD.js";
-import { C as R } from "./Column-DlNrvFq1.js";
-import { M as A } from "./Menu-DS7zKQbY.js";
-import { L as H } from "./Loading-ChGq9peU.js";
-import { S as M } from "./Section-Crxk2J-E.js";
-import { N as b } from "./NavSections-CM-VPai2.js";
-import { T as k } from "./TabSections-oeEBx0nM.js";
-import { A as j, i as q } from "./Avatar-DHNPaIjZ.js";
-import { B as G } from "./Badge-l6nUkl-H.js";
-import { B as K } from "./Brand-Zq-Idks4.js";
-import { E as P } from "./EmptyState-mBiWtMIM.js";
-import { lazy as t } from "react";
-import { c as U } from "./cx-CcykAxZN.js";
-function m(a) {
-  const r = {};
-  return (o) => (r[o] || (r[o] = t(() => a(o))), r[o]);
+import { B as A } from "./Block-BAXh0PPp.js";
+import { R } from "./Row--HIe6vb9.js";
+import { C } from "./Column-DDaqX-A7.js";
+import { S as b } from "./Stack-b0-XWwQ1.js";
+import { M as F } from "./Menu-DRBHvSdJ.js";
+import { D as H } from "./Dropdown-DQlDiWCR.js";
+import { B as h } from "./Breadcrumb-CAM_e9LN.js";
+import { L as w } from "./Loading-ChGq9peU.js";
+import { S as D } from "./Section-Crxk2J-E.js";
+import { N as I } from "./NavSections-NDcIDD6H.js";
+import { T as j } from "./TabSections-DL7DufKU.js";
+import { A as J, i as K } from "./Avatar-CyNXYvsa.js";
+import { A as Q } from "./AvatarGroup-BAWas4pU.js";
+import { A as V } from "./AvatarName-DhD3TytF.js";
+import { B as X } from "./Badge-l6nUkl-H.js";
+import { B as Z } from "./Brand-Zq-Idks4.js";
+import { E as $ } from "./EmptyState-mBiWtMIM.js";
+import { R as or } from "./RadioGroup-D2UUOTkY.js";
+import { P as er } from "./PricingGroup-DgcdVSq8.js";
+import { P as pr } from "./PricingTable-DALddSwM.js";
+import { P as sr } from "./PageHead-Baz9BLuA.js";
+import { P as xr } from "./PageShell-CghThHS3.js";
+import { lazy as e } from "react";
+import { c as cr } from "./cx-CcykAxZN.js";
+function p(a) {
+  const o = {};
+  return (r) => (o[r] || (o[r] = e(() => a(r))), o[r]);
 }
 export {
-  j as Avatar,
-  G as Badge,
-  C as Block,
-  K as Brand,
+  J as Avatar,
+  Q as AvatarGroup,
+  V as AvatarName,
+  X as Badge,
+  A as Block,
+  Z as Brand,
+  h as Breadcrumb,
   S as Card,
-  R as Column,
-  P as EmptyState,
+  C as Column,
+  H as Dropdown,
+  $ as EmptyState,
   n as Footer,
   i as Header,
-  d as Item,
-  p as Layout,
-  u as List,
-  H as Loading,
-  A as Menu,
-  b as NavSections,
-  F as Row,
-  M as Section,
-  k as TabSections,
-  m as createLazyResolver,
-  U as cx,
-  q as initialsFromName
+  B as Item,
+  f as Layout,
+  d as List,
+  w as Loading,
+  F as Menu,
+  I as NavSections,
+  sr as PageHead,
+  xr as PageShell,
+  er as PricingGroup,
+  pr as PricingTable,
+  or as RadioGroup,
+  R as Row,
+  D as Section,
+  b as Stack,
+  j as TabSections,
+  p as createLazyResolver,
+  cr as cx,
+  K as initialsFromName
 };

package/dist/lazyRoute.d.ts

@@ -1,9 +1,25 @@
 import { ComponentType, LazyExoticComponent } from 'react';
+/**
+ * Lazy-компонент секции для {@link NavSections} / {@link TabSections}.
+ */
 export type LazyRouteChunk = LazyExoticComponent<ComponentType<Record<string, unknown>>>;
 /**
- * Кэш lazy-чанков: один lazy на сегмент (иначе remount при каждом рендере).
- * Шаблон import() должен быть статичным для Vite:
- * `createLazyResolver((k) => import(\`./sections/${k}.tsx\`))`
+ * Кэш lazy-чанков: один `lazy()` на сегмент (иначе remount при каждом рендере).
+ *
+ * Когда использовать: `resolveSection` у {@link NavSections} / {@link TabSections}.
+ * Шаблон `import()` должен быть статичным для Vite.
+ *
+ * @param load — функция загрузки модуля по сегменту (`value` пункта меню/вкладки).
+ * @returns резолвер `(segment) => LazyRouteChunk`.
+ *
+ * @example
+ * ```tsx
+ * const resolveSection = createLazyResolver(
+ *   (v) => import(`./sections/${v}.tsx`),
+ * );
+ *
+ * <NavSections groups={groups} resolveSection={resolveSection} />
+ * ```
  */
 export declare function createLazyResolver(load: (segment: string) => Promise<{
     default: ComponentType<Record<string, unknown>>;

package/dist/light.css

@@ -0,0 +1,25 @@
+/**
+ * Цвета shell (@elcrm/components) для светлой темы — `elcrm css`.
+ * Палитра (--text, --muted, …) должна быть в theme-light приложения.
+ */
+html[data-theme="light"],
+body[data-theme="light"] {
+  --shell-color: var(--text);
+  --shell-color-muted: var(--muted);
+  --shell-color-accent: var(--accent);
+  --shell-color-danger: var(--danger);
+  --shell-color-success: var(--success);
+  --shell-color-warning: var(--warning);
+  --shell-border: var(--line);
+  --shell-background: var(--panel);
+  --shell-background-muted: var(--bg);
+  --shell-background-hover: color-mix(in srgb, var(--text) 6%, transparent);
+  --shell-background-selected: color-mix(in srgb, var(--accent) 10%, transparent);
+  --shell-shadow: var(--shadow);
+
+  --avatar-background: var(--shell-color-accent);
+  --avatar-color: var(--button-primary-fg);
+  --avatar-border: 1px solid var(--shell-border);
+  --avatar-outline-active: 2px solid
+    color-mix(in srgb, var(--accent) 70%, white);
+}

package/dist/stackGap.d.ts

@@ -1,3 +1,15 @@
 import { CSSProperties } from 'react';
-/** Число → px, строка как есть (например `0.75rem`) */
+/**
+ * Inline-стиль `gap` для {@link Stack} (и устаревших Block/Row/Column).
+ *
+ * - число → `"Npx"`
+ * - строка → как есть (`"0.75rem"`)
+ * - `undefined` / `null` → стиль не задаём (берётся CSS-токен)
+ *
+ * @example
+ * ```ts
+ * stackGapStyle(8)      // { gap: "8px" }
+ * stackGapStyle("1rem") // { gap: "1rem" }
+ * ```
+ */
 export declare function stackGapStyle(gap?: number | string): CSSProperties | undefined;

package/dist/tokens.css

@@ -0,0 +1,57 @@
+/**
+ * Дефолты геометрии @elcrm/components для `elcrm css`.
+ * Цвета — light.css / dark.css. Не импортируй в runtime приложения как themes.css.
+ */
+:root {
+  /* —— shell —— */
+  --shell-radius: var(--control-radius);
+  --shell-font-size: var(--control-font-size);
+  --shell-font-size-sm: 13px;
+  --shell-font-size-lg: 18px;
+  --shell-font-weight: 600;
+  --shell-gap: 12px;
+  --shell-gap-sm: 8px;
+  --shell-gap-lg: 16px;
+  --shell-padding-block: 10px;
+  --shell-padding-inline: 14px;
+  --shell-padding: var(--shell-padding-block) var(--shell-padding-inline);
+  --shell-icon-size: 20px;
+  --shell-check-size: 18px;
+  --shell-status-size: 10px;
+  --shell-disabled-opacity: 0.55;
+  --shell-z: var(--elcrm-z-popover, 1000);
+
+  /* —— узкие —— */
+  --header-radius: var(--shell-radius);
+  --header-height: 52px;
+  --header-shadow: none;
+  --header-margin: 0;
+  --header-z: 20;
+
+  --section-padding: 1.5rem 1.75rem 2.5rem;
+  --section-title-size: 1.5rem;
+  --section-title-size-md: 1.25rem;
+  --section-auth-card-max-width: 22rem;
+
+  --nav-sections-padding: 1.5rem 1.75rem 2.5rem;
+  --nav-sections-nav-width: 220px;
+  --nav-sections-main-max-width: 720px;
+
+  --avatar-size-s: 1.5rem;
+  --avatar-size-m: 2rem;
+  --avatar-size-l: 2.75rem;
+  --avatar-radius: 999px;
+  --avatar-font-size-s: 0.6rem;
+  --avatar-font-size-m: 0.7rem;
+  --avatar-font-size-l: 0.95rem;
+  --avatar-font-weight: 700;
+  --avatar-outline-offset: 0;
+  --avatar-group-overlap: -0.4rem;
+  --avatar-group-ring: 2px;
+
+  --dropdown-min-width: 12rem;
+  --dropdown-max-width: 20rem;
+  --dropdown-max-height: 20rem;
+  --pricing-card-min-width: 16rem;
+  --pricing-table-label-width: 10rem;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@elcrm/components",
-  "version": "0.0.3",
-  "description": "Shell UI elCRM: Layout, Header, Section, NavSections, Avatar и др. — стили через CSS-токены.",
+  "version": "0.1.1",
+  "description": "Shell UI elCRM: Layout, Header, PageHead, PageShell, Section, Stack, RadioGroup, Avatar и др.",
   "type": "module",
   "author": "MaSkal <dev@elcrm.online>",
   "license": "MIT",
@@ -59,6 +59,21 @@
       "require": "./dist/index.css",
       "default": "./dist/index.css"
     },
+    "./tokens.css": {
+      "import": "./dist/tokens.css",
+      "require": "./dist/tokens.css",
+      "default": "./dist/tokens.css"
+    },
+    "./light.css": {
+      "import": "./dist/light.css",
+      "require": "./dist/light.css",
+      "default": "./dist/light.css"
+    },
+    "./dark.css": {
+      "import": "./dist/dark.css",
+      "require": "./dist/dark.css",
+      "default": "./dist/dark.css"
+    },
     "./*": {
       "types": "./dist/*.d.ts",
       "import": {
@@ -70,7 +85,8 @@
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build": "vite build && node scripts/postbuild.mjs",
+    "build": "vite build",
+    "postbuild": "node scripts/postbuild.mjs",
     "check:css": "node scripts/check-css-scoped.mjs",
     "check:tokens": "node scripts/check-tokens.mjs",
     "test": "vitest run",
@@ -93,7 +109,7 @@
     "@types/react": "^18.2.66",
     "@types/react-dom": "^18.2.22",
     "@vitejs/plugin-react": "^4.3.1",
-    "elcrm": "^1.0.0",
+    "elcrm": "file:../elCRM.cli",
     "jsdom": "^26.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

package/dist/Avatar-DHNPaIjZ.js

@@ -1,64 +0,0 @@
-import c from "react";
-import { c as b } from "./cx-CcykAxZN.js";
-import './Avatar.css';const g = "car", N = "cas", E = "cam", C = "cal", h = "caa", x = "cai", e = {
-  r: g,
-  s: N,
-  m: E,
-  l: C,
-  a: h,
-  i: x
-};
-function z(n) {
-  const a = n.trim();
-  if (!a) return "?";
-  const s = a.split(/\s+/).filter(Boolean);
-  return s.length >= 2 ? (s[0][0] + s[1][0]).toUpperCase() : a.slice(0, 2).toUpperCase();
-}
-function y(n) {
-  const {
-    src: a,
-    alt: s,
-    name: l,
-    size: u = "m",
-    active: r,
-    children: p,
-    className: v,
-    as: d = "span",
-    ...i
-  } = n, f = u === "s" ? e.s : u === "l" ? e.l : e.m, o = b(e.r, f, r && e.a, v), t = s ?? l, m = a != null && a !== "" ? /* @__PURE__ */ c.createElement("img", { className: e.i, src: a, alt: t ?? "", draggable: !1 }) : p ?? (l != null ? z(l) : "?");
-  return d === "button" ? /* @__PURE__ */ c.createElement(
-    "button",
-    {
-      type: "button",
-      className: o,
-      "aria-label": t,
-      "data-active": r ? "true" : void 0,
-      ...i
-    },
-    m
-  ) : d === "div" ? /* @__PURE__ */ c.createElement(
-    "div",
-    {
-      className: o,
-      role: t ? "img" : void 0,
-      "aria-label": t,
-      "data-active": r ? "true" : void 0,
-      ...i
-    },
-    m
-  ) : /* @__PURE__ */ c.createElement(
-    "span",
-    {
-      className: o,
-      role: t ? "img" : void 0,
-      "aria-label": t,
-      "data-active": r ? "true" : void 0,
-      ...i
-    },
-    m
-  );
-}
-export {
-  y as A,
-  z as i
-};

package/dist/Block-CVKukh1e.js

@@ -1,28 +0,0 @@
-import m from "react";
-import { c as n } from "./cx-CcykAxZN.js";
-import { s as i } from "./stackGap-CDsjER0g.js";
-import './Block.css';const l = "cbr", p = "cbh", t = {
-  r: l,
-  h: p
-};
-function k({
-  row: r,
-  gap: c,
-  children: o,
-  className: s,
-  style: e,
-  ...a
-}) {
-  return /* @__PURE__ */ m.createElement(
-    "div",
-    {
-      className: n(t.r, r && t.h, s),
-      style: { ...i(c), ...e },
-      ...a
-    },
-    o
-  );
-}
-export {
-  k as B
-};

package/dist/Block.css

@@ -1 +0,0 @@
-@layer elcrm-components{.cbr{display:flex;flex-direction:column;gap:var(--block-gap);padding:var(--block-padding)}.cbh{flex-direction:row;flex-wrap:wrap;align-items:center}}

package/dist/Column-DlNrvFq1.js

@@ -1,26 +0,0 @@
-import e from "react";
-import { c as a } from "./cx-CcykAxZN.js";
-import { s as m } from "./stackGap-CDsjER0g.js";
-import './Column.css';const n = "cor", i = {
-  r: n
-};
-function u({
-  gap: r,
-  children: t,
-  className: o,
-  style: s,
-  ...c
-}) {
-  return /* @__PURE__ */ e.createElement(
-    "div",
-    {
-      className: a(i.r, o),
-      style: { ...m(r), ...s },
-      ...c
-    },
-    t
-  );
-}
-export {
-  u as C
-};

package/dist/Column.css

@@ -1 +0,0 @@
-@layer elcrm-components{.cor{display:flex;flex-direction:column;gap:var(--column-gap)}}