govuk-chakra 0.1.2 → 0.1.3

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/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("./iconBase-oF_9OlGK.js");const e=require("./provider-CYEYtfuU.js"),t=require("./govUKTheme-CsiNVb8x.js"),n=require("./govuk-chakra-Aa83RA4r.js"),r=require("./DonutChart-Dv_SZ-sU.js"),i=require("./Button-DZLug9I8.js");exports.Accordion=n.Dt,exports.Alert=n.Tt,exports.Avatar=n.wt,exports.BackLink=n.Ct,exports.Breadcrumbs=n.St,exports.Button=i.t,exports.Calendar=n.xt,exports.Card=n.yt,exports.CardGroup=n.bt,exports.Carousel=n.vt,exports.Checkbox=n.gt,exports.Code=n.ht,exports.Collapsible=n.mt,exports.ColorPicker=n.pt,exports.ColorSwatch=n.ft,exports.Combobox=n.dt,exports.CookieBanner=n.ut,exports.DateInput=n.lt,exports.Details=n.ct,exports.Dialog=n.st,exports.DonutChart=r.t,exports.Editable=n.ot,exports.EmptyState=n.at,exports.ErrorSummary=n.it,exports.Fieldset=n._t,exports.FileUpload=n.rt,exports.FloatingPanel=n.nt,exports.GOVUKCrest=n.et,exports.GOVUKCrown=n.$,exports.GOVUKFooter=n.Q,exports.GOVUKHeader=n.Z,exports.GOVUKOGL=n.X,exports.GOVUKProvider=e.t,exports.GenericHeader=n.tt,exports.Heading=n.Et,exports.Highlight=n.Y,exports.HoverCard=n.J,exports.IconButton=n.q,exports.Image=n.K,exports.InsetText=n.G,exports.Kbd=n.W,exports.LanguageNavigation=n.U,exports.Link=n.Ot,exports.Listbox=n.H,exports.Marquee=n.V,exports.Menu=n.B,exports.NotificationBanner=n.z,exports.Pagination=n.R,exports.Panel=n.L,exports.PhaseBanner=n.t,exports.PinInput=n.I,exports.Popover=n.F,exports.Progress=n.P,exports.ProgressCircle=n.N,exports.QRCode=n.M,exports.Radio=n.j,exports.RadioCard=n.A,exports.Rating=n.k,exports.ScrollArea=n.O,exports.SegmentedControl=n.E,exports.Select=n.D,exports.Separator=n.T,exports.ServiceNavigation=n.w,exports.Skeleton=n.C,exports.SkipLink=n.S,exports.Slider=n.x,exports.Spinner=n.b,exports.Stat=n.y,exports.Status=n.v,exports.Steps=n._,exports.SummaryList=n.g,exports.Switch=n.h,exports.Table=n.m,exports.Tabs=n.p,exports.Tag=n.n,exports.TagsInput=n.f,exports.TaskList=n.d,exports.Text=r.r,exports.Textarea=n.u,exports.Textinput=n.l,exports.Timeline=n.c,exports.Toast=n.s,exports.ToggleTip=n.o,exports.Tooltip=n.a,exports.TreeView=n.i,exports.WarningText=n.r,exports.govUKTheme=t.t,exports.govUKThemeSystem=t.n;var a=require("@chakra-ui/react");Object.keys(a).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return a[e]}})});
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("./iconBase-oF_9OlGK.js");const e=require("./provider-CYEYtfuU.js"),t=require("./govUKTheme-CsiNVb8x.js"),n=require("./govuk-chakra-NZ5MieX-.js"),r=require("./DonutChart-By-HroDD.js"),i=require("./Button-DZLug9I8.js");exports.Accordion=n.Dt,exports.Alert=n.Tt,exports.Avatar=n.wt,exports.BackLink=n.Ct,exports.Breadcrumbs=n.St,exports.Button=i.t,exports.Calendar=n.xt,exports.Card=n.yt,exports.CardGroup=n.bt,exports.Carousel=n.vt,exports.Checkbox=n.gt,exports.Code=n.ht,exports.Collapsible=n.mt,exports.ColorPicker=n.pt,exports.ColorSwatch=n.ft,exports.Combobox=n.dt,exports.CookieBanner=n.ut,exports.DateInput=n.lt,exports.Details=n.ct,exports.Dialog=n.st,exports.DonutChart=r.t,exports.Editable=n.ot,exports.EmptyState=n.at,exports.ErrorSummary=n.it,exports.Fieldset=n._t,exports.FileUpload=n.rt,exports.FloatingPanel=n.nt,exports.GOVUKCrest=n.et,exports.GOVUKCrown=n.$,exports.GOVUKFooter=n.Q,exports.GOVUKHeader=n.Z,exports.GOVUKOGL=n.X,exports.GOVUKProvider=e.t,exports.GenericHeader=n.tt,exports.Heading=n.Et,exports.Highlight=n.Y,exports.HoverCard=n.J,exports.IconButton=n.q,exports.Image=n.K,exports.InsetText=n.G,exports.Kbd=n.W,exports.LanguageNavigation=n.U,exports.Link=n.Ot,exports.Listbox=n.H,exports.Marquee=n.V,exports.Menu=n.B,exports.NotificationBanner=n.z,exports.Pagination=n.R,exports.Panel=n.L,exports.PhaseBanner=n.t,exports.PinInput=n.I,exports.Popover=n.F,exports.Progress=n.P,exports.ProgressCircle=n.N,exports.QRCode=n.M,exports.Radio=n.j,exports.RadioCard=n.A,exports.Rating=n.k,exports.ScrollArea=n.O,exports.SegmentedControl=n.E,exports.Select=n.D,exports.Separator=n.T,exports.ServiceNavigation=n.w,exports.Skeleton=n.C,exports.SkipLink=n.S,exports.Slider=n.x,exports.Spinner=n.b,exports.Stat=n.y,exports.Status=n.v,exports.Steps=n._,exports.SummaryList=n.g,exports.Switch=n.h,exports.Table=n.m,exports.Tabs=n.p,exports.Tag=n.n,exports.TagsInput=n.f,exports.TaskList=n.d,exports.Text=r.r,exports.Textarea=n.u,exports.Textinput=n.l,exports.Timeline=n.c,exports.Toast=n.s,exports.ToggleTip=n.o,exports.Tooltip=n.a,exports.TreeView=n.i,exports.WarningText=n.r,exports.govUKTheme=t.t,exports.govUKThemeSystem=t.n;var a=require("@chakra-ui/react");Object.keys(a).forEach(function(e){e!=="default"&&!Object.prototype.hasOwnProperty.call(exports,e)&&Object.defineProperty(exports,e,{enumerable:!0,get:function(){return a[e]}})});
package/dist/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  import "./rolldown-runtime-BRfZIaNm.mjs";
2
2
  import { t as e } from "./provider-pKYp1gHz.mjs";
