@ebrains/react 2.3.0 → 2.4.0

package/logo-variations-horizontal_2.entry.esm.js

@@ -11,47 +11,47 @@ const LogoVariationsHorizontal = class {
   }
   render() {
     return h("div", {
-      key: '148d0694cc666c2048a65f035e3b423f14721a24',
+      key: '0f0c8f6752da65c793c2f7ad20a9e9a038c15f16',
       class: "container"
     }, h("ul", {
-      key: '577efdbf7af11206706768435afcf949e704c16a',
+      key: 'fb9647dcdb07fc5eec1a84c7458094add83233ba',
       class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'e280ee9020e2750a2f3637a01cf623ccc0b94bfe',
+      key: '06069a4da6863f7bd714191610ce44730531c25d',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: 'a5be5fc2dae4b966722d0ad69510f6622882aa99',
+      key: 'a2c24b224acb98ea80b4d43695a0cae87de8f311',
       class: "f-body-01 text-center my-4"
     }, "#1 Coloured"), h("div", {
-      key: 'e20d0633cc5c1c6f61c8147d55b7dd228c774f99',
+      key: 'a672294c291984c387fb5ddfbbf89a5209cf88d3',
       class: "coloured"
     }, h("eds-logo", {
-      key: '2a5a4eea4c70fadfcaef15c5b2c498b833231603',
+      key: 'f6540444fabfeb1313103ecc860c9543335bf693',
       type: "no-bg",
       href: "#"
     }))), h("li", {
-      key: '6da7cc2329e7abcccfe3d2a0f095320d33b6272e',
+      key: '769c0e2d304e117ae5925a0d2d981f85cb31281f',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: '5dcb436091288a40213ad53fff116c0a18fd8626',
+      key: '1c4b6cb455ef32c5b94bead22b7116aec3b9233c',
       class: "f-body-01 text-center my-4"
     }, "#2 Black & White"), h("div", {
-      key: 'e0f165856fb0a693ca2a655b5f6beb8f37810905',
+      key: '8e3c36097fa1dd5d0fa8cdafe00daaaa035f5463',
       class: "bg-default"
     }, h("eds-logo", {
-      key: 'ca1d9b99e93b458c9a4c59389ade43db1aedd473',
+      key: 'cdd92bd788afa9e127ad6163ce132f2e6d620c95',
       type: "black",
       href: "#"
     }))), h("li", {
-      key: '8ae1f94da858d44f7efa0d7c2c4d83b8e1780bf6',
+      key: 'e8012388b0209873684706e16306144174212b6c',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: 'dcd75bb1f4717a6d8b34f522c25b04a976bcbdea',
+      key: '49b42b62f6f769c81526add05822df44941bba5c',
       class: "f-body-01 text-center my-4"
     }, "#3 Dark"), h("div", {
-      key: '11f500da753124767502a09824007bef6586b445'
+      key: '4ba6fc32175d6b6dd3f38e551eb80f4e5d1144d0'
     }, h("eds-logo", {
-      key: '95ed147e3a5284960d5c740841620d622537cc3c',
+      key: '3ebe5f6551a960873a82af20a4d415b175b7f8de',
       type: "color-white",
       href: "#"
     })))));
