@nswds/app 1.76.1 → 1.77.0

package/dist/index.d.cts

@@ -589,7 +589,7 @@ interface IFrameOptions {
 }
 interface BaseCodeData<T extends 'single' | 'variant'> {
     type: T;
-    githubSlug: string;
+    githubSlug?: string;
     figmaSlug?: string;
     component: React.ReactNode;
 }
@@ -618,6 +618,9 @@ interface CodeDemoProps {
         rtl?: boolean;
         darkMode?: boolean;
         themeSelector?: boolean;
+        displayCode?: boolean;
+        viewToggle?: boolean;
+        copyButton?: boolean;
     };
 }
 interface CodeHighlightProps extends React.ComponentProps<'pre'> {

package/dist/index.d.ts

@@ -589,7 +589,7 @@ interface IFrameOptions {
 }
 interface BaseCodeData<T extends 'single' | 'variant'> {
     type: T;
-    githubSlug: string;
+    githubSlug?: string;
     figmaSlug?: string;
     component: React.ReactNode;
 }
@@ -618,6 +618,9 @@ interface CodeDemoProps {
         rtl?: boolean;
         darkMode?: boolean;
         themeSelector?: boolean;
+        displayCode?: boolean;
+        viewToggle?: boolean;
+        copyButton?: boolean;
     };
 }
 interface CodeHighlightProps extends React.ComponentProps<'pre'> {

package/dist/index.js

@@ -14176,7 +14176,14 @@ function CodeDemoLoading() {
 function CodeDemoContent({ data, hide = {} }) {
   const { resolvedTheme } = useTheme();
   const searchParams = useSearchParams();
-  const { rtl = false, darkMode = false, themeSelector = false } = hide;
+  const {
+    rtl = false,
+    darkMode = false,
+    themeSelector = false,
+    displayCode = true,
+    viewToggle = true,
+    copyButton = true
+  } = hide;
   const [tabIndex, setTabIndex] = useState(0);
   const [variant, setVariant] = useState(getInitialVariant(data));
   const [view, setView] = useState("desktop");
@@ -14346,9 +14353,9 @@ function CodeDemoContent({ data, hide = {} }) {
   }, [themeCategory, primaryColor, accentColor, greyColor, isThemeInitialized]);
   return /* @__PURE__ */ jsxs("div", { className: "mt-8", children: [
     /* @__PURE__ */ jsx("div", { className: "w-full rounded-t-xl border border-grey-200 bg-grey-50 p-4 dark:border-grey-600 dark:bg-grey-700", children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 sm:grid-cols-3", children: [
-      /* @__PURE__ */ jsx(EditOnGithubButton, { githubSlug: data.githubSlug }),
+      data.githubSlug && /* @__PURE__ */ jsx(EditOnGithubButton, { githubSlug: data.githubSlug }),
       data.figmaSlug && /* @__PURE__ */ jsx(OpenInFigmaButton, { figmaSlug: data.figmaSlug }),
-      /* @__PURE__ */ jsx(ToggleViewButtons, { onSelect: setView }),
+      viewToggle && /* @__PURE__ */ jsx(ToggleViewButtons, { onSelect: setView }),
       /* @__PURE__ */ jsxs("div", { className: "col-span-1 flex justify-end gap-3", children: [
         !themeSelector && /* @__PURE__ */ jsx(
           ThemeSelectorDropDown,
@@ -14394,7 +14401,7 @@ function CodeDemoContent({ data, hide = {} }) {
         ) : /* @__PURE__ */ jsx(Fragment, { children: data.component })
       }
     ),
-    /* @__PURE__ */ jsx("div", { className: "code-syntax-wrapper", children: /* @__PURE__ */ jsxs(
+    displayCode && /* @__PURE__ */ jsx("div", { className: "code-syntax-wrapper", children: /* @__PURE__ */ jsxs(
       "div",
       {
         className: twMerge(
@@ -14408,7 +14415,7 @@ function CodeDemoContent({ data, hide = {} }) {
               /* @__PURE__ */ jsx(SelectTrigger, { size: "sm", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select a variant" }) }),
               /* @__PURE__ */ jsx(SelectContent, { children: variants.map((v) => /* @__PURE__ */ jsx(SelectItem, { value: v, children: variantLabels[v] }, v)) })
             ] }),
-            /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx("div", { className: "flex justify-end", children: copyButton && /* @__PURE__ */ jsx(
               CopyToClipboardButton,
               {
                 isJustCopied,
@@ -14416,14 +14423,20 @@ function CodeDemoContent({ data, hide = {} }) {
               }
             ) })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: twMerge("!overflow-y-hidden", shouldExpand && !isExpanded && "max-h-72"), children: /* @__PURE__ */ jsx(
-            CodeHighlight,
+          /* @__PURE__ */ jsx(
+            "div",
             {
-              className: "!mb-0 !rounded-none",
-              code: current.code,
-              language: current.language
+              className: twMerge("!overflow-y-hidden", shouldExpand && !isExpanded && "max-h-72"),
+              children: /* @__PURE__ */ jsx(
+                CodeHighlight,
+                {
+                  className: "!mb-0 !rounded-none",
+                  code: current.code,
+                  language: current.language
+                }
+              )
             }
-          ) }),
+          ),
           shouldExpand && /* @__PURE__ */ jsx(
             CollapseExpandButton,
             {
@@ -17412,7 +17425,7 @@ function FormatToggle({ format, setFormat }) {
 
 // package.json
 var package_default = {
-  version: "1.75.0"};
+  version: "1.76.0"};
 var SluggerContext = React5__default.createContext(null);
 function flattenText(nodes) {
   if (nodes == null || typeof nodes === "boolean") return "";