3
3
  import { n as t, t as n } from "./govUKTheme-B4LmrRd_.mjs";
4
- import { $ as r, A as i, B as a, C as o, Ct as s, D as c, Dt as l, E as u, Et as d, F as f, G as p, H as m, I as h, J as g, K as _, L as v, M as y, N as b, O as x, Ot as S, P as C, Q as w, R as T, S as E, St as D, T as O, Tt as k, U as A, V as j, W as M, X as N, Y as P, Z as F, _ as I, _t as L, a as R, at as z, b as B, bt as V, c as H, ct as U, d as W, dt as G, et as K, f as q, ft as J, g as Y, gt as X, h as Z, ht as Q, i as $, it as ee, j as te, k as ne, l as re, lt as ie, m as ae, mt as oe, n as se, nt as ce, o as le, ot as ue, p as de, pt as fe, q as pe, r as me, rt as he, s as ge, st as _e, t as ve, tt as ye, u as be, ut as xe, v as Se, vt as Ce, w as we, wt as Te, x as Ee, xt as De, y as Oe, yt as ke, z as Ae } from "./govuk-chakra-0wIbHjYQ.mjs";
5
- import { r as je, t as Me } from "./DonutChart-qMSUcNyC.mjs";
4
+ import { $ as r, A as i, B as a, C as o, Ct as s, D as c, Dt as l, E as u, Et as d, F as f, G as p, H as m, I as h, J as g, K as _, L as v, M as y, N as b, O as x, Ot as S, P as C, Q as w, R as T, S as E, St as D, T as O, Tt as k, U as A, V as j, W as M, X as N, Y as P, Z as F, _ as I, _t as L, a as R, at as z, b as B, bt as V, c as H, ct as U, d as W, dt as G, et as K, f as q, ft as J, g as Y, gt as X, h as Z, ht as Q, i as $, it as ee, j as te, k as ne, l as re, lt as ie, m as ae, mt as oe, n as se, nt as ce, o as le, ot as ue, p as de, pt as fe, q as pe, r as me, rt as he, s as ge, st as _e, t as ve, tt as ye, u as be, ut as xe, v as Se, vt as Ce, w as we, wt as Te, x as Ee, xt as De, y as Oe, yt as ke, z as Ae } from "./govuk-chakra-DvWJuAiD.mjs";
5
+ import { r as je, t as Me } from "./DonutChart-hLl-PYTm.mjs";
6
6
  import { t as Ne } from "./Button-BmDGyjW7.mjs";
