@wrdagency/blockout 0.0.10 → 0.0.11

package/dist/assets/index10.css

@@ -1 +1 @@
-.component-select-control__input{cursor:pointer;display:flex;width:100%}.component-select-control__input:focus{outline:none}.component-select-control__value{flex-grow:1;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;text-align:left;background-color:transparent;transition:background-color .25s ease}.component-select-control__value:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret{width:2rem;display:flex;justify-content:center;align-items:center;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:background-color .25s ease}.component-select-control__caret:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret>svg{width:.75rem;height:.75rem;fill:currentColor}.component-select-control__popover__wrapper{z-index:9999!important}.component-select-control__popover{background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);box-shadow:0 .175rem .375rem #0000001a;width:calc(var(--popover-anchor-width) + 2px);max-height:var(--popover-available-height);overflow-y:auto}.component-select-control__popover:focus{outline:none}.component-select-control__list{display:flex;flex-direction:column;gap:.325rem;padding:.325rem}.component-select-control__list:focus{outline:none}.component-select-control__popover__search-wrapper{display:flex;align-items:center;gap:0;padding-left:1rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-select-control__popover__search-icon{width:1rem;height:1rem;fill:var(--blockout__colours__surface--600)}.component-select-control__popover__search{width:100%;padding:.375rem .675rem;min-height:40px}.component-select-control__popover__search:focus{outline:none}.component-select-control__option{display:flex;justify-content:start;align-items:start;flex-direction:column;gap:.25rem;padding:.375rem .675rem;min-height:40px;cursor:pointer;transition:background-color .25s ease}.component-select-control__option:focus{outline:none}.component-select-control__option:first-child{border-top:none}.component-select-control__option__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-select-control__option__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-select-control__option[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-select-control__option[data-active-item=true] .component-select-control__option__label{color:var(--blockout__colours__primary--950)}.component-select-control__option[data-active-item=true] .component-select-control__option__description{color:var(--blockout__colours__primary--900);opacity:.7}
+.component-select-control__input{cursor:pointer;display:flex;width:100%}.component-select-control__input:focus{outline:none}.component-select-control__value{flex-grow:1;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;text-align:left;background-color:transparent;transition:background-color .25s ease}.component-select-control__input:disabled .component-select-control__value{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}.component-select-control__value:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret{width:2rem;display:flex;justify-content:center;align-items:center;border-left:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:background-color .25s ease}.component-select-control__caret:hover{background-color:var(--blockout__colours__surface--50)}.component-select-control__caret>svg{width:.75rem;height:.75rem;fill:currentColor}.component-select-control__popover__wrapper{z-index:9999!important}.component-select-control__popover{background-color:var(--blockout__colours__surface--0);border:1px solid var(--blockout__colours__surface--300);box-shadow:0 .175rem .375rem #0000001a;width:calc(var(--popover-anchor-width) + 2px);max-height:var(--popover-available-height);overflow-y:auto}.component-select-control__popover:focus{outline:none}.component-select-control__list{display:flex;flex-direction:column;gap:.325rem;padding:.325rem}.component-select-control__list:focus{outline:none}.component-select-control__popover__search-wrapper{display:flex;align-items:center;gap:0;padding-left:1rem;border-bottom:1px solid var(--blockout__colours__surface--300)}.component-select-control__popover__search-icon{width:1rem;height:1rem;fill:var(--blockout__colours__surface--600)}.component-select-control__popover__search{width:100%;padding:.375rem .675rem;min-height:40px}.component-select-control__popover__search:focus{outline:none}.component-select-control__option{display:flex;justify-content:start;align-items:start;flex-direction:column;gap:.25rem;padding:.375rem .675rem;min-height:40px;cursor:pointer;transition:background-color .25s ease}.component-select-control__option:focus{outline:none}.component-select-control__option:first-child{border-top:none}.component-select-control__option[aria-disabled=true] .component-select-control__option__label{color:var(--blockout__colours__surface--400)}.component-select-control__option[aria-disabled=true] .component-select-control__option__description{color:var(--blockout__colours__surface--300)}.component-select-control__option__label{font-weight:500;color:var(--blockout__colours__surface--950);transition:color .25s ease}.component-select-control__option__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-select-control__option[data-active-item=true]{background-color:var(--blockout__colours__primary--50)}.component-select-control__option[data-active-item=true] .component-select-control__option__label{color:var(--blockout__colours__primary--950)}.component-select-control__option[data-active-item=true] .component-select-control__option__description{color:var(--blockout__colours__primary--900);opacity:.7}

package/dist/assets/index2.css

@@ -1 +1 @@
-.component-toggle-control__buttons{display:flex;overflow:hidden}.component-toggle-control__on,.component-toggle-control__off{padding:.75rem;min-height:40px;width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;font-weight:500;flex-basis:50%;cursor:pointer;position:relative;transition:color .25s ease,background-color .25s ease}.component-toggle-control__off{border-right:1px solid var(--blockout__colours__surface--300)}.component-toggle-control__on,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--600);box-shadow:none;z-index:1}.component-toggle-control__off,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--0);color:var(--blockout__colours__surface--950);box-shadow:0 0 .75rem .125rem #0003;z-index:2}
+.component-toggle-control__buttons{display:flex;overflow:hidden}.component-toggle-control__on,.component-toggle-control__off{padding:.75rem;min-height:40px;width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;font-weight:500;flex-basis:50%;cursor:pointer;position:relative;transition:color .25s ease,background-color .25s ease}.component-toggle-control__off{border-right:1px solid var(--blockout__colours__surface--300)}.component-toggle-control__on,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--600);box-shadow:none;z-index:1}.component-toggle-control__off,.component-toggle-control__buttons:has(input:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--0);color:var(--blockout__colours__surface--950);box-shadow:0 0 .75rem .125rem #0003;z-index:2}.component-toggle-control__buttons:has(input:disabled) .component-toggle-control__on,.component-toggle-control__buttons:has(input:disabled:checked) .component-toggle-control__off{background-color:var(--blockout__colours__surface--300);color:var(--blockout__colours__surface--400)}.component-toggle-control__buttons:has(input:disabled) .component-toggle-control__off,.component-toggle-control__buttons:has(input:disabled:checked) .component-toggle-control__on{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}

