@kushagradhawan/kookie-blocks 0.1.6 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.css +67 -64
- package/dist/cjs/components/code/CodeBlock.d.ts +2 -1
- package/dist/cjs/components/code/CodeBlock.d.ts.map +1 -1
- package/dist/cjs/components/code/CodeBlock.js +1 -1
- package/dist/cjs/components/code/CodeBlock.js.map +3 -3
- package/dist/cjs/components/code/LanguageBadge.d.ts +9 -0
- package/dist/cjs/components/code/LanguageBadge.d.ts.map +1 -1
- package/dist/cjs/components/code/LanguageBadge.js +1 -1
- package/dist/cjs/components/code/LanguageBadge.js.map +3 -3
- package/dist/cjs/components/code/index.d.ts +5 -2
- package/dist/cjs/components/code/index.d.ts.map +1 -1
- package/dist/cjs/components/code/index.js +1 -1
- package/dist/cjs/components/code/index.js.map +3 -3
- package/dist/cjs/components/code/types.d.ts +132 -13
- package/dist/cjs/components/code/types.d.ts.map +1 -1
- package/dist/cjs/components/code/types.js +1 -1
- package/dist/cjs/components/code/types.js.map +3 -3
- package/dist/cjs/components/code/useCodeCard.d.ts +20 -0
- package/dist/cjs/components/code/useCodeCard.d.ts.map +1 -0
- package/dist/cjs/components/code/useCodeCard.js +2 -0
- package/dist/cjs/components/code/useCodeCard.js.map +7 -0
- package/dist/esm/components/code/CodeBlock.d.ts +2 -1
- package/dist/esm/components/code/CodeBlock.d.ts.map +1 -1
- package/dist/esm/components/code/CodeBlock.js +1 -1
- package/dist/esm/components/code/CodeBlock.js.map +3 -3
- package/dist/esm/components/code/LanguageBadge.d.ts +9 -0
- package/dist/esm/components/code/LanguageBadge.d.ts.map +1 -1
- package/dist/esm/components/code/LanguageBadge.js +1 -1
- package/dist/esm/components/code/LanguageBadge.js.map +3 -3
- package/dist/esm/components/code/index.d.ts +5 -2
- package/dist/esm/components/code/index.d.ts.map +1 -1
- package/dist/esm/components/code/index.js +1 -1
- package/dist/esm/components/code/index.js.map +3 -3
- package/dist/esm/components/code/types.d.ts +132 -13
- package/dist/esm/components/code/types.d.ts.map +1 -1
- package/dist/esm/components/code/types.js +1 -0
- package/dist/esm/components/code/types.js.map +4 -4
- package/dist/esm/components/code/useCodeCard.d.ts +20 -0
- package/dist/esm/components/code/useCodeCard.d.ts.map +1 -0
- package/dist/esm/components/code/useCodeCard.js +2 -0
- package/dist/esm/components/code/useCodeCard.js.map +7 -0
- package/package.json +1 -1
- package/src/components/code/CodeBlock.tsx +252 -330
- package/src/components/code/LanguageBadge.tsx +65 -18
- package/src/components/code/index.ts +6 -3
- package/src/components/code/types.ts +219 -27
- package/src/components/code/useCodeCard.ts +82 -0
- package/src/components/index.css +64 -62
- package/styles.css +60 -59
package/components.css
CHANGED
|
@@ -18,74 +18,46 @@
|
|
|
18
18
|
position: relative;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
/*
|
|
21
|
+
/* Pre elements inside code content */
|
|
22
22
|
|
|
23
|
-
.code-
|
|
23
|
+
.code-content pre {
|
|
24
|
+
margin: 0;
|
|
24
25
|
width: 100%;
|
|
25
|
-
|
|
26
|
+
box-sizing: border-box;
|
|
27
|
+
font-family: var(--font-mono);
|
|
28
|
+
font-size: var(--font-size-2);
|
|
29
|
+
line-height: 1.75;
|
|
30
|
+
padding: var(--space-3);
|
|
26
31
|
overflow-x: auto;
|
|
27
|
-
/* Hide scrollbars while keeping scroll functionality */
|
|
28
|
-
scrollbar-width: none; /* Firefox */
|
|
29
|
-
-ms-overflow-style: none; /* IE/Edge */
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
/* Hide scrollbars for webkit browsers */
|
|
33
|
-
|
|
34
|
-
.code-block-content::-webkit-scrollbar,
|
|
35
|
-
.code-block-content::-webkit-scrollbar-horizontal,
|
|
36
|
-
.code-block-content::-webkit-scrollbar-vertical,
|
|
37
|
-
.code-block-content::-webkit-scrollbar-track,
|
|
38
|
-
.code-block-content::-webkit-scrollbar-thumb,
|
|
39
|
-
.code-block-content::-webkit-scrollbar-corner {
|
|
40
|
-
display: none !important;
|
|
41
|
-
width: 0 !important;
|
|
42
|
-
height: 0 !important;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
/* Also hide scrollbars on any pre/code elements inside code content */
|
|
46
|
-
|
|
47
|
-
.code-block-content pre::-webkit-scrollbar,
|
|
48
|
-
.code-block-content pre::-webkit-scrollbar-horizontal,
|
|
49
|
-
.code-block-content pre::-webkit-scrollbar-vertical,
|
|
50
|
-
.code-block-content pre::-webkit-scrollbar-track,
|
|
51
|
-
.code-block-content pre::-webkit-scrollbar-thumb,
|
|
52
|
-
.code-block-content pre::-webkit-scrollbar-corner,
|
|
53
|
-
.code-block-content code::-webkit-scrollbar,
|
|
54
|
-
.code-block-content code::-webkit-scrollbar-horizontal,
|
|
55
|
-
.code-block-content code::-webkit-scrollbar-vertical,
|
|
56
|
-
.code-block-content code::-webkit-scrollbar-track,
|
|
57
|
-
.code-block-content code::-webkit-scrollbar-thumb,
|
|
58
|
-
.code-block-content code::-webkit-scrollbar-corner {
|
|
59
|
-
display: none !important;
|
|
60
|
-
width: 0 !important;
|
|
61
|
-
height: 0 !important;
|
|
62
32
|
}
|
|
63
33
|
|
|
64
|
-
/*
|
|
34
|
+
/* Rehype-pretty-code theme support */
|
|
65
35
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
overflow-x: visible;
|
|
69
|
-
max-width: 100%;
|
|
70
|
-
min-width: 0;
|
|
71
|
-
margin: 0;
|
|
72
|
-
width: 100%;
|
|
73
|
-
box-sizing: border-box;
|
|
74
|
-
scrollbar-width: none;
|
|
75
|
-
-ms-overflow-style: none;
|
|
36
|
+
pre[data-theme] code {
|
|
37
|
+
background: none !important;
|
|
76
38
|
}
|
|
77
39
|
|
|
78
|
-
|
|
40
|
+
pre[data-theme] code span {
|
|
41
|
+
color: var(--shiki-light);
|
|
42
|
+
font-style: var(--shiki-light-font-style);
|
|
43
|
+
font-weight: var(--shiki-light-font-weight);
|
|
44
|
+
-webkit-text-decoration: var(--shiki-light-text-decoration);
|
|
45
|
+
text-decoration: var(--shiki-light-text-decoration);
|
|
46
|
+
}
|
|
79
47
|
|
|
80
|
-
.
|
|
81
|
-
|
|
82
|
-
|
|
48
|
+
.dark pre[data-theme] code span,
|
|
49
|
+
.dark-theme pre[data-theme] code span,
|
|
50
|
+
[data-appearance="dark"] pre[data-theme] code span {
|
|
51
|
+
color: var(--shiki-dark) !important;
|
|
52
|
+
font-style: var(--shiki-dark-font-style) !important;
|
|
53
|
+
font-weight: var(--shiki-dark-font-weight) !important;
|
|
54
|
+
-webkit-text-decoration: var(--shiki-dark-text-decoration) !important;
|
|
55
|
+
text-decoration: var(--shiki-dark-text-decoration) !important;
|
|
83
56
|
}
|
|
84
57
|
|
|
85
58
|
/* Code elements inside pre */
|
|
86
59
|
|
|
87
|
-
.code-content pre code
|
|
88
|
-
.code-block-content pre code {
|
|
60
|
+
.code-content pre code {
|
|
89
61
|
font-family: var(--font-mono);
|
|
90
62
|
font-size: var(--font-size-2);
|
|
91
63
|
line-height: 1.75;
|
|
@@ -98,17 +70,15 @@
|
|
|
98
70
|
|
|
99
71
|
/* Shiki line spans */
|
|
100
72
|
|
|
101
|
-
.code-content pre code .line
|
|
102
|
-
.code-block-content pre code .line {
|
|
73
|
+
.code-content pre code .line {
|
|
103
74
|
display: flex;
|
|
104
75
|
align-items: center;
|
|
105
76
|
gap: 0;
|
|
106
77
|
}
|
|
107
78
|
|
|
108
|
-
/* Line numbers */
|
|
79
|
+
/* Line numbers (shown by default) */
|
|
109
80
|
|
|
110
|
-
.code-content pre code .line::before
|
|
111
|
-
.code-block-content pre code .line::before {
|
|
81
|
+
.code-content pre code .line::before {
|
|
112
82
|
counter-increment: line;
|
|
113
83
|
content: counter(line);
|
|
114
84
|
display: inline-block;
|
|
@@ -123,6 +93,43 @@
|
|
|
123
93
|
margin-right: var(--space-4);
|
|
124
94
|
}
|
|
125
95
|
|
|
96
|
+
/* Hide line numbers when disabled */
|
|
97
|
+
|
|
98
|
+
.code-content.hide-line-numbers pre code .line::before {
|
|
99
|
+
display: none;
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
/* Loading skeleton */
|
|
103
|
+
|
|
104
|
+
.code-skeleton {
|
|
105
|
+
display: flex;
|
|
106
|
+
flex-direction: column;
|
|
107
|
+
gap: var(--space-2);
|
|
108
|
+
padding: var(--space-3);
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
.code-skeleton-line {
|
|
112
|
+
height: 1em;
|
|
113
|
+
background: linear-gradient(
|
|
114
|
+
90deg,
|
|
115
|
+
var(--gray-a3) 0%,
|
|
116
|
+
var(--gray-a4) 50%,
|
|
117
|
+
var(--gray-a3) 100%
|
|
118
|
+
);
|
|
119
|
+
background-size: 200% 100%;
|
|
120
|
+
animation: code-skeleton-shimmer 1.5s ease-in-out infinite;
|
|
121
|
+
border-radius: var(--radius-1);
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
@keyframes code-skeleton-shimmer {
|
|
125
|
+
0% {
|
|
126
|
+
background-position: 200% 0;
|
|
127
|
+
}
|
|
128
|
+
100% {
|
|
129
|
+
background-position: -200% 0;
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
|
|
126
133
|
/* Scroll shadow overlay for collapsed state */
|
|
127
134
|
|
|
128
135
|
.code-scroll-shadow {
|
|
@@ -156,7 +163,6 @@
|
|
|
156
163
|
|
|
157
164
|
/* Default to light theme for all tokens (codeToHtml with defaultColor: false) */
|
|
158
165
|
|
|
159
|
-
.code-block-content pre.shiki span,
|
|
160
166
|
.code-content pre.shiki span {
|
|
161
167
|
color: var(--shiki-light) !important;
|
|
162
168
|
font-style: var(--shiki-light-font-style);
|
|
@@ -167,9 +173,6 @@
|
|
|
167
173
|
|
|
168
174
|
/* Override with dark theme colors when inside a dark context */
|
|
169
175
|
|
|
170
|
-
.dark .code-block-content pre.shiki span,
|
|
171
|
-
.dark-theme .code-block-content pre.shiki span,
|
|
172
|
-
[data-appearance="dark"] .code-block-content pre.shiki span,
|
|
173
176
|
.dark .code-content pre.shiki span,
|
|
174
177
|
.dark-theme .code-content pre.shiki span,
|
|
175
178
|
[data-appearance="dark"] .code-content pre.shiki span {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import type { CodeBlockProps } from "./types";
|
|
3
|
-
export declare function CodeBlock({ children, code, language, preview, showCopy, showLanguage,
|
|
3
|
+
export declare function CodeBlock({ children, code, language, preview, showCopy, showLanguage, showLineNumbers, shikiConfig, background, backgroundProps, collapsible, collapsedHeight, file, }: CodeBlockProps): React.JSX.Element;
|
|
4
|
+
export declare function useCodeBlockContext(): boolean;
|
|
4
5
|
//# sourceMappingURL=CodeBlock.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/code/CodeBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../../../src/components/code/CodeBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwF,MAAM,OAAO,CAAC;AAK7G,OAAO,KAAK,EAAE,cAAc,EAAuC,MAAM,SAAS,CAAC;AA6RnF,wBAAgB,SAAS,CAAC,EACxB,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,QAAe,EACf,YAAmB,EACnB,eAAsB,EACtB,WAAW,EACX,UAAU,EACV,eAAe,EACf,WAAkB,EAClB,eAA0C,EAC1C,IAAI,GACL,EAAE,cAAc,qBA2ChB;AAED,wBAAgB,mBAAmB,YAElC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var I=Object.create;var w=Object.defineProperty;var A=Object.getOwnPropertyDescriptor;var _=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,D=Object.prototype.hasOwnProperty;var $=(r,o)=>{for(var t in o)w(r,t,{get:o[t],enumerable:!0})},L=(r,o,t,l)=>{if(o&&typeof o=="object"||typeof o=="function")for(let s of _(o))!D.call(r,s)&&s!==t&&w(r,s,{get:()=>o[s],enumerable:!(l=A(o,s))||l.enumerable});return r};var M=(r,o,t)=>(t=r!=null?I(z(r)):{},L(o||!r||!r.__esModule?w(t,"default",{value:r,enumerable:!0}):t,r)),W=r=>L(w({},"__esModule",{value:!0}),r);var X={};$(X,{CodeBlock:()=>J,useCodeBlockContext:()=>Q});module.exports=W(X);var e=M(require("react")),n=require("@kushagradhawan/kookie-ui"),k=require("@hugeicons/react"),f=require("@hugeicons/core-free-icons"),v=require("shiki"),x=require("./types"),T=require("./useCodeCard"),N=require("./LanguageBadge");const P=(0,e.createContext)(!1),O=360,U="one-light",j="one-dark-pro";function G({children:r,background:o="none",backgroundProps:t={}}){const{dotSize:l=24,color:s="var(--gray-10)",backgroundColor:c="var(--gray-2)",height:i,width:u="100%",radius:d="3"}=t,a=(0,e.useMemo)(()=>{if(o!=="none")return o==="dots"?{backgroundImage:`radial-gradient(circle, ${s} 1px, transparent 1px)`,borderRadius:`var(--radius-${d})`,backgroundSize:`${l}px ${l}px`,backgroundPosition:"center",backgroundColor:c,width:u,...i&&{height:i}}:{backgroundImage:`url(${o})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat",borderRadius:`var(--radius-${d})`,width:u,...i&&{height:i}}},[o,s,c,l,i,u,d]);return e.default.createElement(n.Card,{size:"1",variant:"soft"},e.default.createElement(n.Flex,{justify:"center",align:"center",py:"4",style:a},e.default.createElement(n.Theme,{fontFamily:"sans"},r)))}function K(){return e.default.createElement(n.Box,{className:"code-skeleton"},["85%","70%","90%","60%","75%","80%"].map((o,t)=>e.default.createElement(n.Box,{key:t,className:"code-skeleton-line",style:{width:o}})))}const B=(0,e.memo)(function({code:o,language:t,showCopy:l,showLanguage:s,showLineNumbers:c,collapsible:i,collapsedHeight:u,file:d,isLoading:a=!1,children:h}){const{isExpanded:g,shouldShowToggle:C,copied:p,contentRef:y,contentMaxHeight:m,handleToggle:b,handleCopy:H}=(0,T.useCodeCard)({code:o,collapsedHeight:u}),S=i&&C,E=g?"rotate(180deg)":"rotate(0deg)",F=c?"code-content":"code-content hide-line-numbers";return e.default.createElement(n.Box,{position:"relative"},e.default.createElement(n.Card,{size:"1",variant:"soft"},e.default.createElement(n.Flex,{direction:"column"},e.default.createElement(n.Flex,{justify:"between",align:"start",gap:"2"},e.default.createElement(n.Flex,{align:"center",gap:"2"},s&&e.default.createElement(N.LanguageBadge,{language:t}),d&&e.default.createElement(n.Text,{size:"1",color:"gray",highContrast:!0},d)),e.default.createElement(n.Flex,{align:"center",className:"code-action-buttons"},S&&e.default.createElement(n.IconButton,{size:"2",variant:"ghost",color:"gray",highContrast:!0,onClick:b,tooltip:g?"Collapse":"Expand","aria-label":g?"Collapse code":"Expand code"},e.default.createElement(k.HugeiconsIcon,{icon:f.ArrowDown01Icon,style:{transform:E},className:"code-chevron",strokeWidth:1.75})),l&&e.default.createElement(n.Button,{size:"2",variant:"ghost",color:"gray",highContrast:!0,onClick:H,tooltip:p?"Copied!":"Copy","aria-label":p?"Copied!":"Copy code"},e.default.createElement(k.HugeiconsIcon,{icon:p?f.Tick01Icon:f.Copy01Icon,strokeWidth:1.75})," Copy"))),e.default.createElement(n.Box,{ref:y,style:{maxHeight:i?`${m}px`:void 0},className:F},e.default.createElement(n.ScrollArea,{type:"auto",scrollbars:"horizontal"},a?e.default.createElement(K,null):h)),S&&!g&&e.default.createElement(n.Box,{className:"code-scroll-shadow visible"}))))}),V=(0,e.memo)(function({code:o,language:t,showCopy:l,showLanguage:s,showLineNumbers:c,collapsible:i,collapsedHeight:u,file:d,shikiConfig:a}){const[h,g]=(0,e.useState)(null),[C,p]=(0,e.useState)(!0),y=(0,e.useMemo)(()=>{const m=a?.themes?.light||U,b=a?.themes?.dark||j;return{lang:t,themes:{light:m,dark:b},defaultColor:!1,langAlias:a?.langAlias,transformers:a?.transformers,meta:a?.meta?{__raw:a.meta}:void 0}},[t,a?.themes?.light,a?.themes?.dark,a?.langAlias,a?.transformers,a?.meta]);return(0,e.useEffect)(()=>{let m=!1;return p(!0),(0,v.codeToHtml)(o,y).then(b=>{m||(g(b),p(!1))}).catch(b=>{m||(g(null),p(!1))}),()=>{m=!0}},[o,y]),e.default.createElement(B,{code:o,language:t,showCopy:l,showLanguage:s,showLineNumbers:c,collapsible:i,collapsedHeight:u,file:d,isLoading:C},h?e.default.createElement(n.Box,{dangerouslySetInnerHTML:{__html:h}}):null)}),q=(0,e.memo)(function({children:o,showCopy:t,showLanguage:l,showLineNumbers:s,collapsible:c,collapsedHeight:i,file:u}){const d=(0,x.extractTextFromChildren)(o),a=(0,x.extractLanguageFromChildren)(o);return e.default.createElement(B,{code:d,language:a,showCopy:t,showLanguage:l,showLineNumbers:s,collapsible:c,collapsedHeight:i,file:u},o)});function J({children:r,code:o,language:t,preview:l,showCopy:s=!0,showLanguage:c=!0,showLineNumbers:i=!0,shikiConfig:u,background:d,backgroundProps:a,collapsible:h=!0,collapsedHeight:g=O,file:C}){const p=t||(0,x.extractLanguageFromChildren)(r)||"text";return e.default.createElement(P.Provider,{value:!0},e.default.createElement(n.Box,{className:"docs-code-block",mt:"6",mb:"8"},e.default.createElement(n.Flex,{direction:"column",gap:"2"},l&&e.default.createElement(G,{background:d,backgroundProps:a},l),o&&e.default.createElement(V,{code:o,language:p,showCopy:s,showLanguage:c,showLineNumbers:i,collapsible:h,collapsedHeight:g,file:C,shikiConfig:u}),r&&!o&&e.default.createElement(q,{showCopy:s,showLanguage:c,showLineNumbers:i,collapsible:h,collapsedHeight:g,file:C},r))))}function Q(){return(0,e.useContext)(P)}
|
|
2
2
|
//# sourceMappingURL=CodeBlock.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/code/CodeBlock.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { useState, useRef, useEffect, useCallback, memo, type ReactNode } from \"react\";\nimport { Box, Card, Flex, Button, Code, Theme } from \"@kushagradhawan/kookie-ui\";\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport { Copy01Icon, Tick01Icon, ArrowDown01Icon } from \"@hugeicons/core-free-icons\";\nimport { codeToHtml } from \"shiki\";\nimport type { CodeBlockProps } from \"./types\";\n\nconst COLLAPSED_HEIGHT = 360;\nconst DEFAULT_LIGHT_THEME = \"one-light\";\nconst DEFAULT_DARK_THEME = \"one-dark-pro\";\n\n// ============================================\n// Preview Section\n// ============================================\n\ninterface PreviewSectionProps {\n children: ReactNode;\n background?: \"none\" | \"dots\" | string;\n backgroundProps?: {\n dotSize?: number;\n color?: string;\n backgroundColor?: string;\n height?: string;\n width?: string;\n radius?: string;\n };\n}\n\nfunction PreviewSection({ children, background = \"none\", backgroundProps = {} }: PreviewSectionProps) {\n const { dotSize = 24, color = \"var(--gray-10)\", backgroundColor = \"var(--gray-2)\", height, width = \"100%\", radius = \"3\" } = backgroundProps;\n\n if (background === \"none\") {\n return (\n <Card size=\"1\" variant=\"soft\">\n <Flex justify=\"center\" align=\"center\" py=\"4\">\n <Theme fontFamily=\"sans\">{children}</Theme>\n </Flex>\n </Card>\n );\n }\n\n if (background === \"dots\") {\n const dotsStyle: React.CSSProperties = {\n backgroundImage: `radial-gradient(circle, ${color} 1px, transparent 1px)`,\n borderRadius: `var(--radius-${radius})`,\n backgroundSize: `${dotSize}px ${dotSize}px`,\n backgroundPosition: \"center\",\n backgroundColor,\n width,\n ...(height && { height }),\n };\n\n return (\n <Card size=\"1\" variant=\"soft\">\n <Flex justify=\"center\" align=\"center\" py=\"4\" style={dotsStyle}>\n <Theme fontFamily=\"sans\">{children}</Theme>\n </Flex>\n </Card>\n );\n }\n\n const imageStyle: React.CSSProperties = {\n backgroundImage: `url(${background})`,\n backgroundSize: \"cover\",\n backgroundPosition: \"center\",\n backgroundRepeat: \"no-repeat\",\n borderRadius: `var(--radius-${radius})`,\n width,\n ...(height && { height }),\n };\n\n return (\n <Card size=\"1\" variant=\"soft\">\n <Flex justify=\"center\" align=\"center\" py=\"4\" style={imageStyle}>\n <Theme fontFamily=\"sans\">{children}</Theme>\n </Flex>\n </Card>\n );\n}\n\n// ============================================\n// Code Section (for runtime highlighting)\n// ============================================\n\ninterface CodeSectionProps {\n code: string;\n language: string;\n showCopy?: boolean;\n showLanguage?: boolean;\n lightTheme?: string;\n darkTheme?: string;\n}\n\nconst CodeSection = memo(function CodeSection({\n code,\n language,\n showCopy = true,\n showLanguage = true,\n lightTheme = DEFAULT_LIGHT_THEME,\n darkTheme = DEFAULT_DARK_THEME,\n}: CodeSectionProps) {\n const [highlighted, setHighlighted] = useState<string | null>(null);\n const [isExpanded, setIsExpanded] = useState(false);\n const [contentHeight, setContentHeight] = useState(COLLAPSED_HEIGHT);\n const [copied, setCopied] = useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const resetTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const shouldShowToggle = contentHeight > COLLAPSED_HEIGHT;\n\n useEffect(() => {\n let cancelled = false;\n codeToHtml(code, {\n lang: language,\n themes: { light: lightTheme, dark: darkTheme },\n defaultColor: false,\n })\n .then((html) => {\n if (!cancelled) setHighlighted(html);\n })\n .catch(() => {\n if (!cancelled) setHighlighted(null);\n });\n return () => {\n cancelled = true;\n };\n }, [code, language, lightTheme, darkTheme]);\n\n useEffect(() => {\n if (contentRef.current) {\n setContentHeight(contentRef.current.scrollHeight);\n }\n }, [highlighted]);\n\n useEffect(() => {\n return () => {\n if (resetTimeoutRef.current) clearTimeout(resetTimeoutRef.current);\n };\n }, []);\n\n const handleCopy = useCallback(async () => {\n if (!code.trim()) return;\n try {\n await navigator.clipboard.writeText(code);\n setCopied(true);\n if (resetTimeoutRef.current) clearTimeout(resetTimeoutRef.current);\n resetTimeoutRef.current = setTimeout(() => setCopied(false), 2000);\n } catch {\n // Silently fail\n }\n }, [code]);\n\n const displayLanguage = language === \"text\" ? \"plaintext\" : language;\n\n const handleToggle = useCallback(() => {\n setIsExpanded((prev) => !prev);\n }, []);\n\n const contentStyle: React.CSSProperties = {\n maxHeight: isExpanded ? `${contentHeight}px` : `${COLLAPSED_HEIGHT}px`,\n };\n\n const chevronStyle: React.CSSProperties = {\n transform: isExpanded ? \"rotate(180deg)\" : \"rotate(0deg)\",\n };\n\n return (\n <Box position=\"relative\">\n <Card size=\"1\" variant=\"soft\">\n <Flex direction=\"column\" gap=\"3\">\n <Flex gap=\"2\" justify=\"between\" align=\"start\">\n {showLanguage && (\n <Code size=\"1\" color=\"gray\" highContrast>\n {displayLanguage}\n </Code>\n )}\n <Flex align=\"center\" gap=\"2\" className=\"code-action-buttons\">\n {shouldShowToggle && (\n <Button\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n onClick={handleToggle}\n tooltip={isExpanded ? \"Collapse\" : \"Expand\"}\n aria-label={isExpanded ? \"Collapse code\" : \"Expand code\"}\n >\n <HugeiconsIcon icon={ArrowDown01Icon} style={chevronStyle} className=\"code-chevron\" />\n </Button>\n )}\n {showCopy && (\n <Button\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n onClick={handleCopy}\n tooltip={copied ? \"Copied!\" : \"Copy\"}\n aria-label={copied ? \"Copied!\" : \"Copy code\"}\n >\n <HugeiconsIcon icon={copied ? Tick01Icon : Copy01Icon} /> Copy\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Box ref={contentRef} style={contentStyle} className=\"code-content\">\n {highlighted ? (\n <Box className=\"code-block-content\" width=\"100%\" style={{ minWidth: 0 }} dangerouslySetInnerHTML={{ __html: highlighted }} />\n ) : (\n <pre className=\"code-block-content\">\n <Code size=\"3\">{code}</Code>\n </pre>\n )}\n </Box>\n\n {shouldShowToggle && !isExpanded && <Box className=\"code-scroll-shadow visible\" />}\n </Flex>\n </Card>\n </Box>\n );\n});\n\n// ============================================\n// Children Code Section (for pre-highlighted MDX)\n// ============================================\n\ninterface ChildrenCodeSectionProps {\n children: ReactNode;\n showCopy?: boolean;\n showLanguage?: boolean;\n}\n\nfunction extractCodeFromChildren(children?: ReactNode): string {\n const extractText = (node: any): string => {\n if (typeof node === \"string\") return node;\n if (typeof node === \"number\") return String(node);\n if (!node) return \"\";\n if (Array.isArray(node)) return node.map(extractText).join(\"\");\n if (typeof node === \"object\" && \"props\" in node) {\n const props = node.props;\n if (props?.children) return extractText(props.children);\n }\n return \"\";\n };\n return extractText(children);\n}\n\nfunction extractLanguageFromChildren(children?: ReactNode): string {\n const findLanguage = (node: any): string | null => {\n if (!node) return null;\n if (typeof node === \"object\" && \"props\" in node) {\n const props = node.props;\n const className = props?.className || props?.class || \"\";\n if (typeof className === \"string\") {\n const match = className.match(/language-([\\w-]+)/i);\n if (match) return match[1];\n }\n if (props?.children) {\n if (Array.isArray(props.children)) {\n for (const child of props.children) {\n const lang = findLanguage(child);\n if (lang) return lang;\n }\n } else {\n return findLanguage(props.children);\n }\n }\n }\n return null;\n };\n return findLanguage(children) || \"text\";\n}\n\nfunction formatLanguageLabel(lang: string): string {\n const aliasMap: Record<string, string> = {\n tsx: \"TSX\",\n ts: \"TS\",\n jsx: \"JSX\",\n js: \"JS\",\n javascript: \"JS\",\n typescript: \"TS\",\n css: \"CSS\",\n html: \"HTML\",\n json: \"JSON\",\n bash: \"SH\",\n sh: \"SH\",\n shell: \"SH\",\n text: \"plaintext\",\n };\n return aliasMap[lang.toLowerCase()] || lang.toLowerCase();\n}\n\nconst ChildrenCodeSection = memo(function ChildrenCodeSection({ children, showCopy = true, showLanguage = true }: ChildrenCodeSectionProps) {\n const [isExpanded, setIsExpanded] = useState(false);\n const [contentHeight, setContentHeight] = useState(COLLAPSED_HEIGHT);\n const [copied, setCopied] = useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const resetTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const code = extractCodeFromChildren(children);\n const language = extractLanguageFromChildren(children);\n const displayLanguage = formatLanguageLabel(language);\n\n const shouldShowToggle = contentHeight > COLLAPSED_HEIGHT;\n\n useEffect(() => {\n if (contentRef.current) {\n setContentHeight(contentRef.current.scrollHeight);\n }\n }, [children]);\n\n useEffect(() => {\n return () => {\n if (resetTimeoutRef.current) clearTimeout(resetTimeoutRef.current);\n };\n }, []);\n\n const handleCopy = useCallback(async () => {\n if (!code.trim()) return;\n try {\n await navigator.clipboard.writeText(code);\n setCopied(true);\n if (resetTimeoutRef.current) clearTimeout(resetTimeoutRef.current);\n resetTimeoutRef.current = setTimeout(() => setCopied(false), 2000);\n } catch {\n // Silently fail\n }\n }, [code]);\n\n const contentStyle: React.CSSProperties = {\n maxHeight: isExpanded ? `${contentHeight}px` : `${COLLAPSED_HEIGHT}px`,\n };\n\n const handleToggle = useCallback(() => {\n setIsExpanded((prev) => !prev);\n }, []);\n\n const chevronStyle: React.CSSProperties = {\n transform: isExpanded ? \"rotate(180deg)\" : \"rotate(0deg)\",\n };\n\n return (\n <Box position=\"relative\">\n <Card size=\"1\" variant=\"soft\">\n <Flex direction=\"column\" gap=\"3\">\n <Flex gap=\"2\" justify=\"between\" align=\"start\">\n {showLanguage && (\n <Code size=\"1\" color=\"gray\" highContrast>\n {displayLanguage}\n </Code>\n )}\n <Flex align=\"center\" gap=\"2\" className=\"code-action-buttons\">\n {shouldShowToggle && (\n <Button\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n onClick={handleToggle}\n tooltip={isExpanded ? \"Collapse\" : \"Expand\"}\n aria-label={isExpanded ? \"Collapse code\" : \"Expand code\"}\n >\n <HugeiconsIcon icon={ArrowDown01Icon} style={chevronStyle} className=\"code-chevron\" />\n </Button>\n )}\n {showCopy && (\n <Button\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n onClick={handleCopy}\n tooltip={copied ? \"Copied!\" : \"Copy\"}\n aria-label={copied ? \"Copied!\" : \"Copy code\"}\n >\n <HugeiconsIcon icon={copied ? Tick01Icon : Copy01Icon} /> Copy\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Box ref={contentRef} style={contentStyle} className=\"code-content\">\n <div className=\"code-block-content\">{children}</div>\n </Box>\n\n {shouldShowToggle && !isExpanded && <Box className=\"code-scroll-shadow visible\" />}\n </Flex>\n </Card>\n </Box>\n );\n});\n\n// ============================================\n// Main CodeBlock Component\n// ============================================\n\nexport function CodeBlock({\n children,\n code,\n language,\n preview,\n showCopy = true,\n showLanguage = true,\n lightTheme,\n darkTheme,\n background,\n backgroundProps,\n}: CodeBlockProps) {\n const hasCode = code || (children && React.Children.count(children) > 0);\n const displayLanguage = language || extractLanguageFromChildren(children) || \"text\";\n\n return (\n <Box className=\"docs-code-block\" mt=\"6\" mb=\"8\">\n <Flex direction=\"column\" gap=\"2\">\n {preview && (\n <PreviewSection background={background} backgroundProps={backgroundProps}>\n {preview}\n </PreviewSection>\n )}\n\n {code && (\n <CodeSection code={code} language={displayLanguage} showCopy={showCopy} showLanguage={showLanguage} lightTheme={lightTheme} darkTheme={darkTheme} />\n )}\n\n {children && !code && (\n <ChildrenCodeSection showCopy={showCopy} showLanguage={showLanguage}>\n {children}\n </ChildrenCodeSection>\n )}\n </Flex>\n </Box>\n );\n}\n"],
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,eAAAE,IAAA,eAAAC,
|
|
6
|
-
"names": ["CodeBlock_exports", "__export", "CodeBlock", "__toCommonJS", "import_react", "import_kookie_ui", "import_core_free_icons", "import_shiki", "
|
|
4
|
+
"sourcesContent": ["import React, { useState, useEffect, useMemo, memo, createContext, useContext, type ReactNode } from \"react\";\nimport { Box, Card, Code, Flex, Button, Text, Theme, ScrollArea, IconButton } from \"@kushagradhawan/kookie-ui\";\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport { Copy01Icon, Tick01Icon, ArrowDown01Icon } from \"@hugeicons/core-free-icons\";\nimport { codeToHtml, type BundledLanguage, type BundledTheme } from \"shiki\";\nimport type { CodeBlockProps, ShikiConfig, PreviewBackgroundProps } from \"./types\";\nimport { extractTextFromChildren, extractLanguageFromChildren } from \"./types\";\nimport { useCodeCard } from \"./useCodeCard\";\nimport { LanguageBadge } from \"./LanguageBadge\";\n\nconst CodeBlockContext = createContext<boolean>(false);\n\nconst DEFAULT_COLLAPSED_HEIGHT = 360;\nconst DEFAULT_LIGHT_THEME = \"one-light\";\nconst DEFAULT_DARK_THEME = \"one-dark-pro\";\n\ninterface PreviewSectionProps {\n children: ReactNode;\n background?: \"none\" | \"dots\" | string;\n backgroundProps?: PreviewBackgroundProps;\n}\n\nfunction PreviewSection({ children, background = \"none\", backgroundProps = {} }: PreviewSectionProps) {\n const { dotSize = 24, color = \"var(--gray-10)\", backgroundColor = \"var(--gray-2)\", height, width = \"100%\", radius = \"3\" } = backgroundProps;\n\n const backgroundStyle = useMemo((): React.CSSProperties | undefined => {\n if (background === \"none\") return undefined;\n\n if (background === \"dots\") {\n return {\n backgroundImage: `radial-gradient(circle, ${color} 1px, transparent 1px)`,\n borderRadius: `var(--radius-${radius})`,\n backgroundSize: `${dotSize}px ${dotSize}px`,\n backgroundPosition: \"center\",\n backgroundColor,\n width,\n ...(height && { height }),\n };\n }\n\n // Image background\n return {\n backgroundImage: `url(${background})`,\n backgroundSize: \"cover\",\n backgroundPosition: \"center\",\n backgroundRepeat: \"no-repeat\",\n borderRadius: `var(--radius-${radius})`,\n width,\n ...(height && { height }),\n };\n }, [background, color, backgroundColor, dotSize, height, width, radius]);\n\n return (\n <Card size=\"1\" variant=\"soft\">\n <Flex justify=\"center\" align=\"center\" py=\"4\" style={backgroundStyle}>\n <Theme fontFamily=\"sans\">{children}</Theme>\n </Flex>\n </Card>\n );\n}\n\ninterface CodeCardProps {\n code: string;\n language: string;\n showCopy: boolean;\n showLanguage: boolean;\n showLineNumbers: boolean;\n collapsible: boolean;\n collapsedHeight: number;\n file?: string;\n isLoading?: boolean;\n children: ReactNode;\n}\n\nfunction CodeSkeleton() {\n // Generate varied line widths for visual interest\n const lineWidths = [\"85%\", \"70%\", \"90%\", \"60%\", \"75%\", \"80%\"];\n\n return (\n <Box className=\"code-skeleton\">\n {lineWidths.map((width, index) => (\n <Box key={index} className=\"code-skeleton-line\" style={{ width }} />\n ))}\n </Box>\n );\n}\n\nconst CodeCard = memo(function CodeCard({\n code,\n language,\n showCopy,\n showLanguage,\n showLineNumbers,\n collapsible,\n collapsedHeight,\n file,\n isLoading = false,\n children,\n}: CodeCardProps) {\n const { isExpanded, shouldShowToggle, copied, contentRef, contentMaxHeight, handleToggle, handleCopy } = useCodeCard({\n code,\n collapsedHeight,\n });\n\n const showToggle = collapsible && shouldShowToggle;\n const chevronRotation = isExpanded ? \"rotate(180deg)\" : \"rotate(0deg)\";\n const contentClassName = showLineNumbers ? \"code-content\" : \"code-content hide-line-numbers\";\n\n return (\n <Box position=\"relative\">\n <Card size=\"1\" variant=\"soft\">\n <Flex direction=\"column\">\n <Flex justify=\"between\" align=\"start\" gap=\"2\">\n <Flex align=\"center\" gap=\"2\">\n {showLanguage && <LanguageBadge language={language} />}\n {file && (\n <Text size=\"1\" color=\"gray\" highContrast>\n {file}\n </Text>\n )}\n </Flex>\n\n <Flex align=\"center\" className=\"code-action-buttons\">\n {showToggle && (\n <IconButton\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n highContrast\n onClick={handleToggle}\n tooltip={isExpanded ? \"Collapse\" : \"Expand\"}\n aria-label={isExpanded ? \"Collapse code\" : \"Expand code\"}\n >\n <HugeiconsIcon icon={ArrowDown01Icon} style={{ transform: chevronRotation }} className=\"code-chevron\" strokeWidth={1.75} />\n </IconButton>\n )}\n {showCopy && (\n <Button\n size=\"2\"\n variant=\"ghost\"\n color=\"gray\"\n highContrast\n onClick={handleCopy}\n tooltip={copied ? \"Copied!\" : \"Copy\"}\n aria-label={copied ? \"Copied!\" : \"Copy code\"}\n >\n <HugeiconsIcon icon={copied ? Tick01Icon : Copy01Icon} strokeWidth={1.75} /> Copy\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Box ref={contentRef} style={{ maxHeight: collapsible ? `${contentMaxHeight}px` : undefined }} className={contentClassName}>\n <ScrollArea type=\"auto\" scrollbars=\"horizontal\">\n {isLoading ? <CodeSkeleton /> : children}\n </ScrollArea>\n </Box>\n\n {showToggle && !isExpanded && <Box className=\"code-scroll-shadow visible\" />}\n </Flex>\n </Card>\n </Box>\n );\n});\n\ninterface RuntimeCodeSectionProps {\n code: string;\n language: string;\n showCopy: boolean;\n showLanguage: boolean;\n showLineNumbers: boolean;\n collapsible: boolean;\n collapsedHeight: number;\n file?: string;\n shikiConfig?: ShikiConfig;\n}\n\nconst RuntimeCodeSection = memo(function RuntimeCodeSection({\n code,\n language,\n showCopy,\n showLanguage,\n showLineNumbers,\n collapsible,\n collapsedHeight,\n file,\n shikiConfig,\n}: RuntimeCodeSectionProps) {\n const [highlighted, setHighlighted] = useState<string | null>(null);\n const [isLoading, setIsLoading] = useState(true);\n\n // Memoize Shiki config to prevent unnecessary re-highlights\n const shikiOptions = useMemo(() => {\n const lightTheme = shikiConfig?.themes?.light || DEFAULT_LIGHT_THEME;\n const darkTheme = shikiConfig?.themes?.dark || DEFAULT_DARK_THEME;\n\n return {\n lang: language as BundledLanguage,\n themes: {\n light: lightTheme as BundledTheme,\n dark: darkTheme as BundledTheme,\n },\n defaultColor: false as const,\n langAlias: shikiConfig?.langAlias,\n transformers: shikiConfig?.transformers,\n meta: shikiConfig?.meta ? { __raw: shikiConfig.meta } : undefined,\n };\n }, [language, shikiConfig?.themes?.light, shikiConfig?.themes?.dark, shikiConfig?.langAlias, shikiConfig?.transformers, shikiConfig?.meta]);\n\n useEffect(() => {\n let cancelled = false;\n setIsLoading(true);\n\n codeToHtml(code, shikiOptions)\n .then((html) => {\n if (!cancelled) {\n setHighlighted(html);\n setIsLoading(false);\n }\n })\n .catch((error) => {\n if (!cancelled) {\n setHighlighted(null);\n setIsLoading(false);\n if (process.env.NODE_ENV === \"development\") {\n console.error(\"[CodeBlock] Shiki highlighting failed:\", error);\n }\n }\n });\n\n return () => {\n cancelled = true;\n };\n }, [code, shikiOptions]);\n\n return (\n <CodeCard\n code={code}\n language={language}\n showCopy={showCopy}\n showLanguage={showLanguage}\n showLineNumbers={showLineNumbers}\n collapsible={collapsible}\n collapsedHeight={collapsedHeight}\n file={file}\n isLoading={isLoading}\n >\n {highlighted ? <Box dangerouslySetInnerHTML={{ __html: highlighted }} /> : null}\n </CodeCard>\n );\n});\n\ninterface ChildrenCodeSectionProps {\n children: ReactNode;\n showCopy: boolean;\n showLanguage: boolean;\n showLineNumbers: boolean;\n collapsible: boolean;\n collapsedHeight: number;\n file?: string;\n}\n\nconst ChildrenCodeSection = memo(function ChildrenCodeSection({\n children,\n showCopy,\n showLanguage,\n showLineNumbers,\n collapsible,\n collapsedHeight,\n file,\n}: ChildrenCodeSectionProps) {\n const code = extractTextFromChildren(children);\n const language = extractLanguageFromChildren(children);\n\n return (\n <CodeCard\n code={code}\n language={language}\n showCopy={showCopy}\n showLanguage={showLanguage}\n showLineNumbers={showLineNumbers}\n collapsible={collapsible}\n collapsedHeight={collapsedHeight}\n file={file}\n >\n {children}\n </CodeCard>\n );\n});\n\nexport function CodeBlock({\n children,\n code,\n language,\n preview,\n showCopy = true,\n showLanguage = true,\n showLineNumbers = true,\n shikiConfig,\n background,\n backgroundProps,\n collapsible = true,\n collapsedHeight = DEFAULT_COLLAPSED_HEIGHT,\n file,\n}: CodeBlockProps) {\n const displayLanguage = language || extractLanguageFromChildren(children) || \"text\";\n\n return (\n <CodeBlockContext.Provider value={true}>\n <Box className=\"docs-code-block\" mt=\"6\" mb=\"8\">\n <Flex direction=\"column\" gap=\"2\">\n {preview && (\n <PreviewSection background={background} backgroundProps={backgroundProps}>\n {preview}\n </PreviewSection>\n )}\n\n {code && (\n <RuntimeCodeSection\n code={code}\n language={displayLanguage}\n showCopy={showCopy}\n showLanguage={showLanguage}\n showLineNumbers={showLineNumbers}\n collapsible={collapsible}\n collapsedHeight={collapsedHeight}\n file={file}\n shikiConfig={shikiConfig}\n />\n )}\n\n {children && !code && (\n <ChildrenCodeSection\n showCopy={showCopy}\n showLanguage={showLanguage}\n showLineNumbers={showLineNumbers}\n collapsible={collapsible}\n collapsedHeight={collapsedHeight}\n file={file}\n >\n {children}\n </ChildrenCodeSection>\n )}\n </Flex>\n </Box>\n </CodeBlockContext.Provider>\n );\n}\n\nexport function useCodeBlockContext() {\n return useContext(CodeBlockContext);\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["CodeBlock_exports", "__export", "CodeBlock", "useCodeBlockContext", "__toCommonJS", "import_react", "import_kookie_ui", "import_core_free_icons", "import_shiki", "import_types", "import_useCodeCard", "import_LanguageBadge", "CodeBlockContext", "DEFAULT_COLLAPSED_HEIGHT", "DEFAULT_LIGHT_THEME", "DEFAULT_DARK_THEME", "PreviewSection", "children", "background", "backgroundProps", "dotSize", "color", "backgroundColor", "height", "width", "radius", "backgroundStyle", "React", "CodeSkeleton", "index", "CodeCard", "code", "language", "showCopy", "showLanguage", "showLineNumbers", "collapsible", "collapsedHeight", "file", "isLoading", "isExpanded", "shouldShowToggle", "copied", "contentRef", "contentMaxHeight", "handleToggle", "handleCopy", "showToggle", "chevronRotation", "contentClassName", "RuntimeCodeSection", "shikiConfig", "highlighted", "setHighlighted", "setIsLoading", "shikiOptions", "lightTheme", "darkTheme", "cancelled", "html", "error", "ChildrenCodeSection", "preview", "displayLanguage"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Formats a language identifier for display in the badge.
|
|
4
|
+
* Converts technical identifiers to human-readable labels.
|
|
5
|
+
*/
|
|
6
|
+
export declare function formatLanguageForDisplay(lang: string): string;
|
|
2
7
|
interface LanguageBadgeProps {
|
|
3
8
|
language: string;
|
|
4
9
|
}
|
|
10
|
+
/**
|
|
11
|
+
* Displays the programming language as a small badge.
|
|
12
|
+
* Uses Kookie UI's Code component with consistent styling.
|
|
13
|
+
*/
|
|
5
14
|
export declare function LanguageBadge({ language }: LanguageBadgeProps): React.JSX.Element;
|
|
6
15
|
export {};
|
|
7
16
|
//# sourceMappingURL=LanguageBadge.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LanguageBadge.d.ts","sourceRoot":"","sources":["../../../../src/components/code/LanguageBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LanguageBadge.d.ts","sourceRoot":"","sources":["../../../../src/components/code/LanguageBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAsD1B;;;GAGG;AACH,wBAAgB,wBAAwB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAG7D;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE,kBAAkB,qBAQ7D"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var p=Object.create;var a=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var h=Object.getPrototypeOf,u=Object.prototype.hasOwnProperty;var L=(s,t)=>{for(var e in t)a(s,e,{get:t[e],enumerable:!0})},n=(s,t,e,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of c(t))!u.call(s,r)&&r!==e&&a(s,r,{get:()=>t[r],enumerable:!(o=S(t,r))||o.enumerable});return s};var d=(s,t,e)=>(e=s!=null?p(h(s)):{},n(t||!s||!s.__esModule?a(e,"default",{value:s,enumerable:!0}):e,s)),m=s=>n(a({},"__esModule",{value:!0}),s);var C={};L(C,{LanguageBadge:()=>x,formatLanguageForDisplay:()=>i});module.exports=m(C);var l=d(require("react")),g=require("@kushagradhawan/kookie-ui");const y={js:"JS",javascript:"JS",jsx:"JSX",ts:"TS",typescript:"TS",tsx:"TSX",py:"Python",python:"Python",rb:"Ruby",ruby:"Ruby",sh:"Shell",bash:"Shell",shell:"Shell",zsh:"Shell",css:"CSS",scss:"SCSS",sass:"Sass",less:"Less",html:"HTML",xml:"XML",json:"JSON",yaml:"YAML",yml:"YAML",md:"Markdown",markdown:"Markdown",mdx:"MDX",sql:"SQL",graphql:"GraphQL",gql:"GraphQL",go:"Go",rust:"Rust",rs:"Rust",swift:"Swift",kotlin:"Kotlin",java:"Java",cpp:"C++",c:"C",cs:"C#",csharp:"C#",php:"PHP",vue:"Vue",svelte:"Svelte",astro:"Astro",dockerfile:"Docker",docker:"Docker",text:"Text",plaintext:"Text",txt:"Text"};function i(s){const t=s.toLowerCase().trim();return y[t]||s.toUpperCase()}function x({language:s}){const t=i(s);return l.default.createElement(g.Code,{size:"1",color:"gray",highContrast:!0},t)}
|
|
2
2
|
//# sourceMappingURL=LanguageBadge.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/code/LanguageBadge.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from \"react\";\nimport { Code } from \"@kushagradhawan/kookie-ui\";\n\
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,IAAA,eAAAC,
|
|
6
|
-
"names": ["LanguageBadge_exports", "__export", "LanguageBadge", "__toCommonJS", "import_react", "import_kookie_ui", "
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport { Code } from \"@kushagradhawan/kookie-ui\";\n\nconst LANGUAGE_DISPLAY_MAP: Record<string, string> = {\n js: \"JS\",\n javascript: \"JS\",\n jsx: \"JSX\",\n ts: \"TS\",\n typescript: \"TS\",\n tsx: \"TSX\",\n py: \"Python\",\n python: \"Python\",\n rb: \"Ruby\",\n ruby: \"Ruby\",\n sh: \"Shell\",\n bash: \"Shell\",\n shell: \"Shell\",\n zsh: \"Shell\",\n css: \"CSS\",\n scss: \"SCSS\",\n sass: \"Sass\",\n less: \"Less\",\n html: \"HTML\",\n xml: \"XML\",\n json: \"JSON\",\n yaml: \"YAML\",\n yml: \"YAML\",\n md: \"Markdown\",\n markdown: \"Markdown\",\n mdx: \"MDX\",\n sql: \"SQL\",\n graphql: \"GraphQL\",\n gql: \"GraphQL\",\n go: \"Go\",\n rust: \"Rust\",\n rs: \"Rust\",\n swift: \"Swift\",\n kotlin: \"Kotlin\",\n java: \"Java\",\n cpp: \"C++\",\n c: \"C\",\n cs: \"C#\",\n csharp: \"C#\",\n php: \"PHP\",\n vue: \"Vue\",\n svelte: \"Svelte\",\n astro: \"Astro\",\n dockerfile: \"Docker\",\n docker: \"Docker\",\n text: \"Text\",\n plaintext: \"Text\",\n txt: \"Text\",\n};\n\n/**\n * Formats a language identifier for display in the badge.\n * Converts technical identifiers to human-readable labels.\n */\nexport function formatLanguageForDisplay(lang: string): string {\n const normalized = lang.toLowerCase().trim();\n return LANGUAGE_DISPLAY_MAP[normalized] || lang.toUpperCase();\n}\n\ninterface LanguageBadgeProps {\n language: string;\n}\n\n/**\n * Displays the programming language as a small badge.\n * Uses Kookie UI's Code component with consistent styling.\n */\nexport function LanguageBadge({ language }: LanguageBadgeProps) {\n const displayLanguage = formatLanguageForDisplay(language);\n\n return (\n <Code size=\"1\" color=\"gray\" highContrast>\n {displayLanguage}\n </Code>\n );\n}\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,mBAAAE,EAAA,6BAAAC,IAAA,eAAAC,EAAAJ,GAAA,IAAAK,EAAkB,oBAClBC,EAAqB,qCAErB,MAAMC,EAA+C,CACnD,GAAI,KACJ,WAAY,KACZ,IAAK,MACL,GAAI,KACJ,WAAY,KACZ,IAAK,MACL,GAAI,SACJ,OAAQ,SACR,GAAI,OACJ,KAAM,OACN,GAAI,QACJ,KAAM,QACN,MAAO,QACP,IAAK,QACL,IAAK,MACL,KAAM,OACN,KAAM,OACN,KAAM,OACN,KAAM,OACN,IAAK,MACL,KAAM,OACN,KAAM,OACN,IAAK,OACL,GAAI,WACJ,SAAU,WACV,IAAK,MACL,IAAK,MACL,QAAS,UACT,IAAK,UACL,GAAI,KACJ,KAAM,OACN,GAAI,OACJ,MAAO,QACP,OAAQ,SACR,KAAM,OACN,IAAK,MACL,EAAG,IACH,GAAI,KACJ,OAAQ,KACR,IAAK,MACL,IAAK,MACL,OAAQ,SACR,MAAO,QACP,WAAY,SACZ,OAAQ,SACR,KAAM,OACN,UAAW,OACX,IAAK,MACP,EAMO,SAASJ,EAAyBK,EAAsB,CAC7D,MAAMC,EAAaD,EAAK,YAAY,EAAE,KAAK,EAC3C,OAAOD,EAAqBE,CAAU,GAAKD,EAAK,YAAY,CAC9D,CAUO,SAASN,EAAc,CAAE,SAAAQ,CAAS,EAAuB,CAC9D,MAAMC,EAAkBR,EAAyBO,CAAQ,EAEzD,OACE,EAAAE,QAAA,cAAC,QAAK,KAAK,IAAI,MAAM,OAAO,aAAY,IACrCD,CACH,CAEJ",
|
|
6
|
+
"names": ["LanguageBadge_exports", "__export", "LanguageBadge", "formatLanguageForDisplay", "__toCommonJS", "import_react", "import_kookie_ui", "LANGUAGE_DISPLAY_MAP", "lang", "normalized", "language", "displayLanguage", "React"]
|
|
7
7
|
}
|
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
export { CodeBlock } from "./CodeBlock";
|
|
2
|
-
export
|
|
1
|
+
export { CodeBlock, useCodeBlockContext } from "./CodeBlock";
|
|
2
|
+
export { useCodeCard } from "./useCodeCard";
|
|
3
|
+
export { LanguageBadge, formatLanguageForDisplay } from "./LanguageBadge";
|
|
4
|
+
export type { CodeBlockProps, ShikiConfig, PreviewBackgroundProps } from "./types";
|
|
5
|
+
export { extractTextFromChildren, extractLanguageFromChildren, isReactElement } from "./types";
|
|
3
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/code/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/code/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,wBAAwB,EAAE,MAAM,iBAAiB,CAAC;AAC1E,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AACnF,OAAO,EAAE,uBAAuB,EAAE,2BAA2B,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var g=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var c=(o,e)=>{for(var a in e)g(o,a,{get:e[a],enumerable:!0})},f=(o,e,a,m)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of C(e))!i.call(o,t)&&t!==a&&g(o,t,{get:()=>e[t],enumerable:!(m=x(e,t))||m.enumerable});return o};var l=o=>f(g({},"__esModule",{value:!0}),o);var s={};c(s,{CodeBlock:()=>p.CodeBlock,LanguageBadge:()=>d.LanguageBadge,extractLanguageFromChildren:()=>r.extractLanguageFromChildren,extractTextFromChildren:()=>r.extractTextFromChildren,formatLanguageForDisplay:()=>d.formatLanguageForDisplay,isReactElement:()=>r.isReactElement,useCodeBlockContext:()=>p.useCodeBlockContext,useCodeCard:()=>n.useCodeCard});module.exports=l(s);var p=require("./CodeBlock"),n=require("./useCodeCard"),d=require("./LanguageBadge"),r=require("./types");
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/code/index.ts"],
|
|
4
|
-
"sourcesContent": ["// Public API
|
|
5
|
-
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,
|
|
6
|
-
"names": ["code_exports", "__export", "__toCommonJS", "import_CodeBlock"]
|
|
4
|
+
"sourcesContent": ["// Public API\nexport { CodeBlock, useCodeBlockContext } from \"./CodeBlock\";\nexport { useCodeCard } from \"./useCodeCard\";\nexport { LanguageBadge, formatLanguageForDisplay } from \"./LanguageBadge\";\nexport type { CodeBlockProps, ShikiConfig, PreviewBackgroundProps } from \"./types\";\nexport { extractTextFromChildren, extractLanguageFromChildren, isReactElement } from \"./types\";\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,0WAAAE,EAAAF,GACA,IAAAG,EAA+C,uBAC/CC,EAA4B,yBAC5BC,EAAwD,2BAExDC,EAAqF",
|
|
6
|
+
"names": ["code_exports", "__export", "__toCommonJS", "import_CodeBlock", "import_useCodeCard", "import_LanguageBadge", "import_types"]
|
|
7
7
|
}
|