7
7
  export * from "@chakra-ui/react";
8
8
  export { l as Accordion, k as Alert, Te as Avatar, s as BackLink, D as Breadcrumbs, Ne as Button, De as Calendar, ke as Card, V as CardGroup, Ce as Carousel, X as Checkbox, Q as Code, oe as Collapsible, fe as ColorPicker, J as ColorSwatch, G as Combobox, xe as CookieBanner, ie as DateInput, U as Details, _e as Dialog, Me as DonutChart, ue as Editable, z as EmptyState, ee as ErrorSummary, L as Fieldset, he as FileUpload, ce as FloatingPanel, K as GOVUKCrest, r as GOVUKCrown, w as GOVUKFooter, F as GOVUKHeader, N as GOVUKOGL, e as GOVUKProvider, ye as GenericHeader, d as Heading, P as Highlight, g as HoverCard, pe as IconButton, _ as Image, p as InsetText, M as Kbd, A as LanguageNavigation, S as Link, m as Listbox, j as Marquee, a as Menu, Ae as NotificationBanner, T as Pagination, v as Panel, ve as PhaseBanner, h as PinInput, f as Popover, C as Progress, b as ProgressCircle, y as QRCode, te as Radio, i as RadioCard, ne as Rating, x as ScrollArea, u as SegmentedControl, c as Select, O as Separator, we as ServiceNavigation, o as Skeleton, E as SkipLink, Ee as Slider, B as Spinner, Oe as Stat, Se as Status, I as Steps, Y as SummaryList, Z as Switch, ae as Table, de as Tabs, se as Tag, q as TagsInput, W as TaskList, je as Text, be as Textarea, re as Textinput, H as Timeline, ge as Toast, le as ToggleTip, R as Tooltip, $ as TreeView, me as WarningText, n as govUKTheme, t as govUKThemeSystem };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "govuk-chakra",
3
- "version": "0.1.2",
3
+ "version": "0.1.3",
4
4
  "description": "A GOV.UK-flavoured component skin for Chakra UI with React.",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -83,9 +83,9 @@
83
83
  "@tiptap/react": "^3.31.3",
84
84
  "@tiptap/starter-kit": "^3.31.3",
85
85
  "framer-motion": "^13.2.0",
86
- "react": "^19.2.8",
87
- "react-dom": "^19.2.8",
88
- "react-is": "^19.2.8",
86
+ "react": "^19.3.0",
87
+ "react-dom": "^19.3.0",
88
+ "react-is": "^19.3.0",
89
89
  "recharts": "^3.10.1",
90
90
  "shiki": "^4.4.3"
91
91
  },
@@ -98,6 +98,7 @@
98
98
  "build:storybook": "storybook build",
99
99
  "prepublishOnly": "yarn build",
