@wikimedia/codex/dist/sandbox/assets/icons-9U2yvrVJ.js

Codex Design System for Wikimedia

import{d as y,aY as S,f as T,o as t,w as C,e as l,b as a,F as u,p as d,q as p,g as R,s as g,j as x,ae as b,C as V,n as L,aN as I,aO as N}from"./DemoBaseLayout.vue_vue_type_style_index_0_lang-CWG_HZgx.js";import"./TypeaheadSearch.vue_vue_type_style_index_0_lang-guaG63gZ.js";const $={id:"cdx-icon"},k={class:"cdx-demo-icon-table"},_=["lang"],z=["dir"],A=y({__name:"IconGrid",setup(B){var m;const h=["ltr","rtl"],f=[{},{size:"medium",color:"red"},{size:"small"},{size:"x-small",color:"blue"}],i=[];for(const[c,n]of Object.entries(S)){if(typeof n=="function")continue;const e=c.replace(/^cdxIcon/,"").replace(/[A-Z]/g,o=>"-".concat(o.toLowerCase())).replace(/^-/,"");if(typeof n!="string"&&("langCodeMap"in n||"shouldFlipExceptions"in n)){const o="langCodeMap"in n?Object.keys(n.langCodeMap):(m=n.shouldFlipExceptions)!=null?m:[];for(const s of o)i.push({iconName:c,cssIconName:e,icon:n,langCode:s,langLabel:s});i.push({iconName:c,cssIconName:e,icon:n,langLabel:"other"})}else i.push({iconName:c,cssIconName:e,icon:n})}return(c,n)=>(t(),T(I,{class:"cdx-icon-grid"},{header:C(()=>n[0]||(n[0]=[p(" Codex Icon Grid ")])),content:C(()=>[l("section",$,[n[4]||(n[4]=l("h2",null,"Icon",-1)),l("table",k,[n[2]||(n[2]=l("caption",null,"All icons",-1)),n[3]||(n[3]=l("thead",null,[l("tr",null,[l("th",null,"Icon name (language)"),l("th",{colspan:"4"}," Default size, default color "),l("th",{colspan:"4"}," Medium size, red color "),l("th",{colspan:"4"}," Small size, default color "),l("th",{colspan:"4"}," Extra small size, blue color ")])],-1)),l("tbody",null,[n[1]||(n[1]=l("tr",null,[l("th",{"aria-hidden":"true"}),l("th",null,"Vue LTR"),l("th",null,"Vue RTL"),l("th",null,"CSS-only LTR"),l("th",null,"CSS-only RTL"),l("th",null,"Vue LTR"),l("th",null,"Vue RTL"),l("th",null,"CSS-only LTR"),l("th",null,"CSS-only RTL"),l("th",null,"Vue LTR"),l("th",null,"Vue RTL"),l("th",null,"CSS-only LTR"),l("th",null,"CSS-only RTL"),l("th",null,"Vue LTR"),l("th",null,"Vue RTL"),l("th",null,"CSS-only LTR"),l("th",null,"CSS-only RTL")],-1)),(t(),a(u,null,d(i,e=>l("tr",{key:e.iconName},[l("th",null,[p(g(e.iconName)+" ",1),e.langLabel?(t(),a(u,{key:0},[p(" ("+g(e.langLabel)+") ",1)],64)):R("v-if",!0)]),(t(),a(u,null,d(f,({size:o,color:s})=>(t(),a(u,{key:"".concat(o,"-").concat(s)},[(t(),a(u,null,d(h,r=>l("td",{key:r},[x(b(V),{class:L({["cdx-demo-icon-vue-icon--color-".concat(s)]:!!s}),icon:e.icon,lang:e.langCode,dir:r,size:o},null,8,["class","icon","lang","dir","size"])])),64)),(t(),a(u,null,d(h,r=>l("td",{key:r,lang:e.langCode},[l("span",{class:L("cdx-demo-icon-css-icon--".concat(e.cssIconName).concat(o?"--size-".concat(o):"").concat(s?"--color-".concat(s):"")),dir:r},null,10,z)],8,_)),64))],64))),64))])),64))])])])]),_:1}))}});N(A).mount("#app");