@wwtdev/bsds-css 1.15.11 → 1.15.13

package/dist/components/dropdown.css

@@ -52,12 +52,12 @@
   margin-left: -0.75rem;
   width: calc(100% + 1.5rem);
 }
-.bs-dropdown:where([data-search]) :where(.bs-dropdown-options) {
+.bs-dropdown:where([data-search]:not([data-search="false"])) :where(.bs-dropdown-options) {
   --options-height-max: 11.5rem;
 }
 
 /* data-shown */
-.bs-dropdown:where([data-shown]) {
+.bs-dropdown:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
   transform: translateY(0);
   z-index: 999;
@@ -102,18 +102,18 @@
   }
 
   /* data-shown */
-  .bs-dropdown:where([data-shown]) {
+  .bs-dropdown:where([data-shown]:not([data-shown="false"])) {
     opacity: 1;
   }
 
   /* data-top */
-  .bs-dropdown:where([data-top]) {
+  .bs-dropdown:where([data-top]:not([data-top="false"])) {
     --dropdown-wscreen-bottom: calc(100% + 0.5rem);
     --dropdown-wscreen-top: auto;
   }
 
   /* data-justify="center" */
-  .bs-dropdown-parent:where([data-center]) :where(.bs-dropdown) {
+  .bs-dropdown-parent:where([data-center]:not([data-center="false"])) :where(.bs-dropdown) {
     --dropdown-wscreen-left: 50%;
     transform: translateX(-50%);
   }
@@ -121,7 +121,7 @@
   .bs-dropdown :where(.bs-dropdown-options) {
     --options-height-max: 20rem;
   }
-  .bs-dropdown:where([data-search]) :where(.bs-dropdown-options) {
+  .bs-dropdown:where([data-search]:not([data-search="false"])) :where(.bs-dropdown-options) {
     --options-height-max: 17.25rem;
   }
 }

package/dist/components/form-booleans.css

@@ -176,7 +176,7 @@ input:where([type='radio']):checked:disabled::before {
 
 /* Error state */
 
-input:where([type='checkbox'], [type='radio'])[data-error] {
+input:where([type='checkbox'], [type='radio'])[data-error]:where(:not([data-error="false"])) {
   --box-shadow: var(--bs-red-base);
   --outline-color: var(--bs-red-base);
 }

package/dist/components/form-elements.css

@@ -1,10 +1,10 @@
 /* Generally applicable (all input types) */
-:where([data-required]) {
+:where([data-required]:not([data-required="false"])) {
   color: var(--bs-ink-red);
   font-weight: var(--bs-font-bold, 600);
 }
 
-:where([data-disabled], [data-disabled] [data-required]) {
+:where([data-disabled]:not([data-disabled="false"]), [data-disabled]:not([data-disabled="false"]) [data-required]:not([data-required="false"])) {
   color: var(--bs-gray-400);
 }
 
@@ -16,7 +16,7 @@
 }
 
 /* Errors and Messages */
-:is(input, select, textarea):where([data-error]) {
+:is(input, select, textarea):where([data-error]:not([data-error="false"])) {
   --input-border: var(--bs-ink-red);
 }
 

package/dist/components/form-hints.css

@@ -9,6 +9,6 @@
   overflow-wrap: break-word;
 }
 
-.bs-hint:where([data-error]) {
+.bs-hint:where([data-error]:not([data-error="false"])) {
   --hint-color: var(--bs-ink-red);
 }

package/dist/components/form-input-composite.css

@@ -131,8 +131,9 @@ and issues with box-sizing
 }
 
 .bs-input-addon:where(:not([data-multifocus]):focus-within),
-.bs-input-addon:where([data-multifocus]) :where(input, select):where(:focus, :focus-within, :focus-visible),
-.bs-input-addon:where([data-multifocus]) :is(bs-input, bs-select) :where(input, select):where(:focus, :focus-within, :focus-visible) {
+.bs-input-addon:where([data-multifocus="false"]:focus-within),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :where(input, select):where(:focus, :focus-within, :focus-visible),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :is(bs-input, bs-select) :where(input, select):where(:focus, :focus-within, :focus-visible) {
   --input-border: var(--focus-border);
   position: relative;
   z-index: 1;
@@ -147,14 +148,15 @@ and issues with box-sizing
   z-index: 1;
 }
 
-.bs-input-addon:where([data-multifocus]) > :where(:not(.bs-input-addon)) > :where(input:focus, select:focus),
-.bs-input-addon:where([data-multifocus]) > :is(bs-input, bs-select) :where(input:focus, select:focus),
-.bs-input-addon:where([data-multifocus]) > :where(input:focus, select:focus) {
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :where(:not(.bs-input-addon)) > :where(input:focus, select:focus),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :is(bs-input, bs-select) :where(input:focus, select:focus),
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) > :where(input:focus, select:focus) {
   border-radius: .25rem;
   box-shadow: var(--focus-border) 0px 0px 0px 1px inset;
 }
 
-.bs-input-addon:where(:not([data-multifocus]):focus-within)::after {
+.bs-input-addon:where(:not([data-multifocus]):focus-within)::after,
+.bs-input-addon:where([data-multifocus="false"]:focus-within)::after {
   border-width: 1px;
   border-radius: .25rem;
 }
@@ -165,7 +167,7 @@ and issues with box-sizing
 }
 
 /* Straight-lined ::before border to fill the gap below the rounded ::after border */
-.bs-input-addon:where([data-multifocus]) :where(:focus-within)::before {
+.bs-input-addon:where([data-multifocus]:not([data-multifocus="false"])) :where(:focus-within)::before {
   border-bottom-width: 1px;
   border-color: var(--bs-violet-300);
   border-radius: 0;
@@ -185,14 +187,14 @@ and issues with box-sizing
 }
 
 /* -------- Error styles -------- */
-.bs-input-addon:where([data-error]),
-.bs-input-addon:where([data-error]) :where(.bs-input-addon) {
+.bs-input-addon:where([data-error]:not([data-error="false"])),
+.bs-input-addon:where([data-error]:not([data-error="false"])) :where(.bs-input-addon) {
   --focus-border: var(--bs-red-400);
   --input-border: var(--bs-red-400);
 }
 
-.bs-input-addon:where([data-error],[data-disabled]) > *::before,
-.bs-input-addon:where(.bs-input-addon[data-error] .bs-input-addon, .bs-input-addon[data-disabled] .bs-input-addon) > *::before {
+.bs-input-addon:where([data-error]:not([data-error="false"]),[data-disabled]:not([data-disabled="false"])) > *::before,
+.bs-input-addon:where(.bs-input-addon[data-error]:not([data-error="false"]) .bs-input-addon, .bs-input-addon[data-disabled]:not([data-disabled="false"]) .bs-input-addon) > *::before {
   border-color: var(--input-border);
 }
 

package/dist/components/form-labels.css

@@ -9,10 +9,18 @@
   width: 100%;
 }
 
-:where([data-required]) {
+:where([data-required]:not([data-required="false"])) {
   color: var(--bs-ink-red);
 }
 
-:where(label[data-disabled], [data-disabled] [data-required], [data-disabled] label) {
+:where(label[data-disabled]:not([data-disabled="false"])) {
+  --label-color: var(--bs-ink-disabled);
+}
+
+:where([data-disabled]:not([data-disabled="false"]) [data-required]:not([data-required="false"])) {
+  --label-color: var(--bs-ink-disabled);
+}
+
+:where([data-disabled]:not([data-disabled="false"])) label {
   --label-color: var(--bs-ink-disabled);
 }

package/dist/components/form-switches.css

@@ -140,7 +140,7 @@
 
 /* Disabled state */
 
-.bs-switch:where([data-disabled]) {
+.bs-switch:where([data-disabled]:not([data-disabled="false"])) {
   --ball-background: var(--bs-ink-disabled);
   --switch-background: var(--bs-bg-disabled);
 }

package/dist/components/form-text-fields.css

@@ -55,7 +55,7 @@ textarea {
 }
 
 /* Errors and Messages */
-:is(input, select, textarea):where([data-error]) {
+:is(input, select, textarea):where([data-error]:not([data-error="false"])) {
   --input-border: var(--bs-ink-red);
 }
 

package/dist/components/modal.css

@@ -17,7 +17,7 @@
   z-index: 9999;
 }
 
-.bs-modal:where([data-shown]) {
+.bs-modal:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
 }
 

package/dist/components/overlay.css

@@ -13,6 +13,6 @@
   z-index: 9998;
 }
 
-.bs-overlay:where([data-shown]) {
+.bs-overlay:where([data-shown]:not([data-shown="false"])) {
   opacity: 1;
 }

package/dist/components/pagination.css

@@ -38,12 +38,12 @@
   color: var(--bs-ink-disabled);
 }
 
-.bs-pagination button:where([data-selected]) {
+.bs-pagination button:where([data-selected]:not([data-selected="false"])) {
   background-color: var(--bs-blue-base);
   color: var(--bs-gray-50);
 }
 
-.bs-pagination:where([data-fixed]) {
+.bs-pagination:where([data-fixed]:not([data-fixed="false"])) {
   background-color: var(--bs-bg-base-elevated);
   bottom: 0;
   left: 0;

package/dist/components/pills.css

@@ -40,7 +40,7 @@
 }
 
 /* ------------------------------ Background Colors ------------------------------ */
-:where(.box, [class*="bg-"]:not([class~="bg-white"])) .bs-pill:where(:not([data-variant^="live"], [data-active])) {
+:where(.box, [class*="bg-"]:not([class~="bg-white"])) .bs-pill:where(:not([data-variant^="live"], [data-active]:not([data-active="false"]))) {
   --pill-background: var(--bs-bg-base);
 }
 :where(.box[data-invert]) .bs-pill {
@@ -132,24 +132,24 @@
 }
 
 /* ----- Filter Active Styles ----- */
-.bs-pill:where([data-variant^="filter"][data-active]) {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])) {
   --pill-background: var(--bs-blue-base);
   --pill-border: transparent;
   --pill-text: var(--bs-white);
 }
-.bs-pill:where([data-variant^="filter"][data-active]):is(:hover, :focus)  {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):is(:hover, :focus)  {
   --pill-border: transparent;
 }
-:is(a, button).bs-pill:where([data-variant^="filter"][data-active]):is(:hover, :focus)  {
+:is(a, button).bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):is(:hover, :focus)  {
   --pill-background: var(--bs-blue-500);
   --pill-border: transparent;
 }
 /* White X */
-.bs-pill:where([data-variant^="filter"][data-active])::after {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"]))::after {
   content: url("data:image/svg+xml,%3Csvg width='8' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .703 7.297 0 4 3.297.703 0 0 .703 3.297 4 0 7.297.703 8 4 4.703 7.297 8 8 7.297 4.703 4 8 .703Z' fill='%23fff'/%3E%3C/svg%3E");
 }
 /* Black X */
-.bs-pill:where([data-variant^="filter"][data-active]):where(:disabled, [aria-disabled="true"])::after {
+.bs-pill:where([data-variant^="filter"][data-active]:not([data-active="false"])):where(:disabled, [aria-disabled="true"])::after {
   content: url("data:image/svg+xml,%3Csvg width='8' height='8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 .703 7.297 0 4 3.297.703 0 0 .703 3.297 4 0 7.297.703 8 4 4.703 7.297 8 8 7.297 4.703 4 8 .703Z' fill='%230A0B19'/%3E%3C/svg%3E%0A");
 }
 
@@ -179,7 +179,8 @@
   background-color: var(--bs-bg-disabled);
 }
 
-.bs-pill:where([data-variant^="filter"]):not([data-active]):is(:disabled, [aria-disabled="true"]) {
+.bs-pill:where([data-variant^="filter"]):not([data-active]):is(:disabled, [aria-disabled="true"]),
+.bs-pill:where([data-variant^="filter"])[data-active="false"]:is(:disabled, [aria-disabled="true"]) {
   --pill-border: var(--bs-gray-400);
 }
 

package/dist/components/profile-img.css

@@ -16,7 +16,7 @@
   object-fit: cover;
   width: 100%;
 }
-.bs-profile-img:where([data-no-img]) img {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"])) img {
   display: none;
 }
 
@@ -34,11 +34,11 @@
   box-shadow: var(--bs-shadow-profilePhoto);
   content: '';
 }
-.bs-profile-img:where([data-no-img])::before {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"]))::before {
   display: none;
 }
 /* Initials */
-.bs-profile-img:where([data-no-img])::after {
+.bs-profile-img:where([data-no-img]:not([data-no-img="false"]))::after {
   border: 1px solid currentColor;
   color: var(--bs-blue-500);
   content: attr(data-initials);

package/dist/components/toast.css

@@ -19,7 +19,7 @@
     z-index: 999;
 }
 
-.bs-toast:where([data-stacked]) {
+.bs-toast:where([data-stacked]:not([data-stacked="false"])) {
     bottom: auto;
     left: auto;
     position: static;
@@ -28,7 +28,7 @@
 }
 
 /* Mobile - Toast comes up from bottom */
-.bs-toast:where([data-shown]) {
+.bs-toast:where([data-shown]:not([data-shown="false"])) {
     opacity: 1;
     transform: translate(0, 0);
 }
@@ -69,7 +69,7 @@
     padding-top: 0.5rem;
 }
 
-.bs-toast-actions:where([data-stacked]) {
+.bs-toast-actions:where([data-stacked]:not([data-stacked="false"])) {
     flex-direction: column-reverse;
 }
 
@@ -118,12 +118,12 @@
         transform: translate(calc(100% + 1.5rem), 0);
     }
 
-    .bs-toast:where([data-shown]) {
+    .bs-toast:where([data-shown]:not([data-shown="false"])) {
         opacity: 1;
         transform: translate(0, 0);
     }
 
-    .bs-toast-actions:where([data-stacked]) {
+    .bs-toast-actions:where([data-stacked]:not([data-stacked="false"])) {
         flex-direction: row;
     }
 }

package/dist/components/tooltip.css

@@ -134,10 +134,10 @@
 :where(.bs-tooltip[data-position="top-right"]):focus-within :where(.bs-tooltip-text),
 :where(.bs-tooltip[data-position="bottom-left"]):focus-within :where(.bs-tooltip-text),
 :where(.bs-tooltip[data-position="bottom-right"]):focus-within :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="top-left"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="top-right"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="bottom-left"])[data-shown] :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-position="bottom-right"])[data-shown] :where(.bs-tooltip-text) {
+:where(.bs-tooltip[data-position="top-left"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="top-right"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="bottom-left"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-position="bottom-right"]:not([data-shown="false"]))[data-shown] :where(.bs-tooltip-text) {
   opacity: 1;
   transform: scale(1);
 }
@@ -147,8 +147,13 @@
 Don't display unless data-shown is present
 This must go last to properly override the other classes
 */
-:where(.bs-tooltip[data-disabled]:not([data-shown])):hover :where(.bs-tooltip-text),
-:where(.bs-tooltip[data-disabled]:not([data-shown])):focus-within :where(.bs-tooltip-text) {
+:where(.bs-tooltip[data-disabled]:not([data-disabled="false"]):not([data-shown])):hover :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-disabled]:not([data-disabled="false"]):not([data-shown])):focus-within :where(.bs-tooltip-text) {
+  opacity: 0;
+  transform: scale(0);
+}
+:where(.bs-tooltip[data-shown="false"][data-disabled]:not([data-disabled="false"])):hover :where(.bs-tooltip-text),
+:where(.bs-tooltip[data-shown="false"][data-disabled]:not([data-disabled="false"])):focus-within :where(.bs-tooltip-text) {
   opacity: 0;
   transform: scale(0);
 }