100
100
  "test": "vitest --project unit",
101
+ "test:list": "vitest list --project unit --filesOnly",
101
102
  "test:run": "vitest run --project unit",
102
103
  "test:coverage": "vitest run --project unit --coverage",
103
104
  "test:storybook": "vitest run --project storybook",
@@ -121,7 +122,10 @@
121
122
  "release:major": "npm version major && git push --follow-tags && npm publish",
122
123
  "push": "npm run release:patch",
123
124
  "push-minor": "npm run release:minor",
124
- "push-major": "npm run release:major"
125
+ "push-major": "npm run release:major",
126
+ "design:open-design": "node scripts/export-open-design.mjs",
127
+ "design:open-design:check": "node scripts/export-open-design.mjs --check",
128
+ "test:open-design": "node --test scripts/export-open-design.test.mjs"
125
129
  },
126
130
  "browserslist": {
127
131
  "production": [
@@ -150,7 +154,7 @@
150
154
  "@storybook/addon-vitest": "10.6.0",
151
155
  "@storybook/mcp": "^10.6.0",
152
156
  "@storybook/react-vite": "10.6.0",
153
- "@testing-library/dom": "^10.4.1",
157
+ "@testing-library/dom": "^10.4.2",
154
158
  "@testing-library/jest-dom": "^7.0.1",
155
159
  "@testing-library/react": "^16.3.3",
156
160
  "@testing-library/user-event": "^14.6.7",
@@ -160,15 +164,15 @@
160
164
  "@tiptap/starter-kit": "^3.31.3",
161
165
  "@types/jest": "^30.0.0",
162
166
  "@types/mocha": "^10.0.10",
163
- "@types/node": "^26.5.0",
164
- "@types/react": "^19.2.18",
165
- "@types/react-dom": "^19.2.7",
167
+ "@types/node": "^26.5.1",
168
+ "@types/react": "^19.3.0",
169
+ "@types/react-dom": "^19.3.0",
166
170
  "@typescript-eslint/eslint-plugin": "^8.70.0",
167
171
  "@typescript-eslint/parser": "^8.70.0",
168
172
  "@vitejs/plugin-react": "^6.1.1",
169
173
  "@vitest/browser-playwright": "^5.0.0",
170
174
  "@vitest/coverage-v8": "^5.0.0",
171
- "chromatic": "^18.7.2",
175
+ "chromatic": "^18.8.1",
172
176
  "chrome-devtools-mcp": "^1.9.0",
173
177
  "eslint": "^10.10.0",
174
178
  "eslint-config-prettier": "^10.1.8",
@@ -183,21 +187,21 @@
183
187
  "playwright": "^1.63.0",
184
188
  "prettier": "^3.9.6",
185
189
  "prop-types": "^15.8.1",
186
- "react": "^19.2.8",
187
- "react-doctor": "^0.9.13",
188
- "react-dom": "^19.2.8",
190
+ "react": "^19.3.0",
191
+ "react-doctor": "^0.9.14",
192
+ "react-dom": "^19.3.0",
189
193
  "react-icons": "^5.7.0",
190
- "react-is": "^19.2.8",
194
+ "react-is": "^19.3.0",
191
195
  "react-scripts": "5.0.1",
192
196
  "recharts": "^3.10.1",
193
197
  "shiki": "^4.4.3",
194
198
  "storybook": "10.6.0",
195
199
  "typescript": "^7.0.2",
196
- "vite": "^8.2.2",
200
+ "vite": "^8.3.0",
197
201
  "vite-plugin-checker": "^0.14.5",
198
202
  "vite-plugin-mcp": "^0.3.2",
199
203
  "vitest": "^5.0.0",
200
204
  "web-vitals": "^6.2.1",
201
- "webpack": "^5.110.3"
205
+ "webpack": "^5.111.0"
202
206
  }
203
207
  }