@@ -68,50 +68,50 @@ const LogoVariationsVertical = class {
   }
   render() {
     return h("div", {
-      key: '33670ab1d0922b7ce5d561ae1bcb25d85cdf3ecb',
+      key: '7d88d267037ee805159ea73f27b15d2e7ec0e1b6',
       class: "container"
     }, h("ul", {
-      key: '7b05bb7f6e1699766f6d0321762f0ef66ab3b306',
+      key: '848defdb55c164b9fb3cee0b1425acbcbfeda209',
       class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'f64a1ad98d1c126581283ed16b665dea3fa1d03e',
+      key: '9e5d7a1218da406b571ef4a8026aabfd2618846d',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: '41c416c593cacad33a826c76e6617bc6c6b5b9e3',
+      key: 'ed5bc7c77061eee46c95e719aa938d1374d413c6',
       class: "f-body-01 text-center my-4"
     }, "#1 Coloured"), h("div", {
-      key: '9bf761058eb7581b949af689a0341dc2a8b85b24',
+      key: 'b508a4c0fb271a880e16a375cff36ecfe70d55a7',
       class: "mx-auto coloured w-[300px]"
     }, h("eds-logo", {
-      key: 'eb04b74cf4feb3054ba5b769fd7690281dbf768b',
+      key: 'e92421e0d04d84ae40d36bdd1d7d20b0582da600',
       orientation: "vertical",
       type: "no-bg",
       href: "#"
     }))), h("li", {
-      key: '15eede1e668a9012de6ab03dde25b5e4c51605c6',
+      key: '1a6c57792d0b9a7fd89036d963556def55a9a3cf',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: '8d99d4f4caf4ef224fb691fdebfd3048075db0c0',
+      key: '56b18c6f6932f92995b5e936dc271f07fdcb2896',
       class: "f-body-01 text-center my-4"
     }, "#2 Black & White"), h("div", {
-      key: 'f4b55a2fc4305075270e9e4a6149be5278fe3618',
+      key: '8d77de5838230e17a30d6327c71a3e93cf52c8db',
       class: "mx-auto bg-default w-[300px]"
     }, h("eds-logo", {
-      key: '38ca84d79e788b92ce2489e19f35b8ba989313f2',
+      key: 'f818a1028b59b30aa2d7ddd35146e81d332f653a',
       orientation: "vertical",
       type: "black",
       href: "#"
     }))), h("li", {
-      key: 'e6193b54d8b8cda2dc44bce2b983af7e7f3db0b3',
+      key: '0ce7ef6e6f3e95d43a8133c12a0b2b57bfb9b67a',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("p", {
-      key: '2564444f18acf01edd3caa3e4df06a0a54cad60a',
+      key: '8a0e61ff35121c1c3e60320d4023e44e639cee72',
       class: "f-body-01 text-center my-4"
     }, "#3 Dark"), h("div", {
-      key: '70db409bd6dfd47bb66cef38059a52a9b0556e14',
+      key: '412f19f119a71743bae3a824874e1a1dcafcd258',
       class: "mx-auto w-[300px]"
     }, h("eds-logo", {
-      key: '567844257939403cee8d4ce76b84dfdc12df97d1',
+      key: 'a62f01cb47568231e90facf00ab74481e818a40b',
       orientation: "vertical",
       type: "color-white",
       href: "#"

package/logo-variations-tabs.entry.esm.js

@@ -20,7 +20,7 @@ const LogoVariationsTabs = class {
   }
   render() {
     return h("div", {
-      key: '5e6042f51c956138d571256803766ef2497ca160',
+      key: 'b05bf7f07b39c2119f4716da95f34372f75f6137',
       class: "container"
     }, this.renderContent());
   }

package/logo-wrong-usage.entry.esm.js

@@ -12,86 +12,86 @@ const LogoWrongUsage = class {
   }
   render() {
     return h("div", {
-      key: 'a5d22b7db9bf43fa54d7e0fe611b819e374b6f6b',
+      key: '37850687dda1175073866d4898102d185ced3e2d',
       class: "container"
     }, h("ul", {
-      key: 'a2d9ebad864822e00db5bb207caf599de80be433',
+      key: '2734a992d3ee5249c024dbb982fc452334645dff',
       class: "not-prose grid-layout grid-cols-6 gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'ad449a11eb8e1404a47266adb9072efa0c182752',
+      key: '26514741d093eb98a9898df179a5308864116b2a',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '3f9ab867a20bc72e15c5403683d50b0f86c18727',
+      key: '8162f53c61380494f776122dd5e7183dbaa5a941',
       class: "mx-auto no-other-bg-color logo",
       innerHTML: hLogoColor
     }), h("p", {
-      key: '8a9ebdfd97d048e046adc85f182657c065d7c5e2',
+      key: 'c8a6b7af377d7bd214f3fa85d0032af5d9c64b58',
       class: "f-ui-02 text-center"
     }, "Do not use with backgrounds that make legibility difficult")), h("li", {
-      key: '621dc6459bd6934ada8cbbcb99e848464c6d7719',
+      key: 'c17db6db70ecaf33bf39942d18d11041d233c6e0',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: 'be8c7b7fc30111d6bd7e7803d4a47b58ab8275f9',
+      key: 'c0e542cfa0cec0729dd56f4b7dd5e3e514a4c375',
       class: "mx-auto no-other-color logo non-brand-color",
       innerHTML: hLogoColor
     }), h("p", {
-      key: '1e458e14065bc2f064c29f03e7047578837e8dbf',
+      key: '10ee19b46078ea7fcaad394adff676f7a90d39e1',
       class: "f-ui-02 text-center"
     }, "Do not apply other colors")), h("li", {
-      key: '92f588b1b08e74ae6de62037c611cd2c07c2d0f6',
+      key: '7e02bb8a4d1ba255a7a2323bbf7056788822301d',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '1a8b871c1887b96183efc5a884085cd627a5dd03',
+      key: '7901b9c28eaed72f2816cc4fa16461a64b2b876c',
       class: "mx-auto distorted logo",
       innerHTML: hLogoColor
     }), h("p", {
-      key: '2ca68cc09eac491203fec3d84b19623dfc1c0433',
+      key: '011b641e58c216d125bf0fe0495be11c65710a13',
       class: "f-ui-02 text-center"
     }, "Do not deform the logo")), h("li", {
-      key: 'ee43635fa2d0dff9b9a5ea76127f5a35d1863c2a',
+      key: '4dd09cd947f29519c2c7b3f78dd98bd40a80b54f',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '3176d2dbec423d743b8d05c64d7a21088bf830a1',
+      key: 'c19319983842106734c63c103fb04b5e5fc32e39',
       class: "mx-auto effects logo",
       innerHTML: hLogoColor
     }), h("p", {
-      key: '1148d744012e92f34ac48a2b69c3fb6451e4f844',
+      key: '2de8694d6e8b790086a5d9e2ce8c2454ad02e1fb',
       class: "f-ui-02 text-center"
     }, "Do not apply effects")), h("li", {
-      key: 'acde874cf0fd644ec0edc7350fc038e0ae13719d',
+      key: '9e70df0ce29692c5f70ac4849fa0765fbf979ad8',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '27b2b50f017142b1e9638baf1865fd804ba9121d',
+      key: 'd0f778976c8dc89ec22174b56600aa69f15a45a2',
       class: "mx-auto rotated logo",
       innerHTML: hLogoColor
     }), h("p", {
-      key: '28dfe52d02bdb82f29947227a9a9a699aabf82ef',
+      key: 'e8d9c2bafc5eebfd2f289fee9cfb916abe77b04a',
       class: "f-ui-02 text-center"
     }, "Do not rotate the logo")), h("li", {
-      key: 'e754250d250603022bb031e66e7fd8e8e0f04155',
+      key: 'd590b661312fd6b56199ee0790a10acda0b8aadb',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '042817f8f946a10372439398e4f6dd3c0fc182f6',
+      key: 'cfeb7d7a4af9fc595c0d4e083ad670a170ca2885',
       class: "mx-auto outlined logo",
       innerHTML: hLogoColor
     }), h("p", {
-      key: 'f5136df73757f3ebd3c954f3aa5f9e47d7907c64',
+      key: '15f6ff0ba150d42f18a19973d167510ae4c95c6b',
       class: "f-ui-02 text-center"
     }, "Do not apply outlines")), h("li", {
-      key: '6e30b4684ebe21136ddecef9e879024ce93206ad',
+      key: '56c45146f541a7fb8814810a31e8b0393c976281',
       class: "grid-col-span-6 xxl:grid-col-span-2 xl:grid-col-span-3 lg:grid-col-span-3 md:grid-col-span-3 flex flex-col"
     }, h("div", {
-      key: '29ceba568f002cf04a810546ac76ed4d4a0c63fd',
+      key: '1ded3e72b457a639184f4f3f0801eb62af87f536',
       class: "mx-auto"
     }, h("div", {
-      key: '53976603b457baf9d28f4216b2ef54284467ffd7',
+      key: '67661f2f1273b925779001cb94b345771a74d726',
       class: "bg-accent p-16"
     }, h("div", {
-      key: 'bdce208801ad76f3f8fd1639ca08b3a341ccf014',
+      key: '33d473c812643bf3fbc87170c80638566de1b0b5',
       class: "text-inverse",
       innerHTML: hLogoColor
     })), h("p", {
-      key: '97e656465d81823f22593dd8ec936dde966560e0',
+      key: '7a5edbc5ae089dd87eef05baa755caf8e4a5bde3',
       class: "f-ui-02 text-center"
     }, "Do not use the green background for the logo version of the logo with backgrounds with the same tones")))));
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebrains/react",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "module": "./index.esm.js",
   "type": "module",
   "main": "./index.esm.js",

