2b:null 2c:["$","title",null,{"children":"pension calculator cashflows 💱 interaction | Declan Naughton | Observable"}] 31:T7b4,# pension calculator cashflows 💱 interaction Skip ↓ to interaction (disclaimers still apply) **This model is under construction 🚧** ⚠️ *The assumptions, methodology and limitations of a model should be carefully considered for any purpose you apply it to. I haven't even listed these here, nor otherwise documented the model fully/clearly.* **Proceed with caution** 🙏 ⚠️ *This is not a complete model/narrative and you should not rely on it.* ⚠️ *These are draft numbers and visualizations and you should not rely on them.* ⚠️ *Not recommended to enter real personal or sensitive details. **Contact me with real-world calculation or model requirements instead.*** 🗣✅ This is not financial advice. --- There are some Irish tax rules being used, but I'm more focused on **interaction approach** (which generalizes for lots of number situations) than on anything real-life. I chose to allow for **tax relief** by removing it from `empee_contribution_cost` and showing it separately in `empee_contribution_tax_relief`: both included in visual; this allows to consider the value of tax relief in the context of fund development. Tax relief is clearly an estimate with it's own undocumented assumptions (technical point: in the calculang model, note ♻️ of income-tax model used to estimate tax relief) Salary growth (or negative-growth) is related to the 'starting salary reference age', to facilitate comparisons across different pension saving starting ages for the same salary profile. Growth and management charges **continue in post-retirement**. While some of these are visualized, they are not included in the retirement values given. There will be more practical post-retirement references later. *There are some things I [previously wrote/referenced about](https://observablehq.com/@declann/tax-calculator-impacts-interaction-ireland?collection=@declann/calculang#link) Re interaction and context.*32:T9e6,viewof form = { let form = Inputs.form( { age_0_in: Inputs.range([18, 65], { label: "starting age", value: 50, step: 1 }), fund_value_0_in: Inputs.range([0, 1000000], { label: "starting fund value", value: 0, step: 1000 }), unit_growth_rate_in: Inputs.range( [ -0.02 * 0 /*banned (along with neg charges) for technical reasons with the visual !!*/, 0.1 ], { label: "investment growth rate", value: 0.05, step: 0.002 } ), retirement_age_in: Inputs.range([50, 75], { label: "retirement age", value: 65, step: 1 }), missed_contribution_age_in: Inputs.range([15, 75], { label: "Missed contribution (scenario)", value: 15, step: 1 }), salary_0_in: Inputs.range([5000, 300000], { label: "salary", value: 50000, step: 1000 }), salary_age_0_in: Inputs.range([18, 65], { label: "salary ref. age", value: 50, step: 1 }), salary_inflation_rate_in: Inputs.range([-0.02, 0.1], { label: "salary growth rate", value: 0.02, step: 0.002 }), empee_contribution_rate_in: Inputs.range([0.0, 0.3], { label: "empee contribution as % of salary", value: 0.1, step: 0.01 }), emper_matching_rate_in: Inputs.range([0.0, 2], { label: "emper matching rate", value: 1, step: 0.02 }), contribution_charge_rate_in: Inputs.range([-0.02 * 0, 0.1], { label: "contribution charge rate", value: 0.04, step: 0.01 }), management_charge_rate_in: Inputs.range([-0.02 * 0, 0.1], { label: "management charge rate", value: 0.01, step: 0.002 }) }, { template } ); let state = false; form.oninput = (d) => { console.log("oninput", d); if (state == false) { mutable inputs_history = [...mutable inputs_history, form.value]; state = true; mutable statey = true; mutable changing = d.srcElement.parentElement.previousElementSibling.textContent; } mutable inputs_history = [ ...mutable inputs_history.slice(0, -1), form.value ]; }; form.onchange = () => { console.log("onchange"); state = false; mutable statey = false; mutable inputs_history[mutable inputs_history.length - 1] = form.value; }; return form; }33:T24c3,// check_cfs_vs_fund_value is weakened as a check embed({ "$schema": "https://vega.github.io/schema/vega/v5.json", "background": "white", "padding": 5, "width": 400, //"height": 500, "style": "cell", signals: [ {"name": "offset", "value": 80}, {"name": "cellHeight", "value": 150}, {"name": "height", "update": "2 * (offset + cellHeight)"} ], "data": [ { "name": "data", "values": data_all2, "transform": [ { type: 'formula', //expr: 'datum.value >=0', This is bloody hard to debug and do correctly, and must be correct for posneg swaps etc. So just banning negative charges for now and will fix this later! expr: 'indexof(["management_charge","contribution_charge"],datum.formula) == -1', as: 'posneg' }, { type: 'formula', expr: 'abs(datum.value)', as: 'value' }, { "type": "stack", "groupby": ["age_in"], "field": "value", "sort": {"field": ["formula", "input_cursor_id"], "order": ["ascending","descending"]}, "as": ["value1_start", "value1_end"], "offset": "zero" }, ] }, { name: 'data_old', source: 'data', "transform": [ { type: 'filter', expr: `datum.input_cursor_id == ${input_cursor_id-1}`, // eliminates chk }, { "type": "stack", "groupby": ["age_in"], "field": "value", "sort": {"field": ["formula", "input_cursor_id"], "order": ["ascending","descending"]}, "as": ["value1_start", "value1_end"], "offset": "zero" }, ]} ], scales: [ { "name": "gscale", "type": "band", "range": [0, {"signal": "height"}], "round": true, "domain": { "data": "data", "field": "posneg", /*"sort": { "field": "posneg", "op": "median", "order": "descending" }*/ } }, { "name": "y_shared", "type": "linear", domainMin: '0',// domainMax: '60000', // doesn't generalise "domain": {"data": statey?"data_old" : 'data', "fields": ["value1_start", "value1_end"]}, // give this a cushion ?? "range": [{"signal": "cellHeight"}, 0], "nice": false, "zero": true, }, { "name": "y_bad", // how to share y scale on the stack total ?! "type": "linear", domainMin: '0', domainMax: {signal: "domain('yyy')[1]*2"}, // doesn't generalise. Can I not x2 or update when dragging? "domain": {"data": "data", "fields": ["value1_start", "value1_end"]}, // give this a cushion ?? "range": [{"signal": "cellHeight"}, 0], "nice": false, "zero": true, }, { "name": "color", "type": "ordinal", "domain": {"data": "data", "field": "formula", "sort": ["empee_contribution_cost","check_cfs_vs_fund_value"]}, "range": "category" }, ], "marks": [ { type: 'group', name: 'posneg', from: { facet: { data: 'data', name: 'posnegs', groupby: 'posneg' } }, data: [{name: 'data_windowed', source:'posnegs', transform: [ { "type": "window", "params": [null], "as": ["B_value"], "ops": ["lag"], "fields": ["value"], "sort": { "field": ["input_cursor_id"], "order": ["descending"] }, "groupby": ["formula", "age_in"], "frame": [-1, 0] }, { "type": "formula", "expr": "datum.value-datum.B_value", "as": "impact" }, {"type": "formula", "expr": `datum.value > datum.B_value ? 0 : datum.B_value - datum.value`, "as": "adj"}, // I need to record the adj in id-1 for use in calc for id w. a follow-up window fn ! {"type": "formula", "expr": `datum.input_cursor_id == ${input_cursor_id-1} ? datum.value > datum.B_value ? datum.value - datum.B_value : datum.B_value - datum.value : datum.value`, "as": "BplusAminusB"}, // I need to record the adj in id-1 for use in calc for id w. a follow-up window fn ! {"type": "formula", "expr": `datum.adj`, "as": "adjposneg"}, { "type": "window", "params": [null], "as": ["B_adj"], "ops": ["lag"], "fields": ["adj"], "sort": { "field": ["input_cursor_id"], "order": ["ascending"] }, "groupby": ["formula", "age_in"], "frame": [-1, 0] }, { "type": "formula", "expr": "datum.BplusAminusB-datum.B_adj", "as": "BplusAminusB" }, {"type": "filter", "expr": "abs(datum.BplusAminusB)>=0.01"}, ]}, { "name": "data_0", "source": "data_windowed", "transform": [ { "type": "stack", "groupby": ["age_in"], "field": "BplusAminusB", "sort": {"field": ["formula", "input_cursor_id"], "order": ["ascending","descending"]}, "as": ["value_start", "value_end"], "offset": "zero" }, { type: 'formula', 'expr': 'abs(datum.value_end)', as: 'abs_value_end'}, { type: 'formula', 'expr': 'abs(datum.value_start)', as: 'abs_value_start'}, /*{ "type": "filter", "expr": "isValid(datum[\"age_in\"]) && isFinite(+datum[\"age_in\"]) && isValid(datum[\"value\"]) && isFinite(+datum[\"value\"])" }*/ ] }], "encode": { "enter": { "y": {"scale": "gscale", "field": "posneg", "offset": {"signal": "offset"}}, "height": {"signal": "cellHeight"}, "width": {"signal": "width"}, "stroke": {"value": "#ccc"} } }, marks: [ { "name": "marks", "type": "rect", "style": ["bar"], "from": {"data": "data_0"}, "encode": { "update": { "stroke": { "signal": `datum.posneg ? (datum.impact > 0 ? 'red' : 'green') : (datum.impact > 0 ? 'green' : 'red')`}, //"stroke": { "signal": `datum.posneg ? (datum.input_cursor_id == ${input_cursor_id} ? 100 : -100) : (datum.input_cursor_id == ${input_cursor_id} ? -100 : 100)`}, "strokeOpacity": {"value": 1}, "tooltip": { "signal": "'hello ' +datum['input_cursor_id']" }, "fill": {"scale": "color", "field": "formula"}, "opacity": {"scale": "opacity", "field": "input_cursor_id"}, "strokeWidth": {"scale": "strokeWidth", "field": "input_cursor_id"}, "ariaRoleDescription": {"value": "bar"}, "description": { "signal": "\"age_in: \" + (format(datum[\"age_in\"], \"\")) + \"; value: \" + (format(datum[\"value\"], \"\")) + \"; formula: \" + (isValid(datum[\"formula\"]) ? datum[\"formula\"] : \"\"+datum[\"formula\"])" }, "x": {"scale": "x", "field": "age_in"}, "width": {"signal": "max(0.25, bandwidth('x'))"}, "y": {"scale": y, "field": "abs_value_end"}, "y2": {"scale": y, "field": "abs_value_start"} } } } ], "scales": [ { "name": "y", "type": "linear", domainMin: '0',// domainMax: '60000', // doesn't generalise "domain": {"data": 'data_0', "fields": ["abs_value_start", "abs_value_end"]}, // give this a cushion ?? "range": [{"signal": "cellHeight"}, 0], "nice": false, "zero": true, }, { "name": "x", "type": "band", "domain": {"data": "data_0", "field": "age_in", "sort": true}, "range": [0, {"signal": "width"}], "paddingInner": 0.2, "paddingOuter": 0.1 }, { name: 'opacity', type: 'ordinal', "domain": [input_cursor_id-1 , input_cursor_id] , range: [1,statey ? 0.3 : 1]}, { name: 'strokeWidth', type: 'ordinal', "domain": [input_cursor_id, input_cursor_id-1] , range: [0,2]}, { "name": "threshold", "type": "threshold", "domain": [-99999999, 1], "range": ["green", "red", "green"] } ], "axes": [ { "scale": "x", "orient": "bottom", "grid": false, //"title": "age_in", "labelAlign": "center", "labelAngle": 0, "labelBaseline": "top", "zindex": 0 }, { "scale": y, "orient": "left", "grid": true, gridOpacity: 0.2, "title": `${statey ? 'Δ ' : ''}fund value`, "labelOverlap": true, "tickCount": 5, "zindex": 0 } ], }, { "type": "text", "from": {"data": "posneg"}, "encode": { "enter": { "x": {"field": "width", "mult": 0.5}, "y": {"field": "y", offset:-25}, "fontSize": {"value": 31}, opacity: {value: 0.7}, //"fontWeight": {"value": "bold"}, "text": {"signal": "datum.datum.posneg ? 'Inflows 💰' : 'Outflows 💸' "}, "align": {"value": "center"}, "baseline": {"value": "top"}, "fill": {"value": "#000"} } } }], "legends": [{"fill": "color", "symbolType": "square", "title": "formula"}], "config": { "legend": {"orient": "right", "layout": {"right": {"anchor": "middle"}}} } })34:[] 2f:{"id":"c2c60e19b3ecd3bb","slug":"pension-calculator-cashflows-interaction","title":"pension calculator cashflows 💱 interaction","thumbnail":"54d4f963348305f0d0e2429f10a07b2a8c39430815d90c97f7159cf8c0cbfd16","access_level":"public","create_time":"$D2023-12-18T19:53:12.355Z","update_time":"$D2024-12-03T12:53:08.825Z","view_time":null,"first_public_time":"$D2023-12-18T23:04:23.426Z","fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"fa28dcfb9c2f53ce","login":"declann","name":"Declan Naughton","avatar_url":"https://avatars-next.observableusercontent.com/b36edfd0f90184ac4c0a8d8726969fe861a1d1fe9417e998413c8a47e6163983","tier":"starter_2024"},"version":867,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"fca367047a53a31f","login":"declann","name":"Declan Naughton","avatar_url":"https://avatars-next.observableusercontent.com/b36edfd0f90184ac4c0a8d8726969fe861a1d1fe9417e998413c8a47e6163983","tier":null}],"members":[{"type":"individual","id":"fca367047a53a31f","login":"declann","name":"Declan Naughton","avatar_url":"https://avatars-next.observableusercontent.com/b36edfd0f90184ac4c0a8d8726969fe861a1d1fe9417e998413c8a47e6163983","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":0,"collection":{"id":"ba17c9710e3d4563","slug":"calculang","title":"calculang","owner":{"id":"fa28dcfb9c2f53ce","login":"declann","name":"Declan Naughton"}},"type":"notebook","body":{"title":"pension calculator cashflows 💱 interaction","cells":[{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":458,"value":"---\n\n*The model is made with [calculang](https://github.com/calculang/calculang), a language for calculations for transparency and certainty about numbers* 🔍💬🧮\n\n**To 🔍 calculang formulae, look on the [calculang website](https://calculang.dev/examples-viewer?id=pension-calculator).** Alternatively look in your browser developer tools!\n\n---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":616,"value":"link = \n\nmd`## interaction 🪄\n\nTo interact with pension calculator numbers ***with context*** then just drag and hold things about! (there are so many things that this might not look good on mobile, also, make sure to capture what is happening under outflows. There is an option to untie the scales => zoom into outflows; that is useful but makes mental offsets against inflow impacts by area especially difficult. I will add additional summary tables soon).\n\n*I think there are open edge case issues e.g. especially when cashflows flip sides (negative charges for example), and changing the age domain.* ⌛`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":576,"value":"link2 = md`### *inputs* ⚙️`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":578,"value":"*empee = employ**ee**; emper = employ**er***","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":9,"value":"$32","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":524,"value":"md`**retirement fund projection = €${f(new_value)}** **${statey ? (good_guy ? '↑' : '↓')+f(Math.abs(new_value - old_value)) : ' '}**`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":585,"value":"*The retirement fund projection is the **pre-retirement area under inflows less the pre-retirement area under outflows** below.*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":553,"value":"{\n if (!statey) return md`.................................................................................................................................................................... ....................................................................................................................................................................`;\n else return md`impact €**${statey ? (good_guy ? '↑' : '↓')+f(Math.abs(new_value - old_value)) : ' '}** due to **Δ ${changing}** (${f(old_in)} -> ${f(new_in)}) is visualised as **green boxes - red boxes** (inflows and outflows). 📦📦`\n\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":52,"value":"$33","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":393,"value":"viewof shared_y_scale = Inputs.toggle({label: 'shared y scale?', value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":598,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":433,"value":"*history of values:*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":20,"value":"embed(\n calcuvizspec({\n models: [model],\n input_cursors: inputs_history.slice(1).map(d => ({...d, age_in:d.retirement_age_in /* TODO hacky? */})),\n mark: {type: 'text', size: 20, fontWeight:'bold'},\n encodings: {\n y: {name: 'formula', type:'nominal', domain: ['retirement_fund_value', 'accumulated_empee_contributions', 'accumulated_empee_contribution_tax_relief', 'salaries_per_retirement_fund']},\n x: {name: 'input_cursor_id', type: 'nominal', sort: 'descending'},\n color: {name: 'input_cursor_id', type: 'nominal', domain: _.range(0,5,1) /* TODO ignored? */, legend:false},\n text: {name: 'value', type: 'quantitative', format:',.2f'},\n },\n width: 800, height:100\n}), {renderer: 'svg'})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":449,"value":"## appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":632,"value":"tags_broken = inputs_history.slice(1).map((d,i) => ({i:i+1, tag:Object.entries(d).filter(([k,v]) => v != inputs_history[i-1+1][k])[0]}))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":775,"value":"old_in = inputs_history[inputs_history.length-2][changing_i_in]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":779,"value":"new_in = inputs_history[inputs_history.length-1][changing_i_in]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":672,"value":"mutable changing = ''","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":750,"value":"changing_i = Array.from(viewof form.children.item(0).children).map((d,i) => ({d, i})).find(e => e.d.textContent.includes(changing)).i","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":766,"value":"changing_i_in = Object.entries(viewof form.value)[changing_i][0]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":453,"value":"formulae we are graphing","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":37,"value":"formulae = ['empee_contribution_tax_relief', 'empee_contribution_cost', 'emper_contribution', 'fund_growth', 'contribution_charge', 'management_charge']","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":518,"value":"calculang model load happens here ⬇️:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":3,"value":"model = require(`https://calculang.dev/models/taxes-pensions/pension-calculator.js?${refresh}${Date.now()}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":397,"value":"y = shared_y_scale ? 'y_shared' : 'y'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7,"value":"import { calcudata, calcuvizspec } from '@declann/little-calculang-helpers'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":23,"value":"embed = require('vega-embed');","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":529,"value":"f = d3.format(',.2f')","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":185,"value":"mutable statey = false;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":11,"value":"mutable inputs_history = [JSON.parse(`{\"age_0_in\":50,\"fund_value_0_in\":0,\"unit_growth_rate_in\":0.05,\"retirement_age_in\":65,\"salary_0_in\":50000,\"salary_inflation_rate_in\":0.02,\"empee_contribution_rate_in\":0.1,\"emper_matching_rate_in\":1,\"contribution_charge_rate_in\":0.04,\"management_charge_rate_in\":0.01,\"salary_age_0_in\":50,\"missed_contribution_age_in\":15}`\n),JSON.parse(`{\"age_0_in\":50,\"fund_value_0_in\":0,\"unit_growth_rate_in\":0.05,\"retirement_age_in\":65,\"salary_0_in\":50000,\"salary_inflation_rate_in\":0.02,\"empee_contribution_rate_in\":0.1,\"emper_matching_rate_in\":1,\"contribution_charge_rate_in\":0.04,\"management_charge_rate_in\":0.01,\"salary_age_0_in\":50,\"missed_contribution_age_in\":15}`\n)]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":106,"value":"input_cursor_id = inputs_history.length-1","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":370,"value":"addl_years = 2 // 2","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":40,"value":"data_all2 = calcudata({\n models: [model],\n input_domains: {age_in:_.range(Math.min(inputs_history[input_cursor_id].age_0_in,inputs_history[input_cursor_id-1].age_0_in)-1,Math.max(inputs_history[input_cursor_id].retirement_age_in,inputs_history[input_cursor_id-1].retirement_age_in)+addl_years,1)},\n input_cursors: inputs_history.map(d => ({...d, /*age_in:d.retirement_age_in*/ /* TODO hacky? */})),\n outputs: [...formulae, 'check_cfs_vs_fund_value'],\n pivot: false\n})//.map(d => d.formula == 'fund_charges' ? ({...d, value:-d.value}) : d) // TEMP9\n.filter(d => d.input_cursor_id == input_cursor_id || (d.input_cursor_id == input_cursor_id-1 && statey))","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":5,"value":"viewof refresh = Inputs.button(\"refresh calculang model\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":61,"value":"todo tie to latest inputs_history values","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":490,"value":"new_value = model.retirement_fund_value(inputs_history[inputs_history.length-1])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":494,"value":"old_value = model.retirement_fund_value(inputs_history[inputs_history.length-2])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":543,"value":"good_guy = new_value - old_value > 0","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":835,"value":"\n// https://observablehq.com/@martien/horizontal-inputs\ntemplate = (inputs) => \nhtl.html`

${Object.values(inputs)}

\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":520,"value":"## credits\n\nmade with 💖 and [calculang](https://draft.calculang.dev)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 30:"$2f:body"