package/dist/assets/index5.css

@@ -1 +1 @@
-.component-base-control{display:flex;flex-direction:column}.component-base-control__label{display:block;font-weight:500;color:var(--blockout__colours__surface--950);font-size:.75rem;text-transform:uppercase;padding-bottom:.375rem}.component-base-control__label__required{color:#df1414;padding-left:.25rem}.component-base-control__box{display:flex;flex-direction:row;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);transition:outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-base-control__box:focus-within{background-color:var(--blockout__colours__surface--0);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-base-control__control{flex-grow:1}.component-base-control__control>input,.component-base-control__control>select,.component-base-control__control>textarea{display:block;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;background-color:transparent;transition:background-color .25s ease}.component-base-control__control>input:hover,.component-base-control__control>select:hover,.component-base-control__control>textarea:hover{background-color:var(--blockout__colours__surface--50)}.component-base-control__control>input:focus,.component-base-control__control>select:focus,.component-base-control__control>textarea:focus{background-color:transparent;outline:none}.component-base-control__help{margin-top:.25rem;max-width:65ch;font-size:.75rem;font-weight:400;color:var(--blockout__colours__surface--600)}fieldset.component-base-control .component-base-control__box{border:none}fieldset.component-base-control .component-base-control__box:focus-within{outline:none}fieldset.component-base-control .component-base-control__help{order:-1;margin-top:0;margin-bottom:.75rem}
+.component-base-control{display:flex;flex-direction:column}.component-base-control__label{display:block;font-weight:500;color:var(--blockout__colours__surface--950);font-size:.75rem;text-transform:uppercase;padding-bottom:.375rem}.component-base-control__label__required{color:#df1414;padding-left:.25rem}.component-base-control__box{display:flex;flex-direction:row;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);transition:outline .25s ease,outline-offset .25s ease,border-color .25s ease,color .25s ease}.component-base-control__box:focus-within{background-color:var(--blockout__colours__surface--0);outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-base-control__control{flex-grow:1}.component-base-control__control>input,.component-base-control__control>select,.component-base-control__control>textarea{display:block;padding:.75rem;min-height:40px;width:100%;min-width:0;max-width:100%;color:var(--blockout__colours__surface--800);font-size:1rem;background-color:transparent;transition:background-color .25s ease}.component-base-control__control>input:hover,.component-base-control__control>select:hover,.component-base-control__control>textarea:hover{background-color:var(--blockout__colours__surface--50)}.component-base-control__control>input:focus,.component-base-control__control>select:focus,.component-base-control__control>textarea:focus{background-color:transparent;outline:none}.component-base-control__control>input:disabled,.component-base-control__control>select:disabled,.component-base-control__control>textarea:disabled{background-color:var(--blockout__colours__surface--200);color:var(--blockout__colours__surface--400)}.component-base-control__help{margin-top:.25rem;max-width:65ch;font-size:.75rem;font-weight:400;color:var(--blockout__colours__surface--600)}fieldset.component-base-control .component-base-control__box{border:none}fieldset.component-base-control .component-base-control__box:focus-within{outline:none}fieldset.component-base-control .component-base-control__help{order:-1;margin-top:0;margin-bottom:.75rem}

package/dist/assets/index6.css

@@ -1 +1 @@
-.component-choice-control__choices{display:grid;gap:1.5rem}@media (min-width: 768px){.component-choice-control__choices{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1024px){.component-choice-control__choices{grid-template-columns:repeat(3,minmax(0,1fr))}}.component-choice-control__choice{display:flex;flex-direction:row;align-items:baseline;gap:.75rem;padding:1rem;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--200);cursor:pointer;transition:background-color .25s ease,outline .25s ease,outline-offset .25s ease}.component-choice-control__choice:focus-within{outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-choice-control__choice:has(input:checked){background-color:var(--blockout__colours__surface--0)}.component-choice-control__choice__icon{position:relative;border:2px solid var(--blockout__colours__surface--300);width:1rem;height:1rem;transition:border-color .25s ease;border-radius:2px;transform:translateY(.125rem)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon{border-color:var(--blockout__colours__surface--950)}.component-choice-control__choice__icon:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:scale(0);display:block;background-color:var(--blockout__colours__primary--950);transition:transform .15s ease;border-radius:1px}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon:after{transform:scale(.75)}.component-choice-control__choice--single .component-choice-control__choice__icon{border-radius:1rem}.component-choice-control__choice--single .component-choice-control__choice__icon:after{border-radius:1rem}.component-choice-control__choice__label{font-weight:500;color:var(--blockout__colours__surface--600);transition:color .25s ease}.component-choice-control__choice__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__surface--950)}
+.component-choice-control__choices{display:grid;gap:1.5rem}@media (min-width: 768px){.component-choice-control__choices{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width: 1024px){.component-choice-control__choices{grid-template-columns:repeat(3,minmax(0,1fr))}}.component-choice-control__choice{padding:.325rem;border:1px solid var(--blockout__colours__surface--300);background-color:var(--blockout__colours__surface--0);cursor:pointer;transition:outline .25s ease,outline-offset .25s ease}.component-choice-control__choice__body{display:flex;flex-direction:row;align-items:baseline;gap:.75rem;padding:.675rem}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__body{background-color:var(--blockout__colours__primary--50)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__primary--950)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__description{color:var(--blockout__colours__primary--900);opacity:.7}.component-choice-control__choice:focus-within{outline:1px solid var(--blockout__colours__surface--950);outline-offset:4px}.component-choice-control__choice:has(input:disabled){background-color:var(--blockout__colours__surface--200)}.component-choice-control__choice:has(input:disabled) .component-choice-control__choice__label,.component-choice-control__choice:has(input:disabled) .component-choice-control__choice__description{color:var(--blockout__colours__surface--400)}.component-choice-control__choice__icon{position:relative;border:2px solid var(--blockout__colours__surface--300);width:1rem;height:1rem;transition:border-color .25s ease;border-radius:2px;transform:translateY(.125rem)}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon{border-color:var(--blockout__colours__primary--950)}.component-choice-control__choice__icon:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:scale(0);display:block;background-color:var(--blockout__colours__primary--700);transition:transform .15s ease;border-radius:1px}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__icon:after{transform:scale(.75)}.component-choice-control__choice--single .component-choice-control__choice__icon{border-radius:1rem}.component-choice-control__choice--single .component-choice-control__choice__icon:after{border-radius:1rem}.component-choice-control__choice__label{font-weight:500;color:var(--blockout__colours__surface--600);transition:color .25s ease}.component-choice-control__choice__description{font-weight:400;color:var(--blockout__colours__surface--500);font-size:.875rem;transition:color .25s ease,opacity .25s ease}.component-choice-control__choice:has(input:checked) .component-choice-control__choice__label{color:var(--blockout__colours__surface--950)}

package/dist/components/controls/choice-control/choice.js

@@ -1,19 +1,19 @@
-import { jsxs as n, jsx as c } from "react/jsx-runtime";
+import { jsx as c, jsxs as n } from "react/jsx-runtime";
 import { cn as m } from "../../../utils/css.js";
 import { useId as s } from "react";
 import '../../../assets/style.css';/* empty css                      */
 import { VisuallyHidden as a } from "../../../primitives/visually-hidden/index.js";
 const x = ({
   value: t,
-  label: r,
+  label: l,
   description: o,
-  disabled: l,
+  disabled: r,
   multiple: e = !1,
   className: _,
   ...h
 }) => {
   const i = s();
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ c(
     "label",
     {
       className: m(
@@ -22,7 +22,7 @@ const x = ({
         _
       ),
       htmlFor: i,
-      children: [
+      children: /* @__PURE__ */ n("div", { className: "component-choice-control__choice__body", children: [
         /* @__PURE__ */ c(a, { children: /* @__PURE__ */ c(
           "input",
           {
@@ -31,7 +31,7 @@ const x = ({
             id: i,
             type: e ? "checkbox" : "radio",
             value: t,
-            disabled: l
+            disabled: r
           }
         ) }),
         /* @__PURE__ */ c(
@@ -42,10 +42,10 @@ const x = ({
           }
         ),
         /* @__PURE__ */ n("div", { className: "component-choice-control__choice__text", children: [
-          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: r }),
+          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: l }),
           o && /* @__PURE__ */ c("p", { className: "component-choice-control__choice__description", children: o })
         ] })
-      ]
+      ] })
     }
   );
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wrdagency/blockout",
-	"version": "0.0.10",
+	"version": "0.0.11",
 	"description": "A React component library created by WRD.agency",
 	"type": "module",
 	"main": "dist/index.js",