package/src/components.d.ts

@@ -30,6 +30,7 @@ export declare const EdsPagination: import("react").ForwardRefExoticComponent<JS
 export declare const EdsPie: import("react").ForwardRefExoticComponent<JSX.EdsPie & Omit<import("react").HTMLAttributes<HTMLEdsPieElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsPieElement>>;
 export declare const EdsProgressBar: import("react").ForwardRefExoticComponent<JSX.EdsProgressBar & Omit<import("react").HTMLAttributes<HTMLEdsProgressBarElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsProgressBarElement>>;
 export declare const EdsRating: import("react").ForwardRefExoticComponent<JSX.EdsRating & Omit<import("react").HTMLAttributes<HTMLEdsRatingElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsRatingElement>>;
+export declare const EdsSidebar: import("react").ForwardRefExoticComponent<JSX.EdsSidebar & Omit<import("react").HTMLAttributes<HTMLEdsSidebarElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsSidebarElement>>;
 export declare const EdsSocialNetworks: import("react").ForwardRefExoticComponent<JSX.EdsSocialNetworks & Omit<import("react").HTMLAttributes<HTMLEdsSocialNetworksElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsSocialNetworksElement>>;
 export declare const EdsSpinner: import("react").ForwardRefExoticComponent<JSX.EdsSpinner & Omit<import("react").HTMLAttributes<HTMLEdsSpinnerElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsSpinnerElement>>;
 export declare const EdsSplashScreen: import("react").ForwardRefExoticComponent<JSX.EdsSplashScreen & Omit<import("react").HTMLAttributes<HTMLEdsSplashScreenElement>, "style"> & import("./react-component-lib/interfaces").StyleReactProps & import("react").RefAttributes<HTMLEdsSplashScreenElement>>;