@@ -1,2 +0,0 @@
1
- const e=require("./fonts-C9Uv7ViY.js"),t=require("./px-to-rem-CwuxPF53.js");let n=require("@chakra-ui/react"),r=require("react/jsx-runtime"),i=require("react"),a=require("recharts"),o=require("@chakra-ui/charts");var s=(0,i.forwardRef)(function({fontSize:e,fontWeight:i=400,...a},o){typeof e==`number`&&!(e in t.a)&&console.warn(`[GOV.UK Text] fontSize={${e}} is not a valid GOV.UK type scale point. Use one of: 16, 19, 24, 27, 36, 48, 80.`);let s=t.t(e);return s?(0,r.jsx)(n.Text,{ref:o,fontSize:{base:s.small.fontSize,md:s.large.fontSize},lineHeight:{base:s.small.lineHeight,md:s.large.lineHeight},fontWeight:i,fontFamily:`body`,...a}):(0,r.jsx)(n.Text,{ref:o,fontSize:e,fontWeight:i,...a})}),c=(0,i.createContext)(null);function l(){let e=(0,i.useContext)(c);if(!e)throw Error(`Chart components must be rendered inside Chart.Root`);return e}function u(e,t){if(!(!e||!t||typeof e.payload!=`object`||e.payload===null))return e.payload[t]}function d(e){return e==null?``:(0,i.isValidElement)(e)||typeof e==`string`||typeof e==`number`?e:typeof e==`boolean`||typeof e==`bigint`?String(e):Array.isArray(e)?e.join(`, `):String(e)}function f(e){return typeof e!=`string`||e.length===0?e:e.charAt(0).toUpperCase()+e.slice(1)}function p({payload:e,label:t,labelFormatter:i,hideLabel:a,hideIndicator:o,hideSeriesLabel:c,showTotal:p,fitContent:m,nameKey:h,formatter:g,render:_}){let v=l(),y=e?.filter(e=>e.color!==`none`||e.type!==`none`);if(!y?.length)return null;let b=y,x=y[0],S=u(x,h)??t??x?.dataKey??`value`,C=d(i?.(String(S),b)??S),w=y.reduce((e,t)=>typeof t.value==`number`?e+t.value:e,0);return(0,r.jsxs)(n.Stack,{minW:m?void 0:`8rem`,gap:`1`,rounded:`l2`,bg:`bg.panel`,px:`2.5`,py:`1`,textStyle:`xs`,shadow:`md`,children:[a?null:(0,r.jsx)(s,{fontWeight:`medium`,children:C}),(0,r.jsx)(n.Box,{children:y.map((e,t)=>{let i=v.getSeries(e);if(_)return(0,r.jsx)(n.Box,{children:_(e)},t);let a=g?g(e.value,e.name):e.value?.toLocaleString(),[l,u]=Array.isArray(a)?a:[a,f(e.name)];return(0,r.jsxs)(n.Flex,{gap:`1.5`,wrap:`wrap`,align:`center`,children:[o?null:i?.color?(0,r.jsx)(n.Box,{boxSize:`2`,rounded:`full`,bg:v.color(i.color),borderWidth:`1px`,borderColor:`blackAlpha.200`,flexShrink:0}):(0,r.jsx)(n.Box,{boxSize:`2`,rounded:`full`,bg:`border.emphasized`,borderWidth:`1px`,borderColor:`blackAlpha.200`,flexShrink:0}),(0,r.jsxs)(n.HStack,{justify:`space-between`,flex:`1`,children:[c?null:(0,r.jsx)(s,{color:`fg.muted`,children:d(u)}),e.value==null?null:(0,r.jsx)(s,{fontFamily:`mono`,fontWeight:`medium`,fontVariantNumeric:`tabular-nums`,children:d(l)})]})]},t)})}),p?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(n.Separator,{mt:`1`}),(0,r.jsxs)(n.HStack,{gap:`1`,justify:`space-between`,pb:`1`,children:[(0,r.jsx)(n.Span,{color:`fg.muted`,children:`Total`}),(0,r.jsx)(s,{fontFamily:`mono`,fontWeight:`medium`,fontVariantNumeric:`tabular-nums`,children:g?(()=>{let e=g(w,``);return Array.isArray(e)?e[0]:e})():w.toLocaleString()})]})]}):null]})}function m({payload:e,verticalAlign:t=`bottom`,align:i=`center`,title:a,orientation:o,nameKey:c,spacing:p=`3`,interaction:m=`hover`,rootProps:h,itemProps:g,labelProps:_,indicatorProps:v}){let y=l(),b=e?.filter(e=>e.color!==`none`||e.type!==`none`);if(!b?.length)return null;let x=typeof p==`number`?`${p}px`:y.spacing(p);return(0,r.jsxs)(n.Stack,{gap:`1.5`,align:{left:`flex-start`,center:`center`,right:`flex-end`}[i],pt:t===`bottom`?`3`:void 0,pb:t===`top`?`3`:void 0,...h,children:[a?(0,r.jsx)(s,{fontWeight:`medium`,children:a}):null,(0,r.jsx)(n.Flex,{"data-orientation":o,gap:x,direction:{_horizontal:`row`,_vertical:`column`},align:{_horizontal:`center`,_vertical:`flex-start`},flexWrap:`wrap`,children:b.map((e,t)=>{let i=y.getSeries(e),a=i?.name==null?void 0:typeof i.name==`string`?i.name:String(i.name),o=f(u(e,c)??i?.label);return(0,r.jsxs)(n.HStack,{gap:`1.5`,style:{opacity:y.getSeriesOpacity(a,.6)},onClick:()=>{m===`click`&&a&&y.setHighlightedSeries(e=>e===a?null:a)},onMouseEnter:()=>{m===`hover`&&a&&y.setHighlightedSeries(a)},onMouseLeave:()=>{m===`hover`&&a&&y.setHighlightedSeries(null)},...g,children:[i?.icon?i.icon:(0,r.jsx)(n.Box,{boxSize:`2`,rounded:`full`,bg:i?.color?y.color(i.color):`border.emphasized`,borderWidth:`1px`,borderColor:`blackAlpha.200`,flexShrink:0,...v}),(0,r.jsx)(n.Span,{color:`fg.muted`,..._,children:d(o)})]},t)})})]})}function h(e){let{rootProps:t,itemProps:n,labelProps:i,indicatorProps:o,title:s,nameKey:c,interaction:l,spacing:u,payload:d,align:f,verticalAlign:p,layout:h,...g}=e;return(0,r.jsx)(a.Legend,{...g,align:f,verticalAlign:p,layout:h,content:(0,r.jsx)(m,{rootProps:t,itemProps:n,labelProps:i,indicatorProps:o,title:s,nameKey:c,interaction:l,spacing:u,payload:d,align:f,verticalAlign:p,layout:h})})}function g(e){return(0,r.jsx)(a.Tooltip,{...e,content:(0,r.jsx)(p,{...e})})}function _({fontFamily:n=`body`,fontSize:i=16,...a}){let s=t.t(i);if(!s)console.warn(`[GOV.UK Chart] fontSize={${i}} is not a valid GOV.UK type scale point. Use one of: 16, 19, 24, 27, 36, 48, 80.`);else return(0,r.jsx)(c.Provider,{value:a.chart,children:(0,r.jsx)(o.Chart.Root,{fontFamily:n,css:{"& svg.recharts-surface tspan":{fontSize:{base:s.small.fontSize,md:s.large.fontSize},lineHeight:{base:s.small.lineHeight,md:s.large.lineHeight},color:`fg`,fontFamily:e.t.body.value},"& .recharts-tooltip-wrapper":{background:`var(--govuk-colors-bg)`,borderRadius:`var(--govuk-radii-l2)`}},...a})})}var v=Object.assign(_,{...o.Chart,Root:_,Legend:h,LegendContent:m,Tooltip:g,TooltipContent:p});function y({chart:e,chartRootProps:t,...n}){return(0,r.jsx)(v.Root,{chart:e,...t,children:(0,r.jsx)(a.PieChart,{data:e.data,...n})})}var b=Object.assign(y,{Root:y});Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return s}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return b}});
2
- //# sourceMappingURL=DonutChart-Dv_SZ-sU.js.map