@malloy-publisher/sdk 0.0.198-dev → 0.0.198-dev2

package/src/components/Model/Model.tsx

@@ -114,7 +114,7 @@ export default function Model({
                            <LinkOutlinedIcon
                               sx={{
                                  fontSize: "24px",
-                                 color: "#666666",
+                                 color: "text.secondary",
                                  cursor: "pointer",
                               }}
                               onClick={copyToClipboard}
@@ -150,7 +150,7 @@ export default function Model({
                         <SearchIcon
                            sx={{
                               fontSize: "18px",
-                              color: "#666666",
+                              color: "text.secondary",
                               marginBottom: "5px",
                            }}
                         />

package/src/components/Model/ModelCell.tsx

@@ -123,7 +123,7 @@ export function ModelCell({
                }}
                onClick={() => setResultsDialogOpen(true)}
             >
-               <SearchIcon sx={{ fontSize: "18px", color: "#666666" }} />
+               <SearchIcon sx={{ fontSize: "18px", color: "text.secondary" }} />
             </IconButton>
          </Box>
 

package/src/components/Model/ModelExplorerDialog.tsx

@@ -40,7 +40,7 @@ export function ModelExplorerDialog({
             }}
          >
             {title}
-            <IconButton onClick={onClose} sx={{ color: "#666666" }}>
+            <IconButton onClick={onClose} sx={{ color: "text.secondary" }}>
                <CloseIcon />
             </IconButton>
          </DialogTitle>

package/src/components/Model/SourcesExplorer.tsx

@@ -348,16 +348,16 @@ export function SourceExplorerComponent(props: SourceExplorerComponentProps) {
       return (
          <StyledExplorerPage>
             <StyledExplorerContent>
-               <div
-                  style={{
+               <Box
+                  sx={{
                      alignItems: "center",
                      justifyContent: "center",
                      height: "200px",
-                     color: "#666",
+                     color: "text.secondary",
                   }}
                >
                   Loading explorer...
-               </div>
+               </Box>
             </StyledExplorerContent>
          </StyledExplorerPage>
       );

package/src/components/Notebook/Notebook.tsx

@@ -453,14 +453,9 @@ export default function Notebook({
                      elevation={0}
                      sx={{
                         p: 3,
-                        backgroundColor: "#ffffff",
-                        border: "1px solid #f0f0f0",
-                        borderRadius: 2,
-                        boxShadow: "0 1px 3px rgba(0, 0, 0, 0.04)",
-                        transition: "box-shadow 0.2s ease-in-out",
-                        "&:hover": {
-                           boxShadow: "0 2px 6px rgba(0, 0, 0, 0.08)",
-                        },
+                        backgroundColor: "transparent",
+                        border: "none",
+                        boxShadow: "none",
                      }}
                   >
                      <Typography
@@ -532,7 +527,7 @@ export default function Notebook({
 
                {/* Error States */}
                {isError && error.status === 404 && (
-                  <Typography variant="body2" sx={{ color: "#666666" }}>
+                  <Typography variant="body2" sx={{ color: "text.secondary" }}>
                      <code>{`${environmentName} > ${packageName} > ${notebookPath}`}</code>{" "}
                      not found.
                   </Typography>

package/src/components/Notebook/NotebookCell.tsx

@@ -193,7 +193,7 @@ export function NotebookCell({
                         <LinkOutlinedIcon
                            sx={{
                               fontSize: "24px",
-                              color: "#666666",
+                              color: "text.secondary",
                               cursor: "pointer",
                               marginTop: "26px",
                            }}
@@ -270,7 +270,10 @@ export function NotebookCell({
                                  onClick={() => setSourcesDialogOpen(true)}
                               >
                                  <SearchIcon
-                                    sx={{ fontSize: "18px", color: "#666666" }}
+                                    sx={{
+                                       fontSize: "18px",
+                                       color: "text.secondary",
+                                    }}
                                  />
                               </IconButton>
                            )}
@@ -308,7 +311,7 @@ export function NotebookCell({
                   Malloy Code
                   <IconButton
                      onClick={() => setCodeDialogOpen(false)}
-                     sx={{ color: "#666666" }}
+                     sx={{ color: "text.secondary" }}
                   >
                      <CloseIcon />
                   </IconButton>
@@ -357,7 +360,7 @@ export function NotebookCell({
                   Embeddable Code
                   <IconButton
                      onClick={() => setEmbeddingDialogOpen(false)}
-                     sx={{ color: "#666666" }}
+                     sx={{ color: "text.secondary" }}
                   >
                      <CloseIcon />
                   </IconButton>
@@ -388,7 +391,7 @@ export function NotebookCell({
                               width: "24px",
                               height: "24px",
                               marginLeft: "8px",
-                              color: "#666666",
+                              color: "text.secondary",
                            }}
                            onClick={() => {
                               navigator.clipboard.writeText(
@@ -474,7 +477,7 @@ export function NotebookCell({
                            }}
                         >
                            <CodeIcon
-                              sx={{ fontSize: "18px", color: "#666666" }}
+                              sx={{ fontSize: "18px", color: "text.secondary" }}
                            />
                         </IconButton>
                      )}
@@ -490,7 +493,7 @@ export function NotebookCell({
                         onClick={() => setResultsDialogOpen(true)}
                      >
                         <SearchIcon
-                           sx={{ fontSize: "18px", color: "#666666" }}
+                           sx={{ fontSize: "18px", color: "text.secondary" }}
                         />
                      </IconButton>
                   </Stack>

package/src/components/Package/ContentTypeIcon.tsx

@@ -0,0 +1,79 @@
+import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon";
+
+type ContentType = "report" | "model" | "data";
+
+interface ContentTypeIconProps extends Omit<SvgIconProps, "fontSize"> {
+   type: ContentType;
+   /** Pixel size of the rendered icon. */
+   size?: number;
+}
+
+/**
+ * Inline SVGs that visually match Central Icons'
+ * round-outlined-radius-2-stroke-1 family
+ * (IconFileChart, Icon3dBoxTop, IconTable) used by the Credible app.
+ * Reimplemented as plain SVG so the open-source SDK does not pick up
+ * the paid @central-icons-react dependency.
+ */
+export default function ContentTypeIcon({
+   type,
+   size = 18,
+   sx,
+   ...rest
+}: ContentTypeIconProps) {
+   return (
+      <SvgIcon
+         {...rest}
+         viewBox="0 0 24 24"
+         sx={{
+            width: size,
+            height: size,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: 1.5,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            ...sx,
+         }}
+      >
+         {type === "report" && <FileChartPath />}
+         {type === "model" && <BoxTopPath />}
+         {type === "data" && <TablePath />}
+      </SvgIcon>
+   );
+}
+
+/** File outline with a folded top-right corner and three chart bars inside. */
+function FileChartPath() {
+   return (
+      <>
+         <path d="M14 3 H6 a2 2 0 0 0 -2 2 v14 a2 2 0 0 0 2 2 h12 a2 2 0 0 0 2 -2 V9 z" />
+         <path d="M14 3 v4 a2 2 0 0 0 2 2 h4" />
+         <path d="M8 17 v-3" />
+         <path d="M12 17 v-6" />
+         <path d="M16 17 v-4" />
+      </>
+   );
+}
+
+/** Cube viewed from above with visible top face — matches Icon3dBoxTop. */
+function BoxTopPath() {
+   return (
+      <>
+         <path d="M12 3 L4 7 v10 l8 4 l8 -4 V7 z" />
+         <path d="M4 7 l8 4 l8 -4" />
+         <path d="M12 11 v10" />
+      </>
+   );
+}
+
+/** Rounded grid icon — matches IconTable. */
+function TablePath() {
+   return (
+      <>
+         <rect x="3.5" y="3.5" width="17" height="17" rx="2" />
+         <path d="M3.5 9.5 H20.5" />
+         <path d="M9.5 3.5 V20.5" />
+      </>
+   );
+}