[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_490":491,"_492":493},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_264":265,"_50":-7,"_266":-5,"_17":267,"_268":269,"_270":271,"_272":273,"_274":275,"_64":-5,"_276":-5,"_277":-5,"_278":24,"_279":280,"_281":224,"_282":-5,"_283":-5,"_284":285},"routes/_app.x.$handle.$name.branch.$branch.history",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":20,"_21":22,"_23":24,"_25":-5},"handle","jxnblk","name","tuna","branchName","main","project",{"_44":211,"_13":14,"_48":212,"_213":-5,"_214":24,"_215":216,"_217":216,"_218":219,"_220":221,"_25":79,"_222":103,"_223":224,"_225":224,"_226":227,"_228":229,"_52":53,"_230":-5,"_231":-5,"_232":-5,"_233":-5,"_234":235,"_236":235,"_237":238,"_239":238,"_240":238,"_241":235,"_242":235,"_62":243,"_244":245,"_246":247,"_248":24},"page",1,"history",[26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43],"hasNext",false,"userId",{"_44":204,"_46":47,"_48":205,"_50":206,"_52":53,"_54":197,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":207,"_64":208,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":209},{"_44":197,"_46":47,"_48":198,"_50":199,"_52":53,"_54":189,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":200,"_64":201,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":202},{"_44":189,"_46":47,"_48":190,"_50":191,"_52":53,"_54":182,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":192,"_64":193,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":194},{"_44":182,"_46":47,"_48":183,"_50":184,"_52":53,"_54":175,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":185,"_64":186,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":187},{"_44":175,"_46":47,"_48":176,"_50":177,"_52":53,"_54":166,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":178,"_64":179,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":180},{"_44":166,"_46":47,"_48":167,"_50":168,"_52":53,"_54":159,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":169,"_64":170,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":171},{"_44":159,"_46":47,"_48":160,"_50":161,"_52":53,"_54":150,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":162,"_64":163,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":164},{"_44":150,"_46":47,"_48":151,"_50":152,"_52":53,"_54":143,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":153,"_64":154,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":155},{"_44":143,"_46":47,"_48":144,"_50":145,"_52":53,"_54":136,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":146,"_64":147,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":148},{"_44":136,"_46":47,"_48":137,"_50":138,"_52":53,"_54":129,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":139,"_64":140,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":141},{"_44":129,"_46":47,"_48":130,"_50":131,"_52":53,"_54":119,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":132,"_64":133,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":134},{"_44":119,"_46":47,"_48":120,"_50":121,"_52":53,"_54":112,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":122,"_64":123,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":124},{"_44":112,"_46":47,"_48":113,"_50":114,"_52":53,"_54":105,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":115,"_64":116,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":117},{"_44":105,"_46":47,"_48":106,"_50":107,"_52":53,"_54":96,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":108,"_64":109,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":110},{"_44":96,"_46":47,"_48":97,"_50":98,"_52":53,"_54":89,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":99,"_64":100,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":101},{"_44":89,"_46":47,"_48":90,"_50":91,"_52":53,"_54":82,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":92,"_64":93,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":94},{"_44":82,"_46":47,"_48":83,"_50":84,"_52":53,"_54":45,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":85,"_64":86,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":87},{"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":71},"id","778e0076-16e9-11f0-b6ba-569c3dd06744","branchId","a035fa80-010c-11f0-b330-569c3dd06744","createdAt",["D",1744385243725],"version",15,"orgId","62a75f8d-be32-4eaa-989a-23f3433a7d42","parentId","incomingCommitId","aiChatMessageId","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle","source","clientLabel","user",{"_44":79,"_52":53,"_11":12,"_80":81},"file",{"_73":74,"_13":75,"_76":77,"_78":24},"pull","merge","revert","multiple","commits",[72],{"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":-5,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":-5},"fileId","778c08fc-16e9-11f0-b6ba-569c3dd06744","test-suite.http.tsx","fileType","http","deleted","5e11e267-23cd-4ee4-86f4-3bf2a5ed69d7","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/fca87e60-4ad1-453c-af10-2782c6823400/square512?exp=1789556399&sig=91750b53ebb206e103877e2ab9f7d3cfe4951c4b4f61dcbbda6aa7f3a4e8a9c0","8f5d5e90-16e9-11f0-b87c-569c3dd06744",["D",1744385283672],16,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":74,"_13":75,"_76":77,"_78":24},[88],{"_44":82,"_46":47,"_48":83,"_50":84,"_52":53,"_54":45,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":85,"_64":86,"_66":-5,"_67":-5,"_68":-5},"9623c89a-16e9-11f0-8d72-569c3dd06744",["D",1744385295035],17,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":74,"_13":75,"_76":77,"_78":24},[95],{"_44":89,"_46":47,"_48":90,"_50":91,"_52":53,"_54":82,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":92,"_64":93,"_66":-5,"_67":-5,"_68":-5},"100ddf92-16ea-11f0-bd1a-569c3dd06744",["D",1744385499564],18,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":103,"_13":104,"_76":77,"_78":24},[102],{"_44":96,"_46":47,"_48":97,"_50":98,"_52":53,"_54":89,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":99,"_64":100,"_66":-5,"_67":-5,"_68":-5},"490d8054-010f-11f0-9bc3-569c3dd06744","http.tsx","174fbd98-16ea-11f0-b024-569c3dd06744",["D",1744385511743],19,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":103,"_13":104,"_76":77,"_78":24},[111],{"_44":105,"_46":47,"_48":106,"_50":107,"_52":53,"_54":96,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":108,"_64":109,"_66":-5,"_67":-5,"_68":-5},"2614fe88-16ea-11f0-b7b0-569c3dd06744",["D",1744385536527],20,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":103,"_13":104,"_76":77,"_78":24},[118],{"_44":112,"_46":47,"_48":113,"_50":114,"_52":53,"_54":105,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":115,"_64":116,"_66":-5,"_67":-5,"_68":-5},"3334bf18-16ea-11f0-adb1-569c3dd06744",["D",1744385558540],21,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":126,"_13":127,"_76":128,"_78":24},[125],{"_44":119,"_46":47,"_48":120,"_50":121,"_52":53,"_54":112,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":122,"_64":123,"_66":-5,"_67":-5,"_68":-5},"0212641c-010f-11f0-8d87-569c3dd06744","index.tsx","script","6b0f6172-16ea-11f0-9106-569c3dd06744",["D",1744385652254],22,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":126,"_13":127,"_76":128,"_78":24},[135],{"_44":129,"_46":47,"_48":130,"_50":131,"_52":53,"_54":119,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":132,"_64":133,"_66":-5,"_67":-5,"_68":-5},"74b9abe2-16ea-11f0-be8b-569c3dd06744",["D",1744385668474],23,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":126,"_13":127,"_76":128,"_78":24},[142],{"_44":136,"_46":47,"_48":137,"_50":138,"_52":53,"_54":129,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":139,"_64":140,"_66":-5,"_67":-5,"_68":-5},"77d049e4-16ea-11f0-9106-569c3dd06744",["D",1744385673654],24,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":126,"_13":127,"_76":128,"_78":24},[149],{"_44":143,"_46":47,"_48":144,"_50":145,"_52":53,"_54":136,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":146,"_64":147,"_66":-5,"_67":-5,"_68":-5},"d16e184a-1eb6-11f0-ab9b-569c3dd06744",["D",1745243099477],25,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":157,"_13":158,"_76":128,"_78":24},[156],{"_44":150,"_46":47,"_48":151,"_50":152,"_52":53,"_54":143,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":153,"_64":154,"_66":-5,"_67":-5,"_68":-5},"d16b93ea-1eb6-11f0-ab9b-569c3dd06744","caviar.tsx","d45409d4-1eb6-11f0-b848-569c3dd06744",["D",1745243104345],26,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":157,"_13":158,"_76":128,"_78":24},[165],{"_44":159,"_46":47,"_48":160,"_50":161,"_52":53,"_54":150,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":162,"_64":163,"_66":-5,"_67":-5,"_68":-5},"e2f3b7a0-1eb6-11f0-8367-569c3dd06744",["D",1745243128877],27,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":173,"_13":174,"_76":128,"_78":24},[172],{"_44":166,"_46":47,"_48":167,"_50":168,"_52":53,"_54":159,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":169,"_64":170,"_66":-5,"_67":-5,"_68":-5},"e2f184b2-1eb6-11f0-8367-569c3dd06744","caviar.test.tsx","e96cb924-1eb6-11f0-abe9-569c3dd06744",["D",1745243139733],28,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":173,"_13":174,"_76":128,"_78":24},[181],{"_44":175,"_46":47,"_48":176,"_50":177,"_52":53,"_54":166,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":178,"_64":179,"_66":-5,"_67":-5,"_68":-5},"f2ca2416-1eb6-11f0-b348-569c3dd06744",["D",1745243155443],29,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":173,"_13":174,"_76":128,"_78":24},[188],{"_44":182,"_46":47,"_48":183,"_50":184,"_52":53,"_54":175,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":185,"_64":186,"_66":-5,"_67":-5,"_68":-5},"5123abea-1eb7-11f0-b5ea-569c3dd06744",["D",1745243313736],30,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":126,"_13":196,"_76":128,"_78":24},[195],{"_44":189,"_46":47,"_48":190,"_50":191,"_52":53,"_54":182,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":192,"_64":193,"_66":-5,"_67":-5,"_68":-5},"main.tsx","68dd446c-1eb7-11f0-86b8-569c3dd06744",["D",1745243353520],31,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":103,"_13":104,"_76":77,"_78":24},[203],{"_44":197,"_46":47,"_48":198,"_50":199,"_52":53,"_54":189,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":200,"_64":201,"_66":-5,"_67":-5,"_68":-5},"717ddbd6-1eb7-11f0-be98-569c3dd06744",["D",1745243367966],32,{"_44":79,"_52":53,"_11":12,"_80":81},{"_73":74,"_13":75,"_76":77,"_78":24},[210],{"_44":204,"_46":47,"_48":205,"_50":206,"_52":53,"_54":197,"_55":-5,"_56":-5,"_57":-5,"_58":-5,"_59":-5,"_60":-5,"_61":-5,"_62":207,"_64":208,"_66":-5,"_67":-5,"_68":-5},"a0359c0c-010c-11f0-b330-569c3dd06744",["D",1741981418756],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Simple functional CSS library for Val Town","imageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/048e1418-7d13-40aa-b200-f7f583b16f00/square512?exp=1789556399&sig=a796f36d9142f7b1c6cdb7f826492fe3a701a7a0d1dfb6bcf40710c50351c354","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion",43,"likeCount",0,"tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_11":12,"_263":81},"org",{"_11":12,"_258":259,"_80":81,"_25":79,"_260":261,"_262":24},"branch",{"_50":249,"_13":16,"_44":47,"_250":211,"_251":-5,"_252":-5,"_253":-5,"_254":-5,"_255":-5,"_256":14,"_257":12},"isOwned",64,"projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","Brent Jackson","tier","pro","canRestrictVals","profileImageUrl","path","","adoptOrgId",{"_44":211,"_13":14,"_48":486,"_213":-5,"_214":24,"_215":216,"_217":216,"_218":219,"_220":221,"_25":79,"_222":103,"_223":224,"_225":224,"_226":227,"_228":229,"_52":53,"_230":-5,"_231":-5,"_232":-5,"_233":-5,"_234":235,"_236":235,"_237":238,"_239":238,"_240":238,"_241":235,"_242":235,"_62":487,"_244":488,"_246":489,"_248":24},"tree",[397,399,404,405,406,407,408,409,410,411,412,413,414],"files",[397,398,399,400,401,402,403,404,405,406,407,408,409,410,411,412,413,414],"counts",{"_387":229,"_388":20,"_389":229,"_390":391,"_392":393},"contents",[286,287,288,289,290,291,292,293,294,295,296,297,298],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":381,"_13":382,"_73":383,"_54":-5,"_46":47,"_300":384,"_301":224,"_48":385,"_50":229,"_76":379,"_304":-5,"_78":24,"_306":-5,"_264":386},{"_44":374,"_13":375,"_73":376,"_54":-5,"_46":47,"_300":377,"_301":224,"_48":378,"_50":229,"_76":379,"_304":-5,"_78":24,"_306":-5,"_264":380},{"_44":367,"_13":368,"_73":369,"_54":-5,"_46":47,"_300":370,"_301":224,"_48":371,"_50":337,"_76":64,"_304":372,"_78":24,"_306":-5,"_264":373},{"_44":361,"_13":362,"_73":363,"_54":-5,"_46":47,"_300":249,"_301":224,"_48":364,"_50":91,"_76":128,"_304":365,"_78":24,"_306":-5,"_264":366},{"_44":354,"_13":355,"_73":356,"_54":-5,"_46":47,"_300":357,"_301":224,"_48":358,"_50":229,"_76":128,"_304":359,"_78":24,"_306":-5,"_264":360},{"_44":348,"_13":349,"_73":350,"_54":-5,"_46":47,"_300":303,"_301":224,"_48":351,"_50":229,"_76":128,"_304":352,"_78":24,"_306":-5,"_264":353},{"_44":341,"_13":342,"_73":343,"_54":-5,"_46":47,"_300":344,"_301":224,"_48":345,"_50":229,"_76":128,"_304":346,"_78":24,"_306":-5,"_264":347},{"_44":334,"_13":335,"_73":336,"_54":-5,"_46":47,"_300":337,"_301":224,"_48":338,"_50":229,"_76":128,"_304":339,"_78":24,"_306":-5,"_264":340},{"_44":328,"_13":329,"_73":330,"_54":-5,"_46":47,"_300":318,"_301":224,"_48":331,"_50":229,"_76":128,"_304":332,"_78":24,"_306":-5,"_264":333},{"_44":321,"_13":322,"_73":323,"_54":-5,"_46":47,"_300":324,"_301":224,"_48":325,"_50":229,"_76":128,"_304":326,"_78":24,"_306":-5,"_264":327},{"_44":315,"_13":196,"_73":126,"_54":-5,"_46":47,"_300":316,"_301":224,"_48":317,"_50":318,"_76":128,"_304":319,"_78":24,"_306":-5,"_264":320},{"_44":308,"_13":309,"_73":310,"_54":-5,"_46":47,"_300":311,"_301":224,"_48":312,"_50":229,"_76":64,"_304":313,"_78":24,"_306":-5,"_264":314},{"_44":299,"_13":75,"_73":74,"_54":-5,"_46":47,"_300":227,"_301":224,"_48":302,"_50":303,"_76":77,"_304":305,"_78":24,"_306":-5,"_264":307},"6b9241f2-1eb8-11f0-b79a-569c3dd06744","branchVersion","latest",["D",1745243787592],7,"content","import { describe, it } from \"https://esm.town/v/jxnblk/test/http.tsx\";\nimport { assert, assertEquals, assertMatch } from \"jsr:@std/assert@1\";\n\nimport { css } from \"./main.tsx\";\n\nconst matches = (a, b) => assertMatch(a, new RegExp(b));\n\nexport default describe(\"tuna tests\", () => {\n const bodyStyles = css({\n body: {\n color: \"red\",\n fontFamily: \"sans-serif\",\n },\n });\n\n it(\"generates css\", () => {\n assertEquals(bodyStyles.css, \"body{color:red;font-family:sans-serif}\");\n });\n\n // TODO\n // it(\"generates a style tag\", () => {\n // assertEquals(bodyStyles.tag.dangerouslySetInnerHTML.__html, bodyStyles.css);\n // });\n\n // for debugging only\n // it(\"fails\", () => {\n // assertEquals(1, 2);\n // // throw new Error(\"Seeing if this throws\");\n // });\n\n const styles = css({\n button: {\n color: \"blue\",\n padding: \"8px\",\n },\n box: {\n color: \"blue\",\n padding: \"32px\",\n },\n });\n\n it(\"creates atomic classnames\", () => {\n matches(styles.css, \"x0\");\n matches(styles.css, \"x1\");\n matches(styles.css, \"x2\");\n });\n\n it(\"creates atomic declarations\", () => {\n matches(styles.css, \".x0{color:blue}\");\n matches(styles.css, \".x1{padding:8px}\");\n matches(styles.css, \".x2{padding:32px}\");\n });\n\n it(\"returns classnames for application\", () => {\n assertEquals(styles.button, \"x0 x1\");\n assertEquals(styles.box, \"x0 x2\");\n });\n\n // pseudoselectors\n const pseudos = css({\n box: {\n backgroundColor: \"tomato\",\n \"&:hover\": {\n backgroundColor: \"blue\",\n color: \"black\",\n },\n },\n // \"box:hover\": { }, // not supported\n });\n\n it(\"handles pseudoselectors\", () => {\n matches(pseudos.css, \".x3{background-color:tomato}\");\n matches(pseudos.css, \".x4:hover{background-color:blue}\");\n matches(pseudos.css, \".x5:hover{color:black}\");\n });\n\n // child selectors\n const children = css({\n title: {\n fontSize: \"32px\",\n \"& > span\": {\n fontSize: \"16px\",\n },\n },\n });\n\n it(\"handles child selectors\", () => {\n matches(children.css, \".x6{font-size:32px}\");\n matches(children.css, \".x7 > span{font-size:16px}\");\n });\n\n const attrs = css({\n input: {\n \"&[type=checkbox]\": {\n backgroundColor: \"tomato\",\n },\n },\n });\n\n it(\"handles attr selectors\", () => {\n assertEquals(attrs.css, \".x8[type=checkbox]{background-color:tomato}\");\n });\n\n const numbers = css({\n box: {\n fontSize: 12,\n padding: 7,\n },\n });\n\n it(\"converts numbers to px\", () => {\n matches(numbers.css, \".x9{font-size:12px}\");\n matches(numbers.css, \".xa{padding:7px}\");\n });\n\n const media = css({\n /* possible api??\n \"@media screen and (min-w-width: 768px)\": {\n box: {\n fontSize: 13,\n padding: 11,\n },\n },\n */\n box: {\n \"@media screen and (min-width: 768px)\": {\n fontSize: 13,\n padding: 11,\n \"&:hover\": {\n color: \"red\",\n textDecoration: \"underline\",\n },\n },\n },\n });\n\n it(\"handles media queries\", () => {\n assertEquals(media.box, \"xb xc xd xe\");\n assert(media.css.includes(\"@media screen and (min-width: 768px){.xb{font-size:13px}}\"));\n assert(media.css.includes(\"@media screen and (min-width: 768px){.xc{padding:11px}}\"));\n assert(\n media.css.includes(\n \"@media screen and (min-width: 768px){.xd:hover{color:red}.xe:hover{text-decoration:underline}}\",\n ),\n );\n });\n\n return (\"🐟 [tuna] ok\");\n});","label",[75],"02b004b0-010f-11f0-ae6f-569c3dd06744","notes.md","02b005aa-010f-11f0-ae6f-569c3dd06744",10,["D",1741982442967],"\n```tsx\n// API sketches\n\nimport Tuna from \"val:jxnblk/tuna\";\n\nconst tuna = new Tuna({\n});\n```\n",[309],"57d78640-1eb8-11f0-9477-569c3dd06744",41,["D",1745243754495],9,"import { kebabCase } from \"npm:change-case@5.4.4\";\nimport createRule from \"./create-rule.tsx\";\nimport createRawRule from \"./create-raw-rule.tsx\";\nimport cache from \"./cache.tsx\";\n\nconst reserved = [\"css\", \"tag\"];\n\nconst NESTED_RE = /&/;\ntype TagProps = {\n dangerouslySetInnerHTML: {\n __html: string;\n },\n};\n\nexport class TunaResult {\n [key: string]: string;\n css: string;\n tag: TagProps;\n \n constructor() {\n this.css = \"\";\n this.tag = { dangerouslySetInnerHTML: { __html: \"\" }};\n }\n}\n\ninterface TunaArguments {\n body?: object;\n [key: string]: object;\n}\n\nexport function css(obj: TunaArguments): TunaResult {\n const result = new TunaResult();\n const rules = [];\n for (const key in obj) {\n console.log(key);\n if (reserved.includes(key)) {\n const msg = `Cannot use key: '${key}'`;\n throw new Error(msg);\n }\n if (key === \"body\") {\n rules.push(createRawRule(\"body\", obj[key]));\n continue;\n }\n const val = obj[key];\n const { css, className } = createRule(val, key);\n result[key] = className;\n rules.push(css);\n }\n console.log(rules.length);\n result.css = rules.join(\"\");\n console.log(result.css);\n return result;\n}\n\nexport default css;",[196],"02cb6b9c-010f-11f0-b461-569c3dd06744","create-rule.tsx","02cb6c6e-010f-11f0-b461-569c3dd06744",11,["D",1741982443147],"import cache from \"./cache.tsx\";\nimport createNestedRule from \"./create-nested-rule.tsx\";\nimport createMediaRule from \"./create-media-rule.tsx\";\nimport createDeclaration from \"./create-declaration.tsx\";\n\nconst NESTED_RE = /&/;\nconst MEDIA_RE = /^@media/;\n\nexport default function createRule(obj, parentKey) {\n const rules = [];\n const classNames = [];\n\n for (const [key, val] of Object.entries(obj)) {\n const nested = NESTED_RE.test(key);\n const media = MEDIA_RE.test(key);\n // consider: typeof val === \"object\";\n if (nested) {\n // e.g. `&:hover`\n const { _rules, _classNames } = createNestedRule(key, val);\n rules.push(..._rules);\n classNames.push(..._classNames);\n continue;\n }\n if (media) {\n const { _rules, _classNames } = createMediaRule(key, val);\n rules.push(..._rules);\n classNames.push(..._classNames);\n continue;\n }\n const dec = createDeclaration(key, val);\n if (cache.has(dec)) {\n const cn = cache.get(dec);\n classNames.push(cn);\n } else {\n const cn = \"x\" + cache.size.toString(36);\n const rule = `.${cn}{${dec}}`;\n rules.push(rule);\n classNames.push(cn);\n cache.set(dec, cn);\n }\n }\n\n const css = rules.join(\"\");\n const className = classNames.join(\" \");\n return {\n css,\n className,\n };\n}\n",[322],"02a00cea-010f-11f0-8883-569c3dd06744","create-raw-rule.tsx","02a00f56-010f-11f0-8883-569c3dd06744",["D",1741982442863],"import createDeclaration from \"./create-declaration.tsx\";\n\nexport default function createRawRule(selector, obj) {\n const decs = [];\n for (const [key, val] of Object.entries(obj)) {\n const dec = createDeclaration(key, val);\n decs.push(dec);\n }\n return `${selector}{${decs.join(\";\")}}`;\n}\n",[329],"023e11a2-010f-11f0-a78b-569c3dd06744","create-nested-rule.tsx","023e126a-010f-11f0-a78b-569c3dd06744",4,["D",1741982442217],"import createDeclaration from \"./create-declaration.tsx\";\nimport cache from \"./cache.tsx\";\n\n// e.g. box { \"&:hover\": { color: \"red\" } }\n// \"&:hover\", { color: \"red\" }\nexport default function createNestedRule(selector, obj) {\n const _rules = [];\n const _classNames = [];\n\n for (const [key, val] of Object.entries(obj)) {\n if (typeof val === \"object\") {\n throw new Error(\"Nested selectors are only supported one level deep\");\n }\n const cn = \"x\" + cache.size.toString(36);\n const className = selector.replace(\"&\", cn);\n const rule = `.${className}{${createDeclaration(key, val)}}`;\n _rules.push(rule);\n _classNames.push(cn);\n cache.set(rule, className); // only used to increment cache size\n }\n\n return {\n _rules,\n _classNames,\n };\n}\n",[335],"0290c082-010f-11f0-ad83-569c3dd06744","create-media-rule.tsx","0290c168-010f-11f0-ad83-569c3dd06744",8,["D",1741982442763],"import createNestedRule from \"./create-nested-rule.tsx\";\nimport createDeclaration from \"./create-declaration.tsx\";\nimport cache from \"./cache.tsx\";\n\nconst NESTED_RE = /&/;\n\nexport default function createMediaRule(media, obj) {\n const _rules = [];\n const _classNames = [];\n\n for (const [key, val] of Object.entries(obj)) {\n const nested = NESTED_RE.test(key);\n if (nested) {\n const n = createNestedRule(key, val);\n const rule = `${media}{${n._rules.join(\"\")}}`;\n _rules.push(rule);\n _classNames.push(...n._classNames);\n continue;\n }\n const cn = \"x\" + cache.size.toString(36);\n const dec = createDeclaration(key, val);\n const rule = `${media}{.${cn}{${dec}}}`;\n _rules.push(rule);\n _classNames.push(cn);\n cache.set(rule, cn); // increment cache size\n }\n\n return {\n _rules,\n _classNames,\n };\n}\n",[342],"027efe1a-010f-11f0-ae6f-569c3dd06744","create-declaration.tsx","027efee2-010f-11f0-ae6f-569c3dd06744",["D",1741982442645],"import { kebabCase } from \"npm:change-case@5.4.4\";\nconst px = n => typeof n === \"number\" ? `${n}px` : n;\n\nexport default (key, val) => `${kebabCase(key, {})}:${px(val)}`;\n",[349],"0251d37c-010f-11f0-8d87-569c3dd06744","cache.tsx","0251d44e-010f-11f0-8d87-569c3dd06744",5,["D",1741982442349],"export const cache = new Map();\nexport default cache;\n",[355],"9fa3c164-4316-11f0-9930-76b3cceeab13","atomic.tsx","4f7fe024-430b-11f0-8c63-76b3cceeab13",["D",1749242489505],"/** alternative to main.tsx atomic, single element version */\nimport cache from \"./cache.tsx\";\nimport createNestedRule from \"./create-nested-rule.tsx\";\nimport createMediaRule from \"./create-media-rule.tsx\";\nimport createDeclaration from \"./create-declaration.tsx\";\nimport { TunaResult } from \"./main.tsx\";\n\nimport type { CSSProperties } from \"npm:react\";\n\nconst NESTED_RE = /&/;\nconst MEDIA_RE = /^@media/;\n\nfunction createRule(obj, parentKey) {\n const rules = [];\n const classNames = [];\n\n for (const [key, val] of Object.entries(obj)) {\n const nested = NESTED_RE.test(key);\n const media = MEDIA_RE.test(key);\n if (nested) { // e.g. `&:hover`\n const { _rules, _classNames } = createNestedRule(key, val);\n rules.push(..._rules);\n classNames.push(..._classNames);\n continue;\n }\n if (media) {\n const { _rules, _classNames } = createMediaRule(key, val);\n rules.push(..._rules);\n classNames.push(..._classNames);\n continue;\n }\n const dec = createDeclaration(key, val);\n /*\n if (cache.has(dec)) { // TODO: atomic version?\n const cn = cache.get(dec);\n classNames.push(cn);\n } else {}\n */\n const cn = \"x\" + cache.size.toString(36);\n const rule = `.${cn}{${dec}}`;\n rules.push(rule);\n classNames.push(cn);\n cache.set(rule, cn); // increment cache size\n // cache.set(dec, cn);\n }\n\n const css = rules.join(\"\");\n const className = classNames.join(\" \");\n return {\n css,\n className,\n };\n}\n\n\nexport function atomic(obj: CSSProperties): TunaResult {\n const result = new TunaResult();\n const rules = [];\n\n const key = \"className\";\n const { css, className } = createRule(obj, key);\n result[key] = className;\n rules.push(css);\n \n result.css = rules.join(\"\");\n return result;\n}\n\nexport default atomic;",[362],"992c7fd8-1eb8-11f0-9684-569c3dd06744","README.md","0267009e-010f-11f0-a44b-569c3dd06744",44,["D",1745243864102],"# tuna (WIP)\n\n**NOTE:** this was ported over from another val and may not be fully working\n\n🐟 Simple CSS library for Val Town\n\n\n[![][badge]][url]\n\n[badge]: https://testme.val.run?url=https://jxnblk--778c08fc16e911f0b6ba569c3dd06744.web.val.run\n[url]: ./test-suite.http.tsx\n\n\n```tsx\nimport { css } from \"https://esm.town/v/jxnblk/tuna/main.tsx\";\n\nconst styles = css({\n body: { // special keyword for element\n fontFamily: \"system-ui, sans-serif\",\n margin: 0,\n backgroundColor: \"#f5f5f5\",\n },\n container: {\n padding: 32, // numbers are converted to pixel units\n margin: \"0 auto\",\n maxWidth: 1024,\n },\n input: {\n fontFamily: \"inherit\",\n fontSize: \"inherit\",\n lineHeight: \"1.5\",\n padding: \"2px 8px\",\n border: \"1px solid #ccc\",\n borderRadius: \"4px\",\n },\n});\n```\n\n```tsx\n// JSX example\nconst html = render(\n

\n

History