package/svg-repository.entry.esm.js

@@ -37,7 +37,7 @@ import { p as portal } from './portal-d6c8ce56.esm.js';
 import { p as privat } from './private-1c25ff8e.esm.js';
 import { p as pub } from './public-d4d8c585.esm.js';
 import { t as tutorial } from './tutotial-150ee1fd.esm.js';
-import { u as upDonw } from './up-and-down-d747abee.esm.js';
+import { u as upDown } from './up-and-down-8b69ca97.esm.js';
 import { b as bin } from './bin-37cad2f0.esm.js';
 import { s as start } from './start-65126a4f.esm.js';
 import { d as draft } from './draft-dd5dada2.esm.js';
@@ -266,7 +266,7 @@ const svgs = /*#__PURE__*/Object.freeze({
   pub: pub,
   portal: portal,
   user: user,
-  upDonw: upDonw,
+  upDown: upDown,
   search: search,
   success: success,
   tutorial: tutorial,
@@ -314,10 +314,10 @@ const SvgRepository = class {
       }
     };
     return h("div", {
-      key: '9e4eb1306b8d43f5879b2e7c0ef0019f83c0b3b5',
+      key: '996c9a1b05d34ec171b8c58098fb3fd8e28aa81f',
       class: "full-width"
     }, h("eds-table", {
-      key: '3b6349562155ffed788587d39a82d0a2fb9798bb',
+      key: 'bc8d69bba7a6e6580ee808935fe7845194f6d38b',
       "table-data": JSON.stringify(svgData),
       config: JSON.stringify(tableConfig),
       "rows-per-page": 10,

package/token-list_3.entry.esm.js

@@ -296,7 +296,7 @@ const TokenList = class {
       [this.show]: colors[this.show]
     } : colors;
     return h("section", {
-      key: 'db196307702df28bf9e2f7fb0b87298bf84baabb',
+      key: '2fcc5dd08b84b47b561c6f32f49c65b90560069f',
       class: "w-full mt-28"
     }, Object.entries(sectionsToDisplay).map(([sectionName, sectionContent]) =>
     // Only render sections that exist in `colors`
@@ -317,10 +317,10 @@ const TokenRadii = class {
   }
   render() {
     return h("section", {
-      key: 'bdd584d53625299e4faa9a28f6f259bc5587b125',
+      key: '2afbed04fa53695bfc13275ab6d6f77d314e4d14',
       class: "w-full mt-28"
     }, h("ul", {
-      key: '3076e4efcca5749cc07e69df70ce2658d6186ec6',
+      key: '87490ba0d46027993d10cdf5f5deef419cc147c1',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(radii).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
@@ -358,10 +358,10 @@ const TokenShadows = class {
   }
   render() {
     return h("section", {
-      key: 'a2fbc57c2153391bc53b47a263488118ca3aa01a',
+      key: '56dcf320ff3ee79c493757a3cfe27c1f7bca33d9',
       class: "w-full mt-28"
     }, h("ul", {
-      key: 'e4e2d6cbc8d1510ede2b678b24ce8b34b838888f',
+      key: '8113c23d2eaab9abd28acb618c9599d5be1262a6',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(shadowTokens).map(([category, tokens]) => Object.entries(tokens).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-6 flex flex-col items-center mt-16"

package/token-ratios.entry.esm.js

@@ -17,15 +17,15 @@ const TokenRatios = class {
   }
   render() {
     return h("section", {
-      key: '83fc87fd64531611114fe47d977dc54b6af1d327',
+      key: '4dcf52cac610208030db8af7681cfee611f02a62',
       class: "w-full"
     }, h("eds-section-core", {
-      key: 'b0b72d4f387cd48f4905c68b9f05ac3058d359c1',
+      key: 'cb571aba92bc59c7b458281258362ca91becc09b',
       tag: "div",
       "section-title": "Aspect Ratios",
       "heading-level": "h3"
     }, h("ul", {
-      key: 'af5677bb15a4ffb008fd90bdfdfb1b757a36e138',
+      key: '734f5db424dce811f5b6508c49c9f4c9ea4f4474',
       class: "gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(ratios).map(([key, value]) => h("li", {
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"

package/token-spacing.entry.esm.js

@@ -9,82 +9,82 @@ const TokenSpacing = class {
   }
   render() {
     return h("div", {
-      key: '46cb6fe655e9f8b8688f44e2351f3992e8011b2a',
+      key: '45442561f72445e84c257ebc9d30f2147303427a',
       class: "w-full"
     }, h("ul", {
-      key: '9d7205ee2e0b3b0386284dc282fcc5375c43ec26',
+      key: 'cca0cba4260ddebb2b0f1e39a9cc96d067d3fa73',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, h("li", {
-      key: 'b3e9d62bb934c1b413712b182cfdf015484db525',
+      key: '8c38c0e0802683d9ba2cb38dff013aa02650bbe0',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '78c8a23dcacfd216a6159da8af3809607ef29702',
+      key: '406aac1f24a9a812b7405b5e323e3cb73574fb79',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '92a2938c5bdcb38456d96077f78993c711bc789f',
+      key: 'ec7f90ce92020a91b57e28545ede5d782d4a7dcc',
       class: "spacing-sample m-16 bg-strong"
     }, h("span", {
-      key: '7738363bee7cc25863bec922f55224044af61b6e',
+      key: 'e84d0c8ccc0c6be14ca41bceece9cc63a8137dfb',
       class: "f-body-01 text-inverse"
     }, "Margin: 1rem / m-16")))), h("li", {
-      key: '96c1f622b7e4136cebd53862b79bbc17ad484a25',
+      key: 'dce507afa0eac9ddd430d8b2034b943e844a9b32',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: 'ff4357650e10f9e7a61903c3c9f6a4f4d60d8c73',
+      key: 'cc986ee89d249ac351c6ed81650668a8ba8ab139',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'cd07be06a51604f81f2868786028066f834cd87d',
+      key: '1778c2032e322a0cde34987e5ecaaeec38933892',
       class: "spacing-sample ml-64 bg-strong"
     }, h("span", {
-      key: 'ded579013d8765c7802862b57cf2bf7ae03f1b99',
+      key: '8ee98a9847db2baf69adf1e5919ecefa86a1dea8',
       class: "f-body-01 text-inverse"
     }, "Margin Left: 4rem / ml-64")))), h("li", {
-      key: 'a8e244c95f027993755fa567d900ff88ed08669b',
+      key: '589485906ebebf8fdc348e995e6aae0dcd4124fd',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: 'e3662c064d089089ebb796aadede38bbd7ebe69d',
+      key: 'b94fe2cd4f93f7e52fc82423d728f5ffd3cb7dd1',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'f168cbeaec417b0eccd66ed60f2776bdffdb7bfb',
+      key: '5c6ed8a3c4573eb4f7644e18a4e6c10cab958e2a',
       class: "spacing-sample mt-32 bg-strong"
     }, h("span", {
-      key: '696ec848f217896ae3fc06bf07546fe735d6ccd8',
+      key: 'bec15bc9092c36295bf012f82fd34e8eee5954cf',
       class: "f-body-01 text-inverse"
     }, "Margin Top: 2rem / mt-32")))), h("li", {
-      key: '5e5d4a63fd7e28114a87dfa5789f5213b6c057f3',
+      key: 'e9568891252c4597431f117f0f8c9136d30c3658',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '14cb262cc18f340e72a922dc793244c17fa9fb05',
+      key: '1fac252cd3bfd2cb1f9aa3b419e04f570f57f4e8',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '791781717dc851f2e174277c557212e7e5c15b7a',
+      key: 'd59e7e5f180ab164837c5b94cf3f61a7084a6385',
       class: "spacing-sample p-32 bg-strong"
     }, h("span", {
-      key: 'd1df2d8f2520746e49ec9c85d8e17cf5569c4bc5',
+      key: '73dc397292ae7ff9c532b4c6c9f2a42c35945493',
       class: "f-body-01 text-inverse"
     }, "Padding: 2rem / p-32")))), h("li", {
-      key: '312e2c71672a05cc54cd492297a1cdcb2b11a395',
+      key: 'af9c0e9fb5fd5c314d34f2cf6b2bdc9a63133c0d',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '8cd16bfafd2345b68e50a46c08c7a8f2430ee6ef',
+      key: '498a46c66ec671f41681f458615d69a741784761',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: '8f7e910d8fc43b596b35f3e72a48646e9550e8ba',
+      key: '6e511b973ff53d748e99728fb1b186796437bbca',
       class: "spacing-sample pt-32 bg-strong"
     }, h("span", {
-      key: '509c712085a239a435fc11f8ea7a6c9c788be60c',
+      key: 'cae79c38937cae94930fa8750fb308ab4329de45',
       class: "f-body-01 text-inverse"
     }, "Padding Top: 2rem / pt-32")))), h("li", {
-      key: 'b99c86cd7dd23e7c091dd2c70ec42133d9d2e2ef',
+      key: '67e0ec47dfcbaf8c51969973137c4ba87ee6337d',
       class: "grid-col-span-12 md:grid-col-span-4 flex flex-col items-center mt-16"
     }, h("div", {
-      key: '0e61fb5d7bf779eddc16c9627d6ca0ff6cf702e1',
+      key: 'aa8003ce3db28c8697d57728c02797324dffbf1f',
       class: "container p-8 item-center border-2 border-soft"
     }, h("div", {
-      key: 'e65eb20ca88e563ae43eb0c208feacf7e310870f',
+      key: 'aeaa333a1e0fbfaf5d2fcc49c4e8180e94b91b03',
       class: "spacing-sample pl-32 bg-strong"
     }, h("span", {
-      key: '2a40e6977caccb37173f60de613c1a72b02f6d3e',
+      key: '708a18ad1ebeb0a24fcea4d06aa42c024bb2258a',
       class: "f-body-01 text-inverse"
     }, "Padding Left: 2rem / pl-32"))))));
   }

package/token-typography.entry.esm.js

@@ -202,10 +202,10 @@ const TokenTypography = class {
   }
   render() {
     return h("section", {
-      key: 'ff15f73114d16107a766fe6fe8342315cf2fa542',
+      key: '859a416f39219fa58601b57eab3d3ceeceb072fa',
       class: "w-full"
     }, h("ul", {
-      key: '22e8e89e792fee03f1957e5705fca1938771b9ac',
+      key: '3c29d182685328e8bf1ae8b46909426c2b2164cf',
       class: "not-prose gap-y-8 md:gap-y-12 lg:gap-y-16"
     }, Object.entries(typography.typesets).filter(([typeKey]) => typeKey !== 'displays') // Exclude "displays"
     .flatMap(([typeKey, typeValues]) => Object.entries(typeValues).map(([size, style]) => h("li", {

package/{up-and-down-d747abee.esm.js → up-and-down-8b69ca97.esm.js}

@@ -1,4 +1,4 @@
-const upDonw = `  <svg
+const upDown = `  <svg
     width="20"
     height="20"
     viewBox="0 0 20 20"
@@ -9,4 +9,4 @@ const upDonw = `  <svg
     <path d="M10 17L5 12L15 12L10 17Z" fill="currentColor" />
   </svg>`;
 
-export { upDonw as u };
+export { upDown as u };