@theroutingcompany/components 0.0.24-alpha.6 → 0.0.25-alpha.6

package/README.md

@@ -2,6 +2,10 @@
 
 View the [StoryBook](https://6392297e45ccab79e466ee19-iytnzjepcr.chromatic.com/).
 
+## Developing Locally
+
+Clone the dashboard repo at the same level as this one. Then run `npm link ../component-library` from the dashboard repo. Then run `npm run dev` from the component library repo. This will make hot module reloading within dash work with the changes you make to the component files.
+
 ## Publishing
 
 First double check if everything that needs to exported is added to the `components/index.js` or `helpers/index.js` and run `npm run build` before.

package/dist/trc-components.es.js

@@ -10787,7 +10787,7 @@ const a3 = Rb, i3 = Q7, s3 = t3, l3 = r3, c3 = o3, d3 = Me`
   letter-spacing: ${m.letter_spacing_body_medium};
   color: black; /* Static/Text/Primary/Default */
 `, TA = () => /* @__PURE__ */ S(ro, { asChild: !0, children: /* @__PURE__ */ S(Yn, { label: "Close drawer", variant: "inverse", children: /* @__PURE__ */ S(lp, {}) }) }), f3 = A(jl)`
-  width: var(--drawer-width);
+  ${({ width: e }) => e && `width: ${e};`}
   z-index: 3;
   background-color: white;
   padding: 24px;
@@ -10829,12 +10829,20 @@ const a3 = Rb, i3 = Q7, s3 = t3, l3 = r3, c3 = o3, d3 = Me`
   letter-spacing: ${m.letter_spacing_body_medium};
   color: black; /* Static/Text/Primary/Default */
 `, m3 = {
-  medium: 540,
-  large: 900
+  small: "20vw",
+  medium: "40vw",
+  large: "60vw"
 };
 function RA({ children: e, size: t = "medium", ...r }) {
   const n = m3[t];
-  return /* @__PURE__ */ S(Vl, { ...r, style: { "--drawer-width": n }, children: /* @__PURE__ */ S(f3, { onInteractOutside: (o) => o.preventDefault(), children: e }) });
+  return /* @__PURE__ */ S(Vl, { ...r, children: /* @__PURE__ */ S(
+    f3,
+    {
+      width: n,
+      onInteractOutside: (o) => o.preventDefault(),
+      children: e
+    }
+  ) });
 }
 const IA = a3, AA = A(i3)`
   padding-top: 12px;