1"use strict" 2define("ember-handbook/app",["exports","@ember/application","ember-load-initializers","ember-handbook/config/environment","ember-handbook/resolver"],(function(e,t,n,o,l){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 3const r=t.default.extend({modulePrefix:o.default.modulePrefix,podModulePrefix:o.default.podModulePrefix,Resolver:l.default});(0,n.default)(r,o.default.modulePrefix) 4var a=r 5e.default=a})),define("ember-handbook/application/route",["exports","@ember/routing/route","@ember/service"],(function(e,t,n){var o,l,r 6function a(e,t,n,o){n&&Object.defineProperty(e,t,{enumerable:n.enumerable,configurable:n.configurable,writable:n.writable,value:n.initializer?n.initializer.call(o):void 0})}function i(e,t,n,o,l){var r={} 7return Object.keys(o).forEach((function(e){r[e]=o[e]})),r.enumerable=!!r.enumerable,r.configurable=!!r.configurable,("value"in r||r.initializer)&&(r.writable=!0),r=n.slice().reverse().reduce((function(n,o){return o(e,t,n)||n}),r),l&&void 0!==r.initializer&&(r.value=r.initializer?r.initializer.call(l):void 0,r.initializer=void 0),void 0===r.initializer&&(Object.defineProperty(e,t,r),r=null),r}Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 8let s=(o=class extends t.default{constructor(){super(...arguments),a(this,"intl",l,this),a(this,"router",r,this)}beforeModel(){this.intl.setLocale("en"),this.router.on("routeDidChange",(()=>{window.scrollTo&&window.scrollTo({top:0,left:0,behavior:"auto"})}))}},l=i(o.prototype,"intl",[n.inject],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),r=i(o.prototype,"router",[n.inject],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),o) 9e.default=s})),define("ember-handbook/application/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 10e.default={header:"_header_17qc65",brand:"_brand_17qc65",active:"_active_17qc65",icon:"_icon_17qc65",line:"_line_17qc65",main:"_main_17qc65"}})),define("ember-handbook/application/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 11var n=(0,t.createTemplateFactory)({id:"u9nbSXOY",block:'[[[10,"header"],[15,0,[29,[[28,[37,0],["header"],[["from"],["ember-handbook/application/styles"]]]]]],[12],[1,"\\n "],[8,[39,1],[[16,0,[29,[[28,[37,0],["brand"],[["from"],["ember-handbook/application/styles"]]]]]]],[["@route"],["application"]],[["default"],[[[[1,"Ember Handbook"]],[]]]]],[1,"\\n\\n"],[44,[[28,[37,3],null,null]],[[[1," "],[10,"input"],[15,1,[30,1]],[14,0,"visually-hidden"],[14,"data-toggle",""],[14,4,"checkbox"],[12],[13],[1,"\\n "],[10,"label"],[15,0,[29,[[28,[37,0],["icon"],[["from"],["ember-handbook/application/styles"]]]]]],[15,"for",[30,1]],[12],[1,"\\n "],[10,1],[15,0,[29,[[28,[37,0],["line"],[["from"],["ember-handbook/application/styles"]]]]]],[12],[13],[1,"\\n "],[10,1],[15,0,[29,[[28,[37,0],["line"],[["from"],["ember-handbook/application/styles"]]]]]],[12],[13],[1,"\\n "],[10,1],[15,0,[29,[[28,[37,0],["line"],[["from"],["ember-handbook/application/styles"]]]]]],[12],[13],[1,"\\n "],[13],[1,"\\n"]],[1]]],[1,"\\n "],[10,"nav"],[12],[1,"\\n"],[44,[[28,[37,4],["component-architecture"],null]],[[[1," "],[11,3],[16,0,[29,[[28,[37,0],[[52,[30,2,["isActive"]],"active"]],[["from"],["ember-handbook/application/styles"]]]]]],[16,6,[30,2,["url"]]],[4,[38,6],["click",[30,2,["transitionTo"]]],null],[12],[1,"\\n Component Architecture\\n "],[13],[1,"\\n"]],[2]]],[1," "],[13],[1,"\\n"],[13],[1,"\\n\\n"],[10,0],[15,0,[29,[[28,[37,0],["main"],[["from"],["ember-handbook/application/styles"]]]]]],[12],[1,"\\n "],[46,[28,[37,8],null,null],null,null,null],[1,"\\n"],[13]],["menuId","link"],false,["local-class","link-to","let","unique-id","link","if","on","component","-outlet"]]',moduleName:"ember-handbook/application/template.hbs",isStrictMode:!1}) 12e.default=n})),define("ember-handbook/component-architecture/best-practices/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 13var n=(0,t.createTemplateFactory)({id:"LS5QuL/g",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7
13B%22title%22%3A%22Best%20Practices%22%7D","%5B%7B%22content%22%3A%22Classification%20as%20a%20Starter%22%2C%22slug%22%3A%22classification-as-a-starter%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Construction%20Components%22%2C%22slug%22%3A%22construction-components%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Separate%20Business%20Logic%20from%20UI%20Components%22%2C%22slug%22%3A%22separate-business-logic-from-ui-components%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"Best practices for developing components."],[13],[1,"\\n"],[10,"h2"],[14,1,"classification-as-a-starter"],[12],[1,"Classification as a Starter"],[13],[1,"\\n"],[10,2],[12],[1,"Having proper guidelines where to put your components will have the most impact\\non your team. It will"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"eliminate avoidable discussions amongst peers"],[13],[1,"\\n"],[10,"li"],[12],[1,"eliminate re-occuring decision findings, as already provided by guides"],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"in order to ramp up, here is a three-step guide to reach for your "],[8,[39,1],null,[["@route"],["component-architecture.classification"]],[["default"],[[[[1,"classification"]],[]]]]],[1,":"],[13],[1,"\\n"],[10,"ol"],[12],[1,"\\n"],[10,"li"],[12],[1,"Make map(s) of your components, draw the landscape of your system"],[13],[1,"\\n"],[10,"li"],[12],[1,"Draw areas to visualize boundaries"],[13],[1,"\\n"],[10,"li"],[12],[1,"Derieve guides from those areas"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"construction-components"],[12],[1,"Construction Components"],[13],[1,"\\n"],[10,2],[12],[1,"Start with construction components."],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Base/Blueprint Components"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Base components provide initial structure and/or the rough shape of a\\n(mostly) presentational component. The finishing touch is left out\\nintentionally and those base components serve as blueprint."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Builder Components"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Make "],[10,3],[14,6,"./patterns/builder"],[12],[1,"builder components"],[13],[1," which yield you with\\npieces to compose the concrete components."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"Use the "],[10,3],[14,6,"./patterns/decorator"],[12],[1,"decorator"],[13],[1," pattern to put the outfit on your\\nimplementation or extend the existing functionality."],[13],[1,"\\n"],[10,"h2"],[14,1,"separate-business-logic-from-ui-components"],[12],[1,"Separate Business Logic from UI Components"],[13],[1,"\\n"],[10,2],[12],[1,"Often, business logic and UI components are tightly coupled. Moving your\\nbusiness logic from components to "],[10,3],[14,6,"./patterns/command"],[12],[1,"commands"],[13],[1,", you can re-use\\nthose functionality from multiple places and your component glues UI and\\nbusiness logic together."],[13],[1,"\\n"],[10,2],[12],[1,"By separating them using the "],[10,3],[14,6,"./patterns/strategy"],[12],[1,"strategy"],[13],[1," both can be\\ndeveloped in a decoupled way and adhering to the "],[10,3],[14,6,"https://en.wikipedia.org/wiki/Single_responsibility_principle"],[12],[1,"single responsibility\\nprinciple"],[13],[1,"."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article","link-to"]]',moduleName:"ember-handbook/component-architecture/best-practices/template.hbs",isStrictMode:!1}) 14e.default=n})),define("ember-handbook/component-architecture/classification/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 15var n=(0,t.createTemplateFactory)({id:"Se7yJHps",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Classification%22%7D","%5B%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Orientation%22%2C%22slug%22%3A%22orientation%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%3A%20Hokulea%22%2C%22slug%22%3A%22example-hokulea%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A3%2C%22seen%22%3A0%7D%5D"]
15],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[10,"strong"],[12],[1,"Classification"],[13],[1," gives components a "],[10,"em"],[12],[1,"home"],[13],[1," and can be accompanied by naming\\nconventions and/or guides."],[13],[1,"\\n"],[10,"h2"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Create a map of "],[10,"strong"],[12],[1,"your"],[13],[1," system, it has to fit your architecture"],[13],[1,"\\n"],[10,"li"],[12],[1,"Draw zones to make boundaries and name the areas, to make those boundaries visible"],[13],[1,"\\n"],[10,"li"],[12],[1,"Set rules/guidelines for each area"],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"Those areas with rules/guidelines will form the component classification of your\\nsystem. It will be individual to your system and it even can vary for multiple\\nproducts from one company."],[13],[1,"\\n"],[10,2],[12],[1,"What youâll find here is the methodology of atomic design and how this might be\\nan "],[10,"em"],[12],[1,"orientation"],[13],[1," around which you can create your own classification and second\\nstep is how that is put into practice at the example of "],[10,3],[14,6,"https://hokulea.netlify.app/"],[14,"target","_blank"],[12],[1,"Hokulea"],[13],[1," design system."],[13],[1,"\\n"],[10,"h2"],[14,1,"orientation"],[12],[1,"Orientation"],[13],[1,"\\n"],[10,2],[12],[1,"Atomic design is the first orientation, where components are ordered from small\\n(atoms) to big (pages) and also stating that the next level is made up of\\ncomponents from the lower (see Figure 1)."],[13],[1,"\\n"],[10,"figure"],[12],[1,"\\n "],[10,"img"],[14,"alt","Atomic design with atoms, molecules, organisms, templates and pages"],[14,"src","/atomic-design-f73282797c10d63f3998dfff6890fddf.png"],[14,5,"width: 75%;"],[12],[13],[1,"\\n "],[10,"figcaption"],[12],[1,"Atomic design (Frost, 2013)."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"The second orientation is the layers at which components can be put in (see\\nFigure 2). From many used components in the lower layer (design system\\ncomponents) to recipes (domain components outside the design sytem) to\\nsnowflakes (one-offs needed to build a product)."],[13],[1,"\\n"],[10,"figure"],[12],[1,"\\n "],[10,"img"],[14,"alt","Layered system in form of a pyramid: design system components as base,\\n recipes in the middle and snowflakes (one-offs) on the top"],[14,"src","/component-pyramid-8f57578c027126b66b302dde05dc1993.png"],[14,5,"width: 50%;"],[12],[13],[1,"\\n "],[10,"figcaption"],[12],[1,"Design system components, recipes, and snowflakes (Frost, 2021)."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"Now, I combined the two together to actually have two axis to form a grid to\\nand place components on it (see Figure 3)."],[13],[1,"\\n"],[10,"figure"],[12],[1,"\\n "],[10,"img"],[14,"alt","Layered system x atomic design to form a grid"],[14,"src","/classification-grid-02d425fee719254066dece453e7de0fa.png"],[14,5,"width: 75%;"],[12],[13],[1,"\\n "],[10,"figcaption"],[12],[1,"Layered system x atomic design to form a grid."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"With that grid, it is now possible to mark those cells, in which the majority of\\ncomponents are living (see Figure 4)."],[13],[1,"\\n"],[10,"figure"],[12],[1,"\\n "],[10,"img"],[14,"alt","Marked cells in from the grid above"],[14,"src","/classification-c4cf707d2e87b25febbf3fb8e962f84a.png"],[14,5,"width: 75%;"],[12],[13],[1,"\\n "],[10,"figcaption"],[12],[1,"Marked cells in from the grid above."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"In the last step, it is now possible to "],[10,"strong"],[12],[1,"draw zones"],[13],[1," around our markers,\\n"],[10,"strong"],[12],[1,"name these areas"],[13],[1," and "],[10,"strong"],[12],[1,"provide rules or guidelines"],[13],[1," that components of that\\narea shall comply with."],[13],[1,"\\n"],[10,"h2"],[14,1,"example%3A-hokulea"],[12],[1,"Example: Hokulea"],[13],[1,"\\n"],[10,2],[12],[1,"A concrete example where that happened and how that can look like, is the\\n"],[10,3],[14,6,"https://hokulea.netlify.app/"],[14,"target","_blank"],[12],[1,"Hokulea"],[13],[1," design system\\n(a research project by the author of this)."],[13],[1,"\\n"],[10,2],[12],[1,"First step to draw a grid on where components are aligned on a design system.\\nBased on atomic design, the design system components are only atoms and\\nmolecules. Everything bigger than that goes into product level, which isnât that\\nmuch relevant for a design system. Next was to layer those components. Some\\ninternal layer, building blocks and the user-facing layer. From the Figma file\\nbelow, the middle column is the most interesting one, as this is where component\\nclasses are identified."],[13],[1,"\\n"],[10,"iframe"],[14,5,"width: 100%; min-height: 400px; resize: both;"],[14,"src","https://www.figma.com/embed?embed_host=share&url=https://www.figma.com/file/sWEslYwEe6y87vkVn5DtKm/Classification-Sheet?node-id=1%3A2"],[14,"allowfullscreen",""],[12],[13],[1,"\\n"],[10,2],[12],[1,"It wasnât yet not enough to understand what these components are (not) allowed\\nto do. It wasnât enough to draw rules or guidelines from that. This is where the\\nsecond step for an in-depth investigation of the beforementioned middle column\\nstarted, as shown in the next Figma file below. Placing the components on the\\ncanvas and after mov
15ing them around and drawing rectangles and removing the\\ncomponents there was time to make the boundaries across them visible."],[13],[1,"\\n"],[10,"iframe"],[14,5,"width: 100%; min-height: 400px; resize: both;"],[14,"src","https://www.figma.com/embed?embed_host=share&url=https://www.figma.com/file/sWEslYwEe6y87vkVn5DtKm/Documentation%3A-Components?node-id=741%3A0"],[14,"allowfullscreen",""],[12],[13],[1,"\\n"],[10,2],[12],[1,"With color-coding, proper areas and their names it was possible to understand\\nwhat rules and guidelines for each of those components do apply."],[13],[1,"\\n"],[10,2],[12],[1,"-> Have a look at the "],[10,3],[14,6,"https://hokulea.netlify.app/?path=/story/documentation-development--classification"],[14,"target","_blank"],[12],[1,"component\\nclassifications from Hokulea and their guidelines"],[13],[1,"."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,1],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Atomic Design","2013","https://bradfrost.com/blog/post/atomic-web-design"]],[["default"],[[[[1,"\\n "],[8,[30,3,["Author"]],null,[["@given","@family"],["Brad","Frost"]],null],[1,"\\n "]],[3]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Design system components, recipes, and snowflakes","2021","https://bradfrost.com/blog/post/design-system-components-recipes-and-snowflakes"]],[["default"],[[[[1,"\\n "],[8,[30,4,["Author"]],null,[["@given","@family"],["Brad","Frost"]],null],[1,"\\n "]],[4]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","l","r","r"],false,["article","references"]]',moduleName:"ember-handbook/component-architecture/classification/template.hbs",isStrictMode:!1}) 16e.default=n})),define("ember-handbook/component-architecture/glossary/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 17var n=(0,t.createTemplateFactory)({id:"fDHqnCEo",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Glossary%22%7D","%5B%7B%22content%22%3A%22Inside%20vs.%20Outside%22%2C%22slug%22%3A%22inside-vs-outside%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Internal%20vs.%20Public%22%2C%22slug%22%3A%22internal-vs-public%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"inside-vs.-outside"],[12],[1,"Inside vs. Outside"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Inside"],[13],[1,"\\n"],[10,"dd"],[12],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Developers/Authors"],[13],[1,"\\n"],[10,"li"],[12],[1,"Definition"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"dt"],[12],[1,"Outside"],[13],[1,"\\n"],[10,"dd"],[12],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Consumers"],[13],[1,"\\n"],[10,"li"],[12],[1,"Invocation"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"internal-vs.-public"],[12],[1,"Internal vs. Public"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Internal"],[13],[1,"\\n"],[10,"dd"],[12],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Know within a scope"],[13],[1,"\\n"],[10,"li"],[12],[1,"Only consumed within the scope"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"dt"],[12],[1,"Public"],[13],[1,"\\n"],[10,"dd"],[12],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Publicly known"],[13],[1,"\\n"],[10,"li"],[12],[1,"Everybody allowed to use them"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/glossary/template.hbs",isStrictMode:!1}) 18e.default=n})),define("ember-handbook/component-architecture/haptics/blocks/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
18dule",{value:!0}),e.default=void 0 19var n=(0,t.createTemplateFactory)({id:"FVXzS9l1",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Blocks%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/haptics/blocks/template.hbs",isStrictMode:!1}) 20e.default=n})),define("ember-handbook/component-architecture/haptics/index/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 21var n=(0,t.createTemplateFactory)({id:"u+EmSTi9",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Haptics%22%2C%22type%22%3A%22tech%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[10,"strong"],[12],[1,"Haptics"],[13],[1," indicate to a consumer "],[10,"em"],[12],[1,"how to interact"],[13],[1," with them from the "],[10,"em"],[12],[1,"outside"],[13],[1," and signal the "],[10,"em"],[12],[1,"mechanics"],[13],[1," to plug and play them together."],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.haptics.invocation"]],[["default"],[[[[1,"Invocation"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"The different ways to invoke them"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.haptics.plug-and-play"]],[["default"],[[[[1,"Play and Play"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Characteristics to put them together"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.haptics.blocks"]],[["default"],[[[[1,"Blocks"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Named blocks and yields"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article","link-to"]]',moduleName:"ember-handbook/component-architecture/haptics/index/template.hbs",isStrictMode:!1}) 22e.default=n})),define("ember-handbook/component-architecture/haptics/invocation/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 23var n=(0,t.createTemplateFactory)({id:"f5BW6Pya",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Invocation%22%7D","%5B%7B%22content%22%3A%22Inline%22%2C%22slug%22%3A%22inline%22%2C%22lvl%22%3A3%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Block%22%2C%22slug%22%3A%22block%22%2C%22lvl%22%3A3%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Mixed%22%2C%22slug%22%3A%22mixed%22%2C%22lvl%22%3A3%2C%22i%22%3A2%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"The element can either be written as "],[10,"em"],[12],[1,"inline"],[13],[1," or "],[10,"em"],[12],[1,"block"],[13],[1,",\\nsome components allow both. A block level element offers more freedom to\\ncontrol the contents inside."],[13],[1,"\\n"],[10,"h3"],[14,1,"inline"],[12],[1,"Inline"],[13],[1,"\\n"],[10,2],[12],[1,"The shortest form to invoke a component and pass in arguments."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"Button"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"label"],[13],[1,"="],[10,1],[14,0,"hljs-string"],[12],[1,"\\"Inline\\""],[13],[1," />"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"block"],[12],[1,"Block"],[13],[1,"\\n"],[10,2],[12],[1,"Block invocation to pass in arguments and a "],[10,"em"],[12],[1,"block"],[13],[1," to have fine control over\\nour contents in regards to our semantic structure."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"Button"],[13],[1,">"],[13],[1,"Block"],[10,1],[14,0,"hljs-tag"],[12],[1,"</"],[10,1],[14,0,"hljs-name"],[12],[1,"Button"],[13],[1,">"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"mixed"],[12],[1,"Mixed"],[13],[1,"\\n"],[10,2],[12],[1,"Best of both worlds, but watch out for this:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"Button"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"label"],[13],[1,"="],[10,1],[14,0,"hljs-string"],[12],[1,"\\"What the heck\\""],[13],[1,">"],[13],[1,"\\n Is going on?\\n"],[10,1],[14,0,"hljs-tag"],[12],[1,"</"],[10,1],[14,0,"hljs-name"],[12],[1,"Button"],[13],[1,">"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/haptics/invocation/template.hbs",isStrictMode:!1}) 24e.default=n})),define("ember-handbook/component-architecture/haptics/plug-and-play/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
24dule",{value:!0}),e.default=void 0 25var n=(0,t.createTemplateFactory)({id:"JBtDgJ5h",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Plug\'n\'Play%20Characteristics%22%7D","%5B%7B%22content%22%3A%22Content%22%2C%22slug%22%3A%22content%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Styled%22%2C%22slug%22%3A%22styled%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structure%22%2C%22slug%22%3A%22structure%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"content"],[12],[1,"Content"],[13],[1,"\\n"],[10,2],[12],[1,"Does the component "],[10,"em"],[12],[1,"visibly"],[13],[1," show contents? Likely in the form of interactive\\nelement(s) and/or displaying data."],[13],[1,"\\n"],[10,"h2"],[14,1,"styled"],[12],[1,"Styled"],[13],[1,"\\n"],[10,2],[12],[1,"Whether visuals are applied or not to make the content look\\nbeautiful."],[13],[1,"\\n"],[10,2],[12],[1,"When styling is applied, is it "],[10,"em"],[12],[1,"safely"],[13],[1," styled intrinsically? Does it leak styling?\\nWill it cause side-effects to the layout Iâm putting this component in?"],[13],[1,"\\n"],[10,"h2"],[14,1,"structure"],[12],[1,"Structure"],[13],[1,"\\n"],[10,2],[12],[1,"The component uses elements to structure and organize its children, but\\nits own content is "],[10,"em"],[12],[1,"invisible"],[13],[1,". Do I have to be careful when placing children\\ninside? Will the component have plan for the layout of children?"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/haptics/plug-and-play/template.hbs",isStrictMode:!1}) 26e.default=n})),define("ember-handbook/component-architecture/haptics/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 27var n=(0,t.createTemplateFactory)({id:"t0MYifBA",block:'[[[1,[28,[35,0],["Haptics"],null]],[1,"\\n"],[46,[28,[37,2],null,null],null,null,null]],[],false,["page-title","component","-outlet"]]',moduleName:"ember-handbook/component-architecture/haptics/template.hbs",isStrictMode:!1}) 28e.default=n})),define("ember-handbook/component-architecture/index/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 29var n=(0,t.createTemplateFactory)({id:"xLgNDoQ7",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Component%20Architecture%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"This learning section is about the various bits and pieces that are the\\ningredients to a component architecture. The demos and examples are written\\nin ember, yet this whole section is framework agnostic and can also be applied\\nto any other frontend framework or library that provides components."],[13],[1,"\\n"],[10,2],[12],[1,"This topic was presented as a talk at EmberIgnite. You can "],[8,[39,1],null,[["@route"],["component-architecture.talk"]],[["default"],[[[[1,"re-watch the recording"]],[]]]]],[1,"."],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.haptics"]],[["default"],[[[[1,"Haptics"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"How to interact with them"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns"]],[["default"],[[[[1,"Patterns"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"How they work inside"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.types"]],[["default"],[[[[1,"Types"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"What\'s their purpose?"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.classification"]],[["default"],[[[[1,"Classification"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"The home of a component"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.styling"]],[["default"],[[[[1,"Styling"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"How to paint them"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.best-practices"]],[["default"],[[[[1,"Best Practices"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Start using this"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article","link-to"]]',moduleName:"ember-handbook/component-architecture/index/template.hbs",isStrictMode:!1}) 30e.default=n})),define("ember-handbook/component-architecture/literature/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
30dule",{value:!0}),e.default=void 0 31var n=(0,t.createTemplateFactory)({id:"dF5ebAwn",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Literature%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"Used references for this topic"],[13],[1,"\\n"],[8,[39,1],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Presentational and Container Components","2015","https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0"]],[["default"],[[[[1,"\\n "],[8,[30,3,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[3]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Mixins Are Dead. Long Live Composition","2015","https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750"]],[["default"],[[[[1,"\\n "],[8,[30,4,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[4]]]]],[1,"\\n\\n "],[8,[30,2,["Book"]],null,[["@chapter","@title","@edition","@year"],["The Stack","Every Layout","2nd edition","2021"]],[["default"],[[[[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Andy","Bell"]],null],[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Heydon","Pickering"]],null],[1,"\\n "]],[5]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@month","@day","@url"],["CUBE CSS","2020","5","26","https://piccalil.li/blog/cube-css/"]],[["default"],[[[[1,"\\n "],[8,[30,6,["Author"]],null,[["@given","@family"],["Andy","Bell"]],null],[1,"\\n "]],[6]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@year","@month","@day","@url"],["Flow CSS Utility","2020","11","3","https://piccalil.li/quick-tip/flow-utility/"]],[["default"],[[[[1,"\\n "],[8,[30,7,["Author"]],null,[["@given","@family"],["Andy","Bell"]],null],[1,"\\n "]],[7]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@url"],["Exception","https://cube.fyi/exception.html"]],[["default"],[[[[1,"\\n "],[8,[30,8,["Author"]],null,[["@given","@family"],["Andy","Bell"]],null],[1,"\\n "]],[8]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@month","@day","@url"],["Managing Flow and Rhythm with CSS Custom Properties","2018","12","7","https://24ways.org/2018/managing-flow-and-rhythm-with-css-custom-properties/"]],[["default"],[[[[1,"\\n "],[8,[30,9,["Author"]],null,[["@given","@family"],["Andy","Bell"]],null],[1,"\\n "]],[9]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Making your app fast with high-performance components","2015","Video File","React.js Conf 2015","https://www.youtube.com/watch?v=KYzlpRvWZ6c&t=1351s"]],[["default"],[[[[1,"\\n "],[8,[30,10,["Author"]],null,[["@given","@family"],["Jason","Bonta"]],null],[1,"\\n "]],[10]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Composable Components","2015","Video File","EmberCamp London 2015","https://www.youtube.com/watch?v=6N4qsO22fmw"]],[["default"],[[[[1,"\\n "],[8,[30,11,["Author"]],null,[["@given","@family"],["Miguel","Camba"]],null],[1,"\\n "]],[11]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Higher Order Components","2017","Video File","EmberConf 2017","https://www.youtube.com/watch?v=MpFudGJn2J0"]],[["default"],[[[[1,"\\n "],[8,[30,12,["Author"]],null,[["@given","@family"],["Miguel","Camba"]],null],[1,"\\n "]],[12]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Container Components","2015","https://medium.com/@learnreact/container-components-c0e67432e005"]],[["default"],[[[[1,"\\n "],[8,[30,13,["Author"]],null,[["@given","@family"],["Michael","Chan"]],null],[1,"\\n "]],[13]]]]],[1,"\\n\\n"],[1," "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Design Considerations for a Modern Data Table","2017","Video File","@Ember SF","https://www.youtube.com/watch?v=M6MHWgHjoJs"]],[["default"],[[[[1,"\\n "],[8,[30,14,["Author"]],null,[["@given","@family"],["Devendra","Desai"]],null],[1,"\\n "]],[14]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Building Better Components","2019","Video File","EmberConf 2019","https://www.youtube.com/watch?v=Kyd2mQpR_9c"]
31],[["default"],[[[[1,"\\n "],[8,[30,15,["Author"]],null,[["@given","@family"],["Dianne","Eramo"]],null],[1,"\\n "]],[15]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@url"],["Accessible Rich Internet Applications (WAI-ARIA) 1.2","https://www.w3.org/TR/wai-aria-1.2/"]],[["default"],[[[[1,"\\n "],[8,[30,16,["Author"]],null,[["@given","@family"],["Joanmarie","Diggs"]],null],[1,"\\n "],[8,[30,16,["Author"]],null,[["@given","@family"],["James","Nurthen"]],null],[1,"\\n "],[8,[30,16,["Author"]],null,[["@given","@family"],["Michael","Cooper"]],null],[1,"\\n "]],[16]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Atomic Design","2013","https://bradfrost.com/blog/post/atomic-web-design"]],[["default"],[[[[1,"\\n "],[8,[30,17,["Author"]],null,[["@given","@family"],["Brad","Frost"]],null],[1,"\\n "]],[17]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Design system components, recipes, and snowflakes","2021","https://bradfrost.com/blog/post/design-system-components-recipes-and-snowflakes"]],[["default"],[[[[1,"\\n "],[8,[30,18,["Author"]],null,[["@given","@family"],["Brad","Frost"]],null],[1,"\\n "]],[18]]]]],[1,"\\n\\n "],[8,[30,2,["Book"]],null,[["@title","@publisher","@year"],["Design Patterns","Addison-Wesley","1994"]],[["default"],[[[[1,"\\n "],[8,[30,19,["Author"]],null,[["@given","@family"],["Erich","Gamma"]],null],[1,"\\n "],[8,[30,19,["Author"]],null,[["@given","@family"],["Richard","Helm"]],null],[1,"\\n "],[8,[30,19,["Author"]],null,[["@given","@family"],["Ralph","Johnson"]],null],[1,"\\n "],[8,[30,19,["Author"]],null,[["@given","@family"],["John","Vlissides"]],null],[1,"\\n "]],[19]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Introducing the Single Element Pattern","2018","https://www.freecodecamp.org/news/introducing-the-single-element-pattern-dfbd2c295c5d/"]],[["default"],[[[[1,"\\n "],[8,[30,20,["Author"]],null,[["@given","@family"],["Diego","Haz"]],null],[1,"\\n "]],[20]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["The new responsive: Web design in a component-driven world","2021","https://web.dev/new-responsive/"]],[["default"],[[[[1,"\\n "],[8,[30,21,["Author"]],null,[["@given","@family"],["Una","Kravets"]],null],[1,"\\n "]],[21]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Higher-Order Components in Ember.js","2018","https://v4.chriskrycho.com/2018/higher-order-components-in-emberjs.html"]],[["default"],[[[[1,"\\n "],[8,[30,22,["Author"]],null,[["@given","@family"],["Chris","Krycho"]],null],[1,"\\n "]],[22]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Components patterns in Ember.js","2018","https://medium.com/macsour/components-patterns-in-ember-js-5e6fc6eea28f"]],[["default"],[[[[1,"\\n "],[8,[30,23,["Author"]],null,[["@given","@family"],["Maciej","KwaÅniak"]],null],[1,"\\n "]],[23]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@url"],["Loading ⢠Pico.css","https://picocss.com/docs/loading.html"]],[["default"],[[[[1,"\\n "],[8,[30,24,["Author"]],null,[["@given","@family"],["Lucas","Larroche"]],null],[1,"\\n "]],[24]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Responsive Web Design","2010","http://alistapart.com/article/responsive-web-design/"]],[["default"],[[[[1,"\\n "],[8,[30,25,["Author"]],null,[["@given","@family"],["Ethan","Marcotte"]],null],[1,"\\n "]],[25]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["The Strategy Pattern Using Higher Order Functions","2018","https://hackernoon.com/the-command-pattern-using-higher-order-functions-e482fe322460"]],[["default"],[[[[1,"\\n "],[8,[30,26,["Author"]],null,[["@given","@family"],["Ivan","Montiel"]],null],[1,"\\n "]],[26]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Compat 2021: Eliminating five top compatibility pain points on the web","2021","https://web.dev/compat2021/"]],[["default"],[[[[1,"\\n "],[8,[30,27,["Author"]],null,[["@given","@family"],["Robert","Nyman"]],null],[1,"\\n "],[8,[30,27,["Author"]],null,[["@given","@family"],["Philip","Jägenstedt"]],null],[1,"\\n "]],[27]]]]],[1,"\\n\\n "],[8,[30,2,["Book"]],null,[["@title","@publisher","@year","@edition"],["The Humane Interface","Addison-Wesley","2008","10th Printing"]],[["default"],[[[[1,"\\n "],[8,[30,28,["Author"]],null,[["@given","@family"],["Jef","Raskin"]],null],[1,"\\n "]],[28]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@url"],["Design-Patterns? Bloà nicht! // deutsch","2022","Video File","https://www.youtube.com/watch?v=oC-9HZ0r3e4"]],[["default"],[[[[1,"\\n "],[8,[30,29,["Author"]],null,[["@given","@family"],["Golo","Roden"]],null],[1,"\\n "]],[29]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Don\'t Fight the Cascade, Control It!","2022","https://css-tricks.
31com/dont-fight-the-cascade-control-it/"]],[["default"],[[[[1,"\\n "],[8,[30,30,["Author"]],null,[["@given","@family"],["Mads","Stoumanm"]],null],[1,"\\n "]],[30]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@url"],["BEM â Block Element Modifier","http://getbem.com/introduction/"]],[["default"],[[[[1,"\\n "],[8,[30,31,["Author"]],null,[["@given","@family"],["Vsevolod","Strukchinsky"]],null],[1,"\\n "],[8,[30,31,["Author"]],null,[["@given","@family"],["Vlad","Starkov"]],null],[1,"\\n "]],[31]]]]],[1,"\\n\\n "],[8,[30,2,["WebPage"]],null,[["@title","@year","@url"],["TPAC 2021: Improving CSS Architecture with Cascade Layers, Container Queries, Scope - Demo & Group Updates","2021","https://www.w3.org/2021/10/TPAC/demos/css-architecture.html"]],[["default"],[[[[1,"\\n "],[8,[30,32,["Author"]],null,[["@given","@family"],["Miriam","Suzanne"]],null],[1,"\\n "]],[32]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["A Complete Guide to CSS Cascade Layers","2022","https://css-tricks.com/css-cascade-layers/"]],[["default"],[[[[1,"\\n "],[8,[30,33,["Author"]],null,[["@given","@family"],["Miriam","Suzanne"]],null],[1,"\\n "]],[33]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["CSS in 2022","2021","https://www.bram.us/2021/12/27/css-in-2022/"]],[["default"],[[[[1,"\\n "],[8,[30,34,["Author"]],null,[["@given","@family"],["Bramus","Van Damme"]],null],[1,"\\n "]],[34]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Interop 2022","2022","https://www.bram.us/2022/02/13/interop-2022/"]],[["default"],[[[[1,"\\n "],[8,[30,35,["Author"]],null,[["@given","@family"],["Bramus","Van Damme"]],null],[1,"\\n "]],[35]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Custom properties with defaults: 3+1 strategies","2021","https://lea.verou.me/2021/10/custom-properties-with-defaults"]],[["default"],[[[[1,"\\n "],[8,[30,36,["Author"]],null,[["@given","@family"],["Lea","Verou"]],null],[1,"\\n "]],[36]]]]],[1,"\\n"]],[2]]]]],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art","l","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r","r"],false,["article","references"]]',moduleName:"ember-handbook/component-architecture/literature/template.hbs",isStrictMode:!1}) 32e.default=n})),define("ember-handbook/component-architecture/patterns/adapter/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 33var n=(0,t.createTemplateFactory)({id:"C3yDZEbP",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Adapter%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/patterns/adapter/template.hbs",isStrictMode:!1}) 34e.default=n})),define("ember-handbook/component-architecture/patterns/bridge/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 35var n=(0,t.createTemplateFactory)({id:"XG4XRaM4",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Bridge%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/patterns/bridge/template.hbs",isStrictMode:!1}) 36e.default=n})),define("ember-handbook/component-architecture/patterns/builder/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
36dule",{value:!0}),e.default=void 0 37var n=(0,t.createTemplateFactory)({id:"yz23+lA7",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Builder%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Intent%22%2C%22slug%22%3A%22intent%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structure%22%2C%22slug%22%3A%22structure%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Object%20Oriented%20Implementation%22%2C%22slug%22%3A%22object-oriented-implementation%22%2C%22lvl%22%3A3%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Declarative%20Implementation%22%2C%22slug%22%3A%22declarative-implementation%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Future%20Additions%22%2C%22slug%22%3A%22future-additions%22%2C%22lvl%22%3A4%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Using%20a%20Director%22%2C%22slug%22%3A%22using-a-director%22%2C%22lvl%22%3A4%2C%22i%22%3A5%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Applicability%22%2C%22slug%22%3A%22applicability%22%2C%22lvl%22%3A2%2C%22i%22%3A6%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A7%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"intent"],[12],[1,"Intent"],[13],[1,"\\n"],[10,2],[12],[1,"Builder is a creational pattern providing you a construction code to produce\\ndifferent types and representations of an object."],[13],[1,"\\n"],[10,"h2"],[14,1,"structure"],[12],[1,"Structure"],[13],[1,"\\n"],[10,2],[12],[1,"A "],[10,"em"],[12],[1,"Builder"],[13],[1," interface describes the construction pieces common to all types of\\nbuilders. A concrete implementation of that interface provides the shapes and\\nfaces relative for that builder. A "],[10,"em"],[12],[1,"Director"],[13],[1," knows how to use the pieces and\\nassemble the representation for the given object."],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hP31IWCn48RFpLCCUD63lIn2lSYsbK0lfIW-GCnEqz0aKoOJF1JVtQpRBglWpLF2yCqt_qoRnR2K65G--dGoR29qk3SbYAOaMnCHNj4Hmjj6JHWRJCvmLhELiKV7L5Atfa0CDtgXbrghsPAPFYwrvl6XMJGL9kwGVnO_frf6AoQvWF-aRiVrXi3FlfzGaRC2i9IoSB5oUzUdy4cGzyOYh8eFLVODlVV_NPKCqA1PKxACWbVGnrF0Y4dodxq03kK5SptirBHZwce2fSPaT7zrgDzZvkpTGUPFOrUBgUkNkxnV"]],null],[10,2],[12],[1,"The "],[10,"strong"],[12],[1,"participants"],[13],[1," are (Gamma, Helm, Johnson and Vlissidies, 1994, p. 99):"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Builder"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Specifies an abstract interface for the creating parts of a Product object."],[13],[1,"\\n"],[10,"dt"],[12],[1,"ConcreteBuilder"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Knows how to build individual pieces by implementing the Builder interface."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Director"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Constructs an object using the Builder interface."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Product"],[13],[1,"\\n"],[10,"dd"],[12],[1,"The complex object that is represented with the Builder interface. The product\\nknows its internal representation and includes classes that define the\\nconstituent parts, including interfaces for assembling parts to the final result."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h3"],[14,1,"object-oriented-implementation"],[12],[1,"Object Oriented Implementation"],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hL31JiCm33slNn69ov3OgK8QEtKTYfW4N10VO18lYfR6bUCAJOX_9w
37M3PZSEdEptRBzdkqa2B4CNgdJqiGU6Jbaym114KvHdw52ze2DKh_kgw341Kb8VrQ85StHCGxGx2iJgIg_rLkjgiMMczpDNtztMwpet4rlaI_Apb6Kq0j45_2VfvlSy7mNv00RL3jYsWm-vFRkex9bGbjSvUnlP1uHScN5BzZGZJIHbTT-1mna--ZH9EPJH9-VvlkbPJv0dFOJIttTzm0wZf7AjduascoLXwFy-CbBtVdmZJTSPYbbYCBAKKuyRbO6FxcPQ5tbJYdmlUw50gmkJ1gCTdtcENm00"]],null],[10,2],[12],[1,"On top of it a "],[10,"em"],[12],[1,"Director"],[13],[1," can be used, that knows how to call the "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"build"],[13],[1,"*"],[13],[1," in\\nthe correct order. Here is how:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-ts"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"class"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"CardDirector"],[13],[1," {\\n "],[10,1],[14,0,"hljs-title function_"],[12],[1,"construct"],[13],[1,"("],[10,1],[14,0,"hljs-params"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"type"],[13],[1,": "],[10,1],[14,0,"hljs-built_in"],[12],[1,"string"],[13],[1,", builder: CardBuilder"],[13],[1,") {\\n builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"reset"],[13],[1,"();\\n\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"switch"],[13],[1," ("],[10,1],[14,0,"hljs-keyword"],[12],[1,"type"],[13],[1,") {\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"case"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"simple\\""],[13],[1,":\\n builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"buildBody"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"break"],[13],[1,";\\n\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"case"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"dialog\\""],[13],[1,":\\n builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"buildHeader"],[13],[1,"();\\n builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"buildBody"],[13],[1,"();\\n builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"buildFooter"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"break"],[13],[1,";\\n }\\n\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"return"],[13],[1," builder."],[10,1],[14,0,"hljs-title function_"],[12],[1,"getCard"],[13],[1,"();\\n }\\n}\\n"],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"declarative-implementation"],[12],[1,"Declarative Implementation"],[13],[1,"\\n"],[10,2],[12],[1,"A "],[8,[39,2],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"composable\\ncomponent"]],[]]]]],[1," is best suited to implement the builder pattern\\ndeclaratively. The yielded elements are pieces to construct different\\nshapes of a particular type. The composable component can act as a director\\nitself with the "],[10,"em"],[12],[1,"simple"],[13],[1," case being the default. The participants mentioned\\nabove are spread a bit differently and are as follows:"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Builder"],[13],[1,"\\n"],[10,"dd"],[12],[1,"The builder interface defines the "],[10,"code"],[12],[1,"yield"],[13],[1," of a concrete builder component.\\nSince this is not officially supported in ember, typescript can help here to let\\nus define an interface for it, yet apart from documentation purpose there is no\\nother benefit from doing so (see "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"component"],[13],[1,".ts"],[13],[1," below)."],[13],[1,"\\n"],[10,"dt"],[12],[1,"ConcreteBuilder"],[13],[1,"\\n"],[10,"dd"],[12],[1,"The component, that yields in regards to the builder interface."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Director"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Can be the "],[10,"em"],[12],[1,"ConcreteBuilderComponent"],[13],[1," itself or a separate component, that\\nwraps the Builder, see subsection "],[10,3],[14,6,"#using-a-director"],[12],[1,"Using a Director"],[13],[1," below."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Product"],[13],[1,"\\n"],[10,"dd"],[12],[1,"The object being represented by the with the "],[10,"em"],[12],[1,"ConcreteBuilder"],[13],[1,", see\\nsubsection "],[10,3],[14,6,"#using-a-director"],[12],[1,"Using a Director"],[13],[1," below."],[13],[1,"\\n"],[13],[1,"\\n"],[8,[39,3],null,null,[["default"],[[[[1,"\\n"],[8,[30,2,["Page"]],null,[["@title"],["template.hbs"]],[["default"],[[[[1,"\\n"],[8,[39,4],null,[["@name"],["components/examples/card/template.hbs"]],null],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[8,[30,2,["Page"]],null,[["@title"],["component.ts"]],[["default"],[[[[1,"\\n"],[8,[39,4],null,[["@name"],["components/examples/card/component.ts"]],null],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[8,[30,2,["Page"]],null,[["@title"],["body/template.hbs"]],[["default"],[[[[1,"\\n"],[8,[39,4],null,[["@name"],["components/examples/card/body/template.hbs"]],null],[1,"\\n"]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,2],[12],[1,"Remark: header, footer and body have the same template, only the css class is\\ndifferent (thatâs why there is only one template shown)."],[13],[1,"\\n"],[10,2],[12],[1,"The simplest use-case (since it is a conceptual component, we give it\\na sensible default):"],[13],[1,"\\n"],[8,[39,5],null,[["@source"],["components/patterns/builder/demo-simplest.hbs"]],[["default"],[[[[1,"\\n"],[8,[39,6],null,null,[["default"],[[[[1,"\\nSimplest Card\\n"]],[]]]]],[1,"\\n"]],[]]]]],[1,"\\n"],[10,2],[12],[1,"Using the pieces from the builder:"],[13],[1,"\\n"],[8,[39,5],null,[["@source"],["components/patterns/builder/demo-dialog.hbs"]],[["default"],[[[[1,"\\n"],[8,[39,6],null,null,[["default"],[[[[1,"\\n"],[8,[30,3,["Header"]],null,null,[["default"],[[[[1,"\\nHeader\\n"]],[]]]]],[1,"\\n"],[8,[30,3,["Body"]],null,null,[["default"],[[[[1,"\\nCard body\\n"]],[]]]]],[1,"\\n"],[8,[30,3,["Footer"]],null,null,[["default"],[[[[1,"\\nFooter\\n"]],[]]]]],[1,"\\n"]],[3]]]]],[1,"\\n"]],[]]]]],[1,"\\n"],[10,2],[12],[1,"The "],[10,"em"],[12],[1,"Director"],[13],[1," is optional, since the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<Card>"],[13],[13],[1," is one itself (for the default case),"],[13],[1,"\\n"],[10,"h4"],[14,1,"future-additions"],[12],[1,"Future Additions"],[13],[1,"\\n"],[10,2],[12],[1,"This pattern allows for future additions, without breaking the existing code."],[13],[1,"\\n"],[10,"ol"],[12],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[10,2],[12],[1,"Adding more elements by extendng the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<Card>"],[13],[13],[1," with a "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<Card::List>"],[13],[13],[1," component\\nto provide a piece for lists within a card. Even further the list can be a\\nbuilder pattern on its own, yielding prieces to create individual items."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[10,2],[12],[1,"Exchanging the UI part. In the given example, the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<Card>"],[13],[13],[1," component is used,\\nwhich can be easily replaced with another component, e.g. "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<MaterialCard>"],[13],[13],[1," as\\nlong as both implement the "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"CardYield"],[13],[13],[1," interface."],[13],[1,"\\n"],[10,2],[12],[1,"Combine it with the "],[8,[39,2],null,[["@route"],["component-architecture.patterns.strategy"]],[["default"],[[[[1,"strategy\\
37npattern"]],[]]]]],[1," to pass in the respective builder components."],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h4"],[14,1,"using-a-director"],[12],[1,"Using a Director"],[13],[1,"\\n"],[10,2],[12],[1,"Using the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<CardDirectory>"],[13],[13],[1," as a wrapper to take the "],[10,"code"],[12],[10,1],[14,0,"hljs-meta"],[12],[1,"@builder"],[13],[13],[1," as input and\\nyield the ready-to-use variable to construct your own object."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"CardDirector"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"builder"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"component"],[13],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"material-card\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1," "],[10,1],[14,0,"hljs-attr"],[12],[1,"as"],[13],[1," |"],[10,1],[14,0,"hljs-attr"],[12],[1,"cb"],[13],[1,"|>"],[13],[1,"\\n "],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"cb.Header"],[13],[1,">"],[13],[1,"..."],[10,1],[14,0,"hljs-tag"],[12],[1,"</"],[10,1],[14,0,"hljs-name"],[12],[1,"cb.Header"],[13],[1,">"],[13],[1,"\\n ...\\n"],[10,1],[14,0,"hljs-tag"],[12],[1,"</"],[10,1],[14,0,"hljs-name"],[12],[1,"CardDirector"],[13],[1,">"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"The tradeoff here is, the logic to control the order is not be part of the\\n"],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<CardDirector>"],[13],[13],[1," itself but must still be handled from within the context. The\\n"],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<CardDirector>"],[13],[13],[1," as its own component is only the passthrough from passed in "],[10,"code"],[12],[10,1],[14,0,"hljs-meta"],[12],[1,"@builder"],[13],[13],[1,"."],[13],[1,"\\n"],[10,2],[12],[1,"Better approach is to integrate the "],[10,"em"],[12],[1,"director"],[13],[1," as part of the context, e.g. a\\ncomponent handling business logic depending on the object being passed in:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"ProductCard"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"product"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"product"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1," />"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"The "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<ProductCard>"],[13],[13],[1," will become the director and depending on the "],[10,"code"],[12],[10,1],[14,0,"hljs-meta"],[12],[1,"@product"],[13],[13],[1,"\\nknows how to assemble the pieces in the correct order to accordingly represent\\nthe product."],[13],[1,"\\n"],[10,"h2"],[14,1,"applicability"],[12],[1,"Applicability"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Use the builder pattern when you want to be able to create different shapes\\nand representations."],[13],[1,"\\n"],[10,"li"],[12],[1,"Works in harmony with the "],[8,[39,2],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"composable\\ncomponent"]],[]]]]],[1,"."],[13],[1,"\\n"],[10,"li"],[12],[1,"Nesting works smoothly on the declarative approach."],[13],[1,"\\n"],[10,"li"],[12],[1,"Easily extendable with more pieces."],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,7],[[24,0,"references"]],null,[["default"],[[[[1,"\\n"],[8,[30,4,["WebPage"]],null,[["@title","@url"],["Builder","https://refactoring.guru/design-patterns/builder"]],[["default"],[[[[1,"\\n"],[8,[30,5,["Author"]],null,[["@given","@family"],["Alexander","Shvets"]],null],[1,"\\n"]],[5]]]]],[1,"\\n"],[8,[30,4,["Book"]],null,[["@title","@publisher","@year"],["Design Patterns","Addison-Wesley","1994"]],[["default"],[[[[1,"\\n"],[8,[30,6,["Author"]],null,[["@given","@family"],["Erich","Gamma"]],null],[1,"\\n"],[8,[30,6,["Author"]],null,[["@given","@family"],["Richard","Helm"]],null],[1,"\\n"],[8,[30,6,["Author"]],null,[["@given","@family"],["Ralph","Johnson"]],null],[1,"\\n"],[8,[30,6,["Author"]],null,[["@given","@family"],["John","Vlissides"]],null],[1,"\\n"]],[6]]]]],[1,"\\n"]],[4]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","tabs","cb","l","r","r"],false,["article","diagram","link-to","tabs","code-snippet","demo","examples/card","references"]]',moduleName:"ember-handbook/component-architecture/patterns/builder/template.hbs",isStrictMode:!1}) 38e.default=n})),define("ember-handbook/component-architecture/patterns/command/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
38dule",{value:!0}),e.default=void 0 39var n=(0,t.createTemplateFactory)({id:"p+Qi1FiL",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Command%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/patterns/command/template.hbs",isStrictMode:!1}) 40e.default=n})),define("ember-handbook/component-architecture/patterns/decorator/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 41var n=(0,t.createTemplateFactory)({id:"TQJqIlgP",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Decorator%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/patterns/decorator/template.hbs",isStrictMode:!1}) 42e.default=n})),define("ember-handbook/component-architecture/patterns/facade/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 43var n=(0,t.createTemplateFactory)({id:"720y3zxc",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Facade%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Intent%22%2C%22slug%22%3A%22intent%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%22%2C%22slug%22%3A%22example%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Without%20Facade%22%2C%22slug%22%3A%22without-facade%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22With%20Facade%22%2C%22slug%22%3A%22with-facade%22%2C%22lvl%22%3A3%2C%22i%22%3A4%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"intent"],[12],[1,"Intent"],[13],[1,"\\n"],[10,"blockquote"],[12],[1,"\\n"],[10,2],[12],[1,"Provide a unified interface to a set of interfaces in a subsystem. Facade\\ndefines a higher-level interface that makes the subsystem easier to use."],[13],[1,"\\n"],[10,2],[12],[10,"cite"],[12],[1,"Gamma, E. et al. (1994, p. 185)"],[13],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Provide a simple interface to a complex subsystem"],[13],[1,"\\n"],[10,"li"],[12],[1,"Facade often acts as a âdefault viewâ that is mostly âgood enoughâ"],[13],[1,"\\n"],[10,"li"],[12],[1,"Decouple subsystem from clients/consumers and other subsystems"],[13],[1,"\\n"],[10,"li"],[12],[1,"Promote subsystem independence and portability"],[13],[1,"\\n"],[10,"li"],[12],[1,"Facade as entry point to your subsystem (so you can re-arrange behind that)"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"example"],[12],[1,"Example"],[13],[1,"\\n"],[10,2],[12],[1,"Make a screen/page component for product details"],[13],[1,"\\n"],[10,"h3"],[14,1,"without-facade"],[12],[1,"Without Facade"],[13],[1,"\\n"],[10,2],[12],[1,"Have all the sections invoked from the route itself."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{! route: product/details.hbs }}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n<Product::Details::HeaderSection\\n @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"model"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @overviewLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"link"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"overview\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," \\n/>
43\\n\\n<Product::Details::SpecSection @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"model"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"/>\\n\\n<Product::Details::PriceSection\\n @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"model"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @offerLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"link"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"offer\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," \\n/>\\n"],[13],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"with-facade"],[12],[1,"With Facade"],[13],[1,"\\n"],[10,2],[12],[1,"Extract the product details screen into its own component."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{! components/product/details-screen.hbs }}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n<Product::DetailsScreen::HeaderSection \\n @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"product"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @overviewLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"overviewLinklink"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," \\n/>\\n \\n<Product::DetailsScreen::SpecSection @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"product"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," />\\n \\n<Product::DetailsScreen::PriceSection \\n @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"product"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @offerLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"offerLink"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," \\n/>\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"Invoke it from the route and pass in the links, as the route is owner of routing information."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{! route: product/details.hbs }}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n<Product::DetailsScreen\\n @product="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"model"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @overviewLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"link"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"overview\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n @offerLink="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"link"],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"offer\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n/>\\n"],[13],[13],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/patterns/facade/template.hbs",isStrictMode:!1}) 44e.default=n})),define("ember-handbook/component-architecture/patterns/factory/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 45var n=(0,t.createTemplateFactory)({id:"xhFqoECA",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Factory%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Intent%22%2C%22slug%22%3A%22intent%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structure%22%2C%22slug%22%3A%22structure%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Object%20Oriented%20Programming%22%2C%22slug%22%3A%22object-oriented-programming%22%2C%22lvl%22%3A3%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Declarative%20Way%22%2C%22slug%22%3A%22declarative-way%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Applicability%22%2C%22slug%22%3A%22applicability%22%2C%22lvl%22%3A2%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%5D"]
45],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"The factory pattern has different variations, called\\n"],[10,"em"],[12],[1,"factory, creation method, static creation/factory method, simple\\nfactory, factory method"],[13],[1," or "],[10,"em"],[12],[1,"abstract factory"],[13],[1," (see "],[10,3],[14,6,"https://refactoring.guru/design-patterns/factory-comparison"],[12],[1,"factory\\ncomparison"],[13],[1," by\\nShvets (n.d.))."],[13],[1,"\\n"],[10,2],[12],[1,"In this article, the "],[10,"strong"],[12],[1,"simple factory"],[13],[1," is described."],[13],[1,"\\n"],[10,"h2"],[14,1,"intent"],[12],[1,"Intent"],[13],[1,"\\n"],[10,2],[12],[1,"The simple factory pattern is described as an with creation method\\nthat instantiates a new object based on passed parameters."],[13],[1,"\\n"],[10,"h2"],[14,1,"structure"],[12],[1,"Structure"],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hP31QiCm44JFyLS8UaaEFfb2saEm4n3aaXP2Fs2HDew8f3MhDQ6K_dljM2xfCT2JnEoROMVh9C3I1r-aYuiTC0HbyGIz5qrH3X1G7R4bL1_xueun7b9INyLY2-RIClNHxiWJgoUzretMnQ9XfclMgfVdQbqDCB55_Yj-tySo6e7OUlodwFgtthIm1YF4dqEwoXKC8mY-CzdUo7Brgl9ttCj5GJw1mLcy-ImTAQ2SNMoNgn6RWZBIA1SwZm6Zf0TismTjE-y6z4QaOVxM8OCuYXCpropPjMSfDtEdx2hxhjpCjoXgZ7QyK7v_0000"]],null],[10,"h3"],[14,1,"object-oriented-programming"],[12],[1,"Object Oriented Programming"],[13],[1,"\\n"],[10,2],[12],[1,"In OOP the pattern described, will just be a class with a static creation\\nmethod, see the "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"UserFactory"],[13],[13],[1," from Refactoring Guru (n.d.) is been used as an example."],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hL3BQiCm43p7Nx7GWozDBwQG5Wfs0e9UIg7D1opIsfZeOLOIfPJ-UoNRiTEUSkXfHwEPsKVj0tA8HXV-rDi16GqeQZ7g89mDBsW8tgXp1CVdua8ZDNeFNyLcZ_BKiOjM7Pns33TY9neXYat3x3vchdguhtPL4ZjMnB_9xyjO9XdGTfh-ARfUrYCR3HmzyVldaDDXVC0Jb37LyZOHX-Y3CnCfPpn-DChqDhEOGPb7xcqWRb4Il19xPyV4aA8VboPPDfrfxDIRGPCX6_nVIqe-U-uoM8tBHDUPp_8rO9hyElUepTPPizNKXkswJarMvKlEzGS0"]],null],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-ts"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"class"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"UserFactory"],[13],[1," {\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"public"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"static"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"function"],[13],[1," "],[10,1],[14,0,"hljs-title function_"],[12],[1,"create"],[13],[1,"("],[10,1],[14,0,"hljs-params"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"type"],[13],[13],[1,") {\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"switch"],[13],[1," ("],[10,1],[14,0,"hljs-keyword"],[12],[1,"type"],[13],[1,") {\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"case"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"UserType"],[13],[1,"."],[10,1],[14,0,"hljs-property"],[12],[1,"User"],[13],[1,": "],[10,1],[14,0,"hljs-keyword"],[12],[1,"return"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"User"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"case"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"UserType"],[13],[1,"."],[10,1],[14,0,"hljs-property"],[12],[1,"Customer"],[13],[1,": "],[10,1],[14,0,"hljs-keyword"],[12],[1,"return"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Customer"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"case"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"UserType"],[13],[1,"."],[10,1],[14,0,"hljs-property"],[12],[1,"Admin"],[13],[1,": "],[10,1],[14,0,"hljs-keyword"],[12],[1,"return"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Admin"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-attr"],[12],[1,"default"],[13],[1,":\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"throw"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Exception"],[13],[1,"("],[10,1],[14,0,"hljs-string"],[12],[1,"\'Wrong user type passed.\'"],[13],[1,");\\n }\\n }\\n}\\n"],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"declarative-way"],[12],[1,"Declarative Way"],[13],[1,"\\n"],[10,2],[12],[1,"A "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"User"],[13],[13],[1," object (created the way mentioned) above is about to be shown in a\\n"],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<UserProfile>"],[13],[13],[1," component, which has different fields given the various types."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{!-- components/user-profile/template.hbs}}\\n"],[1,"{{#let (component (concat \'user-profile/\' @user.type)) as |Profile|}}\\n <Profile @user="],[1,"{{@user}}/>\\n"],[1,"{{/let}}\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"with the invocation:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"UserProfile"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"user"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"user"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"/>"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"The "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<UserProfile>"],[13],[13],[1," component becomes the "],[10,"strong"],[12],[1,"simple factory"],[13],[1," by using the "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"type"],[13],[13],[1,"\\nof a "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"User"],[13],[13],[1," object to distinguish which specific subcomponent to âcreateâ."],[13],[1,"\\n"],[10,"h2"],[14,1,"applicability"],[12],[1,"Applicability"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Use it to create components to an object that has a dynamic type."],[13],[1,"\\n"],[10,"li"],[12],[1,"Perfectly usable on a list/stream of those objects."],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,2],[[24,0,"references"]],null,[["default"],[[[[1,"\\n"],[8,[30,2,["WebPage"]],null,[["@title","@url"],["Factory Comparison","https://refactoring.guru/design-patterns/factory-comparison"]],[["default"],[[[[1,"\\n"],[8,[30,3,["Author"]],null,[["@given","@family"],["Alexander","Shvets"]],null],[1,"\\n"]],[3]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","l","r"],false,["article","diagram","references"]]',moduleName:"ember-handbook/component-architecture/patterns/factory/template.hbs",isStrictMode:!1}) 46e.default=n})),define("ember-handbook/component-architecture/patterns/index/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
46dule",{value:!0}),e.default=void 0 47var n=(0,t.createTemplateFactory)({id:"P7Xb7d2o",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Patterns%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Creational%22%2C%22slug%22%3A%22creational%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structural%22%2C%22slug%22%3A%22structural%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Behavioral%22%2C%22slug%22%3A%22behavioral%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[10,"strong"],[12],[1,"Patterns"],[13],[1," are part of the engine that powers a component."],[13],[1,"\\n"],[10,"h2"],[14,1,"creational"],[12],[1,"Creational"],[13],[1,"\\n"],[10,2],[12],[10,"em"],[12],[1,"Abstract the instantiation process"],[13],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Make the system independent of how components are created"],[13],[1,"\\n"],[10,"li"],[12],[1,"Class pattern: Uses inheritance to vary the classâ instantiation"],[13],[1,"\\n"],[10,"li"],[12],[1,"Creational Pattern: Delegate instantiation"],[13],[1,"\\n"],[10,"li"],[12],[1,"Composition over Inheritance"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.factory"]],[["default"],[[[[1,"Factory"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Creating families of components"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.prototype"]],[["default"],[[[[1,"Prototype"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Cloning the concrete component"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.patterns.builder"]],[["default"],[[[[1,"Builder"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Construction kit"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"structural"],[12],[1,"Structural"],[13],[1,"\\n"],[10,2],[12],[10,"em"],[12],[1,"Concerned with how components are composed to form larger structures"],[13],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.decorator"]],[["default"],[[[[1,"Decorator"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Adds a little something"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.adapter"]],[["default"],[[[[1,"Adapter"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Connects incompatible components"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.patterns.bridge"]],[["default"],[[[[1,"Bridge"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Make abstraction and implementation exchangeable"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.patterns.facade"]],[["default"],[[[[1,"Facade"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"The entry to a subsystem"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"behavioral"],[12],[1,"Behavioral"],[13],[1,"\\n"],[10,2],[12],[10,"em"],[12],[1,"Concerned with algorithms and the assignment of responsibilities"],[13],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Patterns of communication between behaviors"],[13],[1,"\\n"],[10,"li"],[12],[1,"Characterize complex control flow thatâs difficult to follow at run-time"],[13],[1,"\\n"],[10,"li"],[12],[1,"Shift focus from flow of control to how things are connected"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.command"]],[["default"],[[[[1,"Command"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Enacpsulates a request/(trans)action"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.patterns.adapter"]],[["default"],[[[[1,"Strategy"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Interchangeable algorithms family"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article","link-to"]]',moduleName:"ember-handbook/component-architecture/patterns/index/template.hbs",isStrictMode:!1}) 48e.default=n})),define("ember-handbook/component-architecture/patterns/prototype/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
48dule",{value:!0}),e.default=void 0 49var n=(0,t.createTemplateFactory)({id:"pzyF8BrO",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Prototype%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Intent%22%2C%22slug%22%3A%22intent%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structure%22%2C%22slug%22%3A%22structure%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Object%20Oriented%20Implemetation%22%2C%22slug%22%3A%22object-oriented-implemetation%22%2C%22lvl%22%3A3%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Declarative%20Implementation%22%2C%22slug%22%3A%22declarative-implementation%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Discussion%22%2C%22slug%22%3A%22discussion%22%2C%22lvl%22%3A2%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Applicability%22%2C%22slug%22%3A%22applicability%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Examples%22%2C%22slug%22%3A%22examples%22%2C%22lvl%22%3A2%2C%22i%22%3A6%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Experiments%22%2C%22slug%22%3A%22experiments%22%2C%22lvl%22%3A3%2C%22i%22%3A7%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A8%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"intent"],[12],[1,"Intent"],[13],[1,"\\n"],[10,2],[12],[1,"âPrototype is a creational design pattern that lets you copy existing objects\\nwithout making your code dependent on their classesâ (Shvets, n.d.)."],[13],[1,"\\n"],[10,"h2"],[14,1,"structure"],[12],[1,"Structure"],[13],[1,"\\n"],[10,2],[12],[1,"The client is able to clone from everything that implements the prototype\\ninterface. A concrete implementation of the prototype pattern clones the actual\\nobject in question and with that it can handle process related tasks, such as\\nmanaging references."],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hO_1Yi9044JFpbSqU74FUz0Ww6M92WDUH5Zs0vf96u8ptQ6dWuZuxvkWk7eKzbHGlAhkAhEXMfUYoyU6MrHCKD41ksXUs7QO2Bwf5eAVhNjYGiISuU96Qmp7MgNZQYDH5CP-uLVUkz5ALKvthrZEYqNHmw8LwQjvVQvL2ePSH_gdwl8nhs4ZFM0WsAkOsBaTRa0_H9Wc7yCRjqqRuQ1azC2cqAGsKYAs_7PuzauuDZtct4tXy-ilu4hYQfXnrry0"]],null],[10,2],[12],[1,"The "],[10,"strong"],[12],[1,"participants"],[13],[1," are (Gamma, Helm, Johnson and Vlissidies, 1994, p. 119):"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Prototype"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Declares an interface for cloning itself."],[13],[1,"\\n"],[10,"dt"],[12],[1,"ConcretePrototype"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Implements an operation for cloning that object."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Client"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Creates a new object by asking the prototype to clone itself."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h3"],[14,1,"object-oriented-implemetation"],[12],[1,"Object Oriented Implemetation"],[13],[1,"\\n"],[10,2],[12],[1,"For our example implementation we are on Camino and build a\\ntrainings academy for new troopers. When itâs time for new troopers, we clone\\nfrom alreay existing ones and let them grow - â"],[10,"em"],[12],[1,"begun the clone war has"],[13],[1,"â (Yoda)."],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hL31IWD133rtlsB0Itlmj0ZLW-nM6F0YGki7X9bq7JgJB9aiHSH_TsgtIwMN8fxoIDvxoKkJ5KI75Aky2zI3G38Ujp14jKpw0WdD6Zj6y_PSdN5SX9pDPpLRWTjrmWFv9uuiviOkRMjjDMj5U3_swlkxUbaNCej7-TtyEhSLT0hKHVmdwsQA5qXHjk3GR8IvHoaRJ8d1XFD5GVcTMGigvnophPKbdRWXzH4JakPhvPk0ho6o_aKg42XGbri77jF73vzmFyhdUgmF9x_5X0uU5-hRnsdS8Fd3CyRw3G00"]],null],[10,2],[12],[1,"A trooper can be cloned and shoot (and always ever miss)."],[13],[1,"\\n"],[10,"h3"],[14,1,"declarative-implementation"],[12],[1,"Declarative Implementation"],[13],[1,"\\n"],[10,2],[12],[1,"We bend the vocabulary a little in the terms, that the "],[10,"em"],[12],[1,"prototype"],[13],[1," interface is\\nrepresented as a component, that "],[10,"em"],[12],[1,"clones"],[13],[1," in the concrete component depending\\non some business logic. The class figures out, which component to "],[10,"em"],[12],[1,"clone"],[13],[1," and\\nthe actual cloning process is invoking that component with the respective\\narguments from the template. The participants vary from the imperative\\nimplementation:"],[13],[1,"\\n"],[10,"dl"],[12],[1,"\\n"],[10,"dt"],[12],[1,"Prototype"],[13],[1,"\\n"],[10,"dd"],[12],[1,"A component knowning which concrete component to clone (based on business\\nlogic)."],[13],[1,"\\n"],[10,"dt"],[12],[1,"ConcretePrototype"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Specific component that will be copied over."],[13],[1,"\\n"],[10,"dt"],[12],[1,"Client"],[13],[1,"\\n"],[10,"dd"],[12],[1,"Template or another component invoking the prototype component."],[13],[1,"\\n"],[13],[1,"\\n"],[10,2],[12],[1,"As an example, the trainings academy shows dashboards for their education\\nprogram. One piece of that is to display the profile of a trooper to showcase\\nthe skills and experience he achieved (so we can asure, he never\\nactually hit anything during his training). For that profile component, we expect\\nthe "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"Trooper"],[13],[13],[1," (from above) being passed in as an argument:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-ts"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"// components/trooper-profile/component.ts"],[13],[1,"\\n\\n"],[10,1],[14,0,"hljs-comment"],[12],[1,"// we\'ll export this interface as we expect sub-components to use it for their args, too."],[13],[1,"\\n"],[10,1],[14,0,"hljs-keyword"],[12],[1,"export"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"interface"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"TrooperProfileArgs"],[13],[1," {\\n "],[10,1],[14,0,"hljs-attr"],[12],[1,"trooper"],[13],[1,": "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Trooper"],[13],[1,";\\n}\\n\\n"],[10,1],[14,0,"hljs-keyword"],[12],[1,"export"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"default"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"class"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"TrooperProfileComponent"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"extends"],[13],[1," "],[10,1],[14,0,"hljs-title class_ inherited__"],[12],[1,"Component"],[13],[1,"<"],[10,1],[14,0,"hljs-title class_"],[12],[1,"TrooperProfileArgs"],[13],[1,"> {\\n "],[10,1],[14,0,"hljs-attr"],[12],[1,"isTiePilot"],[13],[1,": "],[10,1],[14,0,"hljs-built_in"],[12],[1,"boolean"],[13],[1," = "],[10,1],[14,0,"hljs-literal"],[12],[1,"false"],[13],[1,";\\n\\n "],[10,1],[14,0,"hljs-title function_"],[12],[1,"constructor"],[13],[1,"("],[10,1],[14,0,"hljs-params"],[12],[1,"owner: Owner, args: TrooperProfileArgs"],[13],[1,") {\\n "],[10,1],[14,0,"hljs-variable language_"],[12],[1,"super"],[13],[1,"(owner, args);\\n\\n "],[10,1],[14,0,"hljs-comment"],[12],[1,"// here is the display logic, that determines which component later on should be cloned in"],[13],[1,"\\n "],[10,1],[14,0,"hljs-variable language_"],[12],[1,"this"],[13],[1,"."],[10,1],[14,0,"hljs-property"],[12],[1,"isTiePilot"],[13],[1," = args."],[10,1],[14,0,"hljs-property"],[12],[1,"trooper"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"instanceof"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"TiePilot"],[13],[1,";\\n }\\n}\\n"],[13],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{!-- components/trooper-profile/template.hbs --}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{#"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"if"],[13],[13],[1," this.isTiePilot}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n <TrooperProfile::TiePilot @trooper="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"trooper"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,">\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{"],[10,1],[14,0,"hljs-keyword"],[12],[1,"else"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n "],[13],[10,1],[14,0,"hljs-comment"],[12],[1,"{{!-- storm troopers are the default --}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n <TrooperProfile::StormTrooper @trooper="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"trooper"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,">\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{/"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"if"],[13],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"with the invocation:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"TrooperProfile"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"done"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"this.trooper"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1," />"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"In this case, we used the prototype pattern both on an object oriented and\\ndeclarative level. That doesnât come as a suprise, instead it is a very\\nbeneficial advancing from imperative to declarative programming and transport\\nover ideas (though it doesnât always have to be that way)."],[13],[1,"\\n"],[10,"h2"],[14,1,"discussion"],[12],[1,"Discussion"],[13],[1,"\\n"],[10,2],[12],[1,"The reason for the declarative code being named/following the prototype pattern\\nis a bit far and truly is. Itâs based on the fact an "],[10,"em"],[12],[1,"unknown"],[13],[1," component is\\ncopied into place for the actul component being invoked.\\nNaming it "],[10,"em"],[12],[1,"prototype"],[13],[1," is the most weak part of this."],[13],[1,"\\n"],[10,2],[12],[1,"Itâs also very much related to the "],[8,[39,2],null,[["@route"],["component-architecture.patterns.factory"]],[["default"],[[[[1,"Factory\\nPattern"]],[]]]]],[1,". The difference between the two are, the "],[10,"em"],[12],[1,"prototype pattern"],[13],[1,"\\nhas the logic on the class, the "],[10,"em"],[12],[1,"factory pattern"],[13],[1," has the logic on the template."],[13],[1,"\\n"],[10,"h2"],[14,1,"applicability"],[12],[1,"Applicability"],[13],[1,"\\n"],[10,2],[12],[1,"Gamma, Helm, Johnson and Vlissidies (1994, p. 118) state the applicability for\\nthe prototype pattern as âuse the Prototype pattern when a system should be\\nindependent of how products are created, composed and representedâ. Replacing\\nâproducsâ for âcomponentsâ in this example, is exaclty how this pattern can be\\napplied on a declarative level:"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Running A/B tests and show either variation and no change from the outside."],[13],[1,"\\n"],[10,"li"],[12],[1,"Quality gates in place that direct to different variations."],[13],[1,"\\n"],[10,"li"],[12],[1,"Feature switches controlling different flows."],[13],[1,"\\n"],[10,"li"],[12],[1,"Displaying data/objects but which components are responsible for it, doesnât\\nmatter from the invoking side."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"examples"],[12],[1,"Examples"],[13],[1,"\\n"],[10,2],[12],[1,"As Camino and trainings academy make up a very nice way to demonstrate this,\\nthis section focuses on some more real-world examples."],[13],[1,"\\n"],[10,"h3"],[14,1,"experiments"],[12],[1,"Experiments"],[13],[1,"\\n"],[10,2],[12],[1,"As mentioned in the "],[10,3],[14,6,"#applicability"],[12],[1,"applicability"],[13],[1," section above, running A/B\\ntests is what happens very frequently these days. We create the code for all the\\nvariations and want to be able to delete code for all loosing variants\\nafterwards. Using a prototype pattern here to invoke the concrete component for\\nthat particular variant is a perfect fit for this situation as most of the time\\nthe the variant and the component to that are unknown upfront."],[13],[1,"\\n"],[10,2],[12],[1,"In this example we are running an A/B tests for a login form. The tests contains\\nan experiment and a control variation. We do have an experiment service from\\nwhich we can retrieve the variation for the current visitor."],[13],[1,"\\n"],[10,2],[12],[1,"At first the class of the component will call the experiment service to\\ndetermine the variation for the running experiment. Since this is the initial\\nstate of the component, we will set it in the constructor."],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-ts"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"// components/login-form/component.ts"],[13],[1,"\\n"],[10,1],[14,0,"hljs-keyword"],[12],[1,"interface"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"LoginFormArgs"],[13],[1," {\\n "],[10,1],[14,0,"hljs-attr"],[12],[1,"done"],[13],[1,": "],[10,1],[14,0,"hljs-function"],[12],[1,"() =>"],[13],[1," "],[10,1],[14,0,"hljs-built_in"],[12],[1,"void"],[13],[1,";\\n}\\n\\n"],[10,1],[14,0,"hljs-keyword"],[12],[1,"export"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"default"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"class"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"LoginFormComponent"],[13],[1," "],[10,1],[14,0,"hljs-keyword"],[12],[1,"extends"],[13],[1," "],[10,1],[14,0,"hljs-title class_ inherited__"],[12],[1,"Component"],[13],[1,"<"],[10,1],[14,0,"hljs-title class_"],[12],[1,"LoginFormArgs"],[13],[1,"> {\\n "],[10,1],[14,0,"hljs-attr"],[12],[1,"experiment"],[13],[1,": "],[10,1],[14,0,"hljs-built_in"],[12],[1,"boolean"],[13],[1," = "],[10,1],[14,0,"hljs-literal"],[12],[1,"false"],[13],[1,";\\n\\n "],[10,1],[14,0,"hljs-title function_"],[12],[1,"constructor"],[13],[1,"("],[10,1],[14,0,"hljs-params"],[12],[1,"owner: Owner, args: LoginFormArgs"],[13],[1,") {\\n "],[10,1],[14,0,"hljs-variable language_"],[12],[1,"super"],[13],[1,"(owner, args);\\n\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"const"],[13],[1," experimentsService = owner."],[10,1],[14,0,"hljs-title function_"],[12],[1,"lookup"],[13],[1,"("],[10,1],[14,0,"hljs-string"],[12],[1,"\\"service:experiments\\""],[13],[1,");\\n "],[10,1],[14,0,"hljs-variable language_"],[12],[1,"this"],[13],[1,"."],[10,1],[14,0,"hljs-property"],[12],[1,"experiment"],[13],[1," =\\n experimentsService."],[10,1],[14,0,"hljs-title function_"],[12],[1,"getVariation"],[13],[1,"("],[10,1],[14,0,"hljs-string"],[12],[1,"\\"login-form\\""],[13],[1,") === "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"experiment\\""],[13],[1,";\\n }\\n}\\n"],[13],[13],[1,"\\n"],[10,2],[12],[1,"Once we know, we instruct the template to "],[10,"em"],[12],[1,"copy over"],[13],[1," the selected variation:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"hljs-comment"],[12],[1,"{{! components/login-form/template.hbs }}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{#"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"if"],[13],[13],[1," this.experiment}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n <LoginForm::Experimental @done="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"done"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," />\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{"],[10,1],[14,0,"hljs-keyword"],[12],[1,"else"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n <LoginForm::Control @done="],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{@"],[10,1],[14,0,"hljs-name"],[12],[1,"done"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1," />\\n"],[13],[10,1],[14,0,"hljs-template-tag"],[12],[1,"{{/"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"if"],[13],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"wi
49th the invocation:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"LoginForm"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"done"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[1,"this.goToDashboard"],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1," />"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"From the invocation side, itâs unknown which variation will be displayed and\\nthatâs totally fine. We donât make the code on this side dependent on which\\nvariation it will be, this responsibility is passed to the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<LoginForm>"],[13],[13],[1,"\\ncomponent, which is the perfect owner for this. From the invocation side, it\\nfeels like, the concrete component got cloned into the view."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,3],[[24,0,"references"]],null,[["default"],[[[[1,"\\n"],[8,[30,2,["WebPage"]],null,[["@title","@url"],["Prototype","https://refactoring.guru/design-patterns/prototype"]],[["default"],[[[[1,"\\n"],[8,[30,3,["Author"]],null,[["@given","@family"],["Alexander","Shvets"]],null],[1,"\\n"]],[3]]]]],[1,"\\n\\n"],[8,[30,2,["Book"]],null,[["@title","@publisher","@year"],["Design Patterns","Addison-Wesley","1994"]],[["default"],[[[[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["Erich","Gamma"]],null],[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["Richard","Helm"]],null],[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["Ralph","Johnson"]],null],[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["John","Vlissides"]],null],[1,"\\n"]],[4]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","l","r","r"],false,["article","diagram","link-to","references"]]',moduleName:"ember-handbook/component-architecture/patterns/prototype/template.hbs",isStrictMode:!1}) 50e.default=n})),define("ember-handbook/component-architecture/patterns/strategy/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 51var n=(0,t.createTemplateFactory)({id:"j8gdLXsj",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Strategy%20Pattern%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Intent%22%2C%22slug%22%3A%22intent%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Structure%22%2C%22slug%22%3A%22structure%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Object%20Oriented%20Way%22%2C%22slug%22%3A%22object-oriented-way%22%2C%22lvl%22%3A3%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Declarative%20Way%22%2C%22slug%22%3A%22declarative-way%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Combination%20of%20Both%20Ways%22%2C%22slug%22%3A%22comb
51ination-of-both-ways%22%2C%22lvl%22%3A3%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Applicability%22%2C%22slug%22%3A%22applicability%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A6%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"intent"],[12],[1,"Intent"],[13],[1,"\\n"],[10,2],[12],[1,"The strategy pattern is a family of algorithms, each one encapsualted and by\\nthat interchangeable to the receivers (Gamma, Helm, Johnson & Vlissides, 1994,\\np. 315; Shvets, n.d.)."],[13],[1,"\\n"],[10,"h2"],[14,1,"structure"],[12],[1,"Structure"],[13],[1,"\\n"],[10,2],[12],[1,"The strategy interface defining the algorithms, a context calling the algorithms\\nof that interface implemented by a concrete strategy."],[13],[1,"\\n"],[10,"h3"],[14,1,"object-oriented-way"],[12],[1,"Object Oriented Way"],[13],[1,"\\n"],[10,2],[12],[1,"A "],[10,"code"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"Client"],[13],[13],[1," instantiates a "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"ConcreteStrategy"],[13],[13],[1," and passes it to the "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"Context"],[13],[13],[1,".\\nThe "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"Context"],[13],[13],[1," is receving any "],[10,"code"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"Strategy"],[13],[13],[1," that fulfills the interface."],[13],[1,"\\n"],[8,[39,1],null,[["@src"],["https://www.plantuml.com/plantuml/svg/hO_B2i8m44NNvYi2RdHT11-RraB0ZHln0uPaBALvo6IAYlZlnbf2tRkQcSlXSAUC3CIzio9shRy2WPC6Bz1RLi7p4HpA4pO1vVaW9eos4ADyYjaUTDTGwBsfWmqavsgjAgN4h28Ajp4hDgjYNIGua47w3LzJBQ5cy8t5FwdB_DwtS9r-mZidkvIH2HYRnrQUncttATCcWYwWCSS3hS7gtgPxOO1XEQ3PgGaPCzwwgqM7dcDMY1Az-TGOvni0"]],null],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-ts"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"class"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Client"],[13],[1," {\\n "],[10,1],[14,0,"hljs-title function_"],[12],[1,"run"],[13],[1,"("],[10,1],[14,0,"hljs-params"],[12],[13],[1,") {\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"const"],[13],[1," strategy = "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"ConcreteStrategy"],[13],[1,"();\\n "],[10,1],[14,0,"hljs-keyword"],[12],[1,"const"],[13],[1," ctx = "],[10,1],[14,0,"hljs-keyword"],[12],[1,"new"],[13],[1," "],[10,1],[14,0,"hljs-title class_"],[12],[1,"Context"],[13],[1,"();\\n ctx."],[10,1],[14,0,"hljs-property"],[12],[1,"strategy"],[13],[1," = strategy;\\n }\\n}\\n"],[13],[13],[1,"\\n"],[10,"h3"],[14,1,"declarative-way"],[12],[1,"Declarative Way"],[13],[1,"\\n"],[10,2],[12],[1,"Itâs similar on a pure declarative way, where an interface describes the\\narguments to take on a component level. The client invokes a component and\\npasses in another component (the "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"ConcreteStrategy"],[13],[13],[1,") to fulfill the contract of\\narguments. To demonstrate this, typescript helps a lot:"],[13],[1,"\\n"],[8,[39,2],null,null,[["default"],[[[[1,"\\n"],[8,[30,2,["Page"]],null,[["@title"],["toggle/label/component.ts"]],[["default"],[[[[1,"\\n"],[8,[39,3],null,[["@name"],["components/examples/toggle/label/component.ts"]],null],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[8,[30,2,["Page"]],null,[["@title"],["fancy-label/component.ts"]],[["default"],[[[[1,"\\n"],[8,[39,3],null,[["@name"],["components/examples/fancy-label/component.ts"]],null],[1,"\\n"]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,2],[12],[1,"The "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"ToggleLabelComponent"],[13],[13],[1," is the "],[10,"em"],[12],[1,"default"],[13],[1," concrete strategy, implements and\\nprovies the "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"ToggleLabelArgs"],[13],[13],[1," strategy interface. The "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"FancyLabelComponent"],[13],[13],[1,"\\nimplements the same interface for the "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"args"],[13],[13],[1," and by that, makes the default\\nlabel interchangeable. Here is how to invoke it:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-hbs"],[12],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1,"<"],[10,1],[14,0,"hljs-name"],[12],[1,"Toggle"],[13],[1," @"],[10,1],[14,0,"hljs-attr"],[12],[1,"labelComponent"],[13],[1,"="],[13],[13],[10,1],[14,0,"hljs-template-variable"],[12],[1,"{{"],[10,1],[14,0,"hljs-name"],[12],[10,1],[14,0,"hljs-built_in"],[12],[1,"component"],[13],[13],[1," "],[10,1],[14,0,"hljs-string"],[12],[1,"\\"fancy-label\\""],[13],[1,"}}"],[13],[10,1],[14,0,"language-xml"],[12],[10,1],[14,0,"hljs-tag"],[12],[1," />"],[13],[1,"\\n"],[13],[13],[13],[1,"\\n"],[10,2],[12],[1,"For components we usually provide a decent default, thatâs why this component\\ncan be used without a "],[10,"code"],[12],[10,1],[14,0,"hljs-meta"],[12],[1,"@labelComponent"],[13],[13],[1," passed in but provides this option. More\\non this example can be found in the "],[8,[39,4],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"composable component type"]],[]]]]],[1,"."],[13],[1,"\\n"],[10,"h3"],[14,1,"combination-of-both-ways"],[12],[1,"Combination of Both Ways"],[13],[1,"\\n"],[10,2],[12],[1,"Combining the object oriented and declarative way can extend the usefulness of\\nthis pattern. Instead of passing in a component as another strategy, swapping in\\na javascript object c
51ontaining algorithms for business logic. This way, UI and\\nbusiness logic/flows can be separated and be interchangeable."],[13],[1,"\\n"],[10,"h2"],[14,1,"applicability"],[12],[1,"Applicability"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,5],[[24,0,"references"]],null,[["default"],[[[[1,"\\n"],[8,[30,3,["WebPage"]],null,[["@title","@url"],["Builder","https://refactoring.guru/design-patterns/strategy"]],[["default"],[[[[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["Alexander","Shvets"]],null],[1,"\\n"]],[4]]]]],[1,"\\n\\n"],[8,[30,3,["Book"]],null,[["@title","@publisher","@year"],["Design Patterns","Addison-Wesley","1994"]],[["default"],[[[[1,"\\n"],[8,[30,5,["Author"]],null,[["@given","@family"],["Erich","Gamma"]],null],[1,"\\n"],[8,[30,5,["Author"]],null,[["@given","@family"],["Richard","Helm"]],null],[1,"\\n"],[8,[30,5,["Author"]],null,[["@given","@family"],["Ralph","Johnson"]],null],[1,"\\n"],[8,[30,5,["Author"]],null,[["@given","@family"],["John","Vlissides"]],null],[1,"\\n"]],[5]]]]],[1,"\\n"]],[3]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","tabs","l","r","r"],false,["article","diagram","tabs","code-snippet","link-to","references"]]',moduleName:"ember-handbook/component-architecture/patterns/strategy/template.hbs",isStrictMode:!1}) 52e.default=n})),define("ember-handbook/component-architecture/patterns/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 53var n=(0,t.createTemplateFactory)({id:"Ri4U8/4z",block:'[[[1,[28,[35,0],["Patterns"],null]],[1,"\\n"],[46,[28,[37,2],null,null],null,null,null]],[],false,["page-title","component","-outlet"]]',moduleName:"ember-handbook/component-architecture/patterns/template.hbs",isStrictMode:!1}) 54e.default=n})),define("ember-handbook/component-architecture/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 55e.default={page:"_page_w9e11q",spacer:"_spacer_w9e11q"}})),define("ember-handbook/component-architecture/styling/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 56var n=(0,t.createTemplateFactory)({id:"rLwGr3Zl",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Styling%22%7D","%5B%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"tbd."],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/styling/template.hbs",isStrictMode:!1}) 57e.default=n})),define("ember-handbook/component-architecture/talk/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 58var n=(0,t.createTemplateFactory)({id:"AqdvXgkW",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%7D","%5B%7B%22content%22%3A%22Talk%22%2C%22slug%22%3A%22talk%22%2C%22lvl%22%3A1%2C%22i%22%3A0%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h1"],[14,1,"talk"],[12],[1,"Talk"],[13],[1,"\\n"],[10,2],[12],[1,"You can see the recording of talk "],[10,"strong"],[12],[1,"Component Architecture"],[13],[1," as presented at\\nEmberIgnite mini conference."],[13],[1,"\\n"],[10,2],[12],[10,3],[14,6,"https://component-architecture-slides.netlify.app/"],[12],[1,"Slides for Component\\nArchitecture"],[13],[1," are also\\navailable."],[13],[1,"\\n"],[10,2],[12],[1,"Part 1:"],[13],[1,"\\n"],[10,"iframe"],[14,"width","560"],[14,"height","315"],[14,"src","https://www.youtube.com/embed/uTFxv0kReYk"],[14,"title","YouTube video player"],[14,"frameborder","0"],[14,"allow","accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"],[14,"allowfullscreen",""],[12],[13],[1,"\\n"],[10,2],[12],[1,"Part 2:"],[13],[1,"\\n"],[10,"iframe"],[14,"width","560"],[14,"height","315"],[14,"src","https://www.youtube.com/embed/AQ3Jwb9vGqM"],[14,"title","YouTube video player"],[14,"frameborder","0"],[14,"allow","accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"],[14,"allowfullscreen",""],[12],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art"],false,["article"]]',moduleName:"ember-handbook/component-architecture/talk/template.hbs",isStrictMode:!1}) 59e.default=n})),define("ember-handbook/component-architecture/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
59dule",{value:!0}),e.default=void 0 60var n=(0,t.createTemplateFactory)({id:"Mxuoswy+",block:'[[[1,[28,[35,0],["Component Architecture"],null]],[1,"\\n"],[8,[39,1],null,null,[["default"],[[[[1,"\\n "],[8,[30,1,["Menu"]],null,null,[["default"],[[[[1,"\\n "],[8,[30,2,["Title"]],null,[["@route"],["component-architecture.index"]],[["default"],[[[[1,"\\n Component Architecture\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.talk"]],[["default"],[[[[1,"Talk"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.haptics"]],[["default"],[[[[1,"Haptics"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.haptics.invocation"]],[["default"],[[[[1,"Invocation"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.haptics.plug-and-play"]],[["default"],[[[[1,"Plug\'n\'Play"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.haptics.blocks"]],[["default"],[[[[1,"Blocks"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Divider"]],null,null,null],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.patterns"]],[["default"],[[[[1,"Patterns"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.factory"]],[["default"],[[[[1,"Factory"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.prototype"]],[["default"],[[[[1,"Prototype"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.builder"]],[["default"],[[[[1,"Builder"]],[]]]]],[1,"\\n\\n "],[10,1],[15,0,[29,[[28,[37,2],["spacer"],[["from"],["ember-handbook/component-architecture/styles"]]]]]],[12],[13],[1,"\\n\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.decorator"]],[["default"],[[[[1,"Decorator"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.adapter"]],[["default"],[[[[1,"Adapter"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.bridge"]],[["default"],[[[[1,"Bridge"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.facade"]],[["default"],[[[[1,"Facade"]],[]]]]],[1,"\\n\\n "],[10,1],[15,0,[29,[[28,[37,2],["spacer"],[["from"],["ember-handbook/component-architecture/styles"]]]]]],[12],[13],[1,"\\n\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.command"]],[["default"],[[[[1,"Command"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.patterns.strategy"]],[["default"],[[[[1,"Strategy"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Divider"]],null,null,null],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.types"]],[["default"],[[[[1,"Types"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.types.presentational"]],[["default"],[[[[1,"Presentational"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.types.container"]],[["default"],[[[[1,"Container"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.types.provider"]],[["default"],[[[[1,"Provider"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"Composable"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.types.data-entry"]],[["default"],[[[[1,"\\n Data Entry\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Divider"]],null,null,null],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.classification"]],[["default"],[[[[1,"Classification"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.styling"]],[["default"],[[[[1,"Styling"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,[["@route"],["component-architecture.best-practices"]],[["default"],[[[[1,"Best Practices"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Divi
60der"]],null,null,null],[1,"\\n\\n "],[8,[30,2,["Chapter"]],null,null,[["default"],[[[[1,"Appendix"]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.glossary"]],[["default"],[[[[1,"Glossary"]],[]]]]],[1,"\\n "],[8,[30,2,["Section"]],null,[["@route"],["component-architecture.literature"]],[["default"],[[[[1,"Literature"]],[]]]]],[1,"\\n\\n "],[10,1],[15,0,[29,[[28,[37,2],["spacer"],[["from"],["ember-handbook/component-architecture/styles"]]]]]],[12],[13],[1,"\\n "]],[2]]]]],[1,"\\n\\n "],[8,[30,1,["Main"]],null,null,[["default"],[[[[1,"\\n "],[46,[28,[37,4],null,null],null,null,null],[1,"\\n "]],[]]]]],[1,"\\n"]],[1]]]]]],["p","m"],false,["page-title","page","local-class","component","-outlet"]]',moduleName:"ember-handbook/component-architecture/template.hbs",isStrictMode:!1}) 61e.default=n})),define("ember-handbook/component-architecture/types/composable/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 62var n=(0,t.createTemplateFactory)({id:"CmjCQxnO",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Composable%20Components%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Synopsis%22%2C%22slug%22%3A%22synopsis%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Also%20Known%20As%22%2C%22slug%22%3A%22also-known-as%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Patterns%22%2C%22slug%22%3A%22patterns%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Principles%22%2C%22slug%22%3A%22principles%22%2C%22lvl%22%3A2%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usages%22%2C%22slug%22%3A%22usages%22%2C%22lvl%22%3A2%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%22%2C%22slug%22%3A%22example%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Toggle%20Component%22%2C%22slug%22%3A%22toggle-component%22%2C%22lvl%22%3A3%2C%22i%22%3A6%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A3%2C%22i%22%3A7%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22With%20Sensible%20Defaults%22%2C%22slug%22%3A%22with-sensible-defaults%22%2C%22lvl%22%3A4%2C%22i%22%3A8%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22With%20Block%20Customization%22%2C%22slug%22%3A%22with-block-customization%22%2C%22lvl%22%3A4%2C%22i%22%3A9%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22As%20Kit%22%2C%22slug%22%3A%22as-kit%22%2C%22lvl%22%3A4%2C%22i%22%3A10%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Parametrized%20with%20Custom%20Replacements%22%2C%22slug%22%3A%22parametrized-with-custom-replacements%22%2C%22lvl%22%3A4%2C%22i%22%3A11%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A12%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"synopsis"],[12],[1,"Synopsis"],[13],[1,"\\n"],[8,[39,1],null,[["@invocation","@styled","@content","@structure","@logic"],["both","optional","optional","optional","yes"]],null],[1,"\\n"],[10,"h2"],[14,1,"also-known-as"],[12],[1,"Also Known As"],[13],[1,"\\n"],[10,2],[12],[1,"High(er)-Order Components (hoc), Contextual Components"],[13],[1,"\\n"],[10,"blockquote"],[12],[1,"\\n"],[10,2],[12],[1,"A higher-order component is just a function that takes an existing component\\nand returns another component that wraps it."],[13],[1,"\\n"],[10,2],[12],[10,"cite"],[12],[1,"Abramov, D. (2015a)"],[13],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"patterns"],[12],[1,"Patterns"],[13],[1,"\\n"],[10,2],[12],[1,"Combine with:"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.patterns.strategy"]],[["default"],[[[[1,"Strategy Pattern"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.patterns.builder"]],[["default"],[[[[1,"Builder Pattern"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.patterns.facade"]],[["default"],[[[[1,"Facade Pattern"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"principles"],[12],[1,"Principles"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Are concerned with "],[10,"em"],[12],[1,"how things are connected"],[13],[1,"."],[13],[1,"\\n"],[10,"li"],[12],[1,"May contain both presentational and container components inside but usually\\ndonât have any DOM markup of their own except for some wrapping divs, and\\nnever have any styles."],[13],[1,"\\n"],[10,"li"],[12],[1,"Provide the data and behavior to presentational or other container components or yields it."],[13],[1,"\\n"],[10,"li"],[12],[1,"Yields components to compose them your own way."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"usages"],[12],[1,"Usages"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[10,"strong"],[12],[1,"Composite"],[13],[1," (inline/block): Connects internal
62components together"],[13],[1,"\\n"],[10,"li"],[12],[10,"strong"],[12],[1,"Kit"],[13],[1," (block only): Yields a construction kit"],[13],[1,"\\n"],[10,"li"],[12],[10,"strong"],[12],[1,"Chameleon"],[13],[1,":\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Inline (Composite) - sensible default"],[13],[1,"\\n"],[10,"li"],[12],[1,"Block (Kit) - customizer kit"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"example"],[12],[1,"Example"],[13],[1,"\\n"],[10,2],[12],[1,"To demonstrate, the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<Toggle>"],[13],[13],[1,"\\nexample from Camba (2017) is been used. His talk is highly recommend to watch!"],[13],[1,"\\n"],[10,"h3"],[14,1,"toggle-component"],[12],[1,"Toggle Component"],[13],[1,"\\n"],[10,2],[12],[1,"The toggle component consists of a label and switch component. See the folder\\nstructure for more information:"],[13],[1,"\\n"],[10,"pre"],[12],[10,"code"],[14,0,"hljs language-txt"],[12],[1,"toggle/\\n label/\\n template.hbs\\n switch/\\n template.hbs\\n component.ts\\n template.hbs\\n"],[13],[13],[1,"\\n"],[10,2],[12],[1,"And the code for each file:"],[13],[1,"\\n"],[8,[39,3],null,null,[["default"],[[[[1,"\\n "],[8,[30,2,["Tab"]],null,[["@label"],["template.hbs"]],[["default"],[[[[1,"\\n "],[8,[39,4],null,[["@name"],["components/examples/toggle/template.hbs"]],null],[1,"\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Tab"]],null,[["@label"],["component.ts"]],[["default"],[[[[1,"\\n "],[8,[39,4],null,[["@name"],["components/examples/toggle/component.ts"]],null],[1,"\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Tab"]],null,[["@label"],["label/template.hbs"]],[["default"],[[[[1,"\\n "],[8,[39,4],null,[["@name"],["components/examples/toggle/label/index.hbs"]],null],[1,"\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Tab"]],null,[["@label"],["switch/template.hbs"]],[["default"],[[[[1,"\\n "],[8,[39,4],null,[["@name"],["components/examples/toggle/switch/index.hbs"]],null],[1,"\\n "]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,"h3"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[10,2],[12],[1,"Contextual components allow a variety of usages. They are showcased and\\nexplained in this section."],[13],[1,"\\n"],[10,"h4"],[14,1,"with-sensible-defaults"],[12],[1,"With Sensible Defaults"],[13],[1,"\\n"],[10,2],[12],[1,"Using a component inline is its bare usage and applies the most default\\nassumptions of the component author."],[13],[1,"\\n"],[8,[39,5],null,[["@demo"],["types/composable/toggle/default"]],null],[1,"\\n"],[10,"h4"],[14,1,"with-block-customization"],[12],[1,"With Block Customization"],[13],[1,"\\n"],[10,2],[12],[1,"Block usage let you modify the "],[10,"em"],[12],[1,"main"],[13],[1," part of the component."],[13],[1,"\\n"],[8,[39,5],null,[["@demo"],["types/composable/toggle/block-customization"]],null],[1,"\\n"],[10,"h4"],[14,1,"as-kit"],[12],[1,"As Kit"],[13],[1,"\\n"],[10,2],[12],[1,"At this point, the component turns into a\\n"],[8,[39,2],null,[["@route"],["component-architecture.types.provider"]],[["default"],[[[[1,"provider\\ncomponent"]],[]]]]],[1,". By yielding blocks you can\\n"],[8,[39,2],null,[["@route"],["component-architecture.patterns.builder"]],[["default"],[[[[1,"build\\n"]],[]]]]],[1," the UI yourself but the contextual component keeps the logic."],[13],[1,"\\n"],[8,[39,5],null,[["@demo"],["types/composable/toggle/builder"]],null],[1,"\\n"],[10,"h4"],[14,1,"parametrized-with-custom-replacements"],[12],[1,"Parametrized with Custom Replacements"],[13],[1,"\\n"],[10,2],[12],[1,"For more customizations use the "],[8,[39,2],null,[["@route"],["component-architecture.patterns.decorator"]],[["default"],[[[[1,"decorator pattern"]],[]]]]],[1," to\\nwrap the original component (or create a new one) and\\npass that component as an argument into the contextual component as its "],[8,[39,2],null,[["@route"],["component-architecture.patterns.strategy"]],[["default"],[[[[1,"strategy"]],[]]]]],[1,". It will now\\nyield your own component but connected to the logic of the contextual component."],[13],[1,"\\n"],[8,[39,3],null,null,[["default"],[[[[1,"\\n "],[8,[30,3,["Tab"]],null,[["@label"],["fancy-label/template.hbs"]],[["default"],[[[[1,"\\n "],[8,[39,4],null,[["@name"],["components/examples/fancy-label/template.hbs"]],null],[1,"\\n "]],[]]]]],[1,"\\n"]],[3]]]]],[1,"\\n"],[10,2],[12],[1,"Put into the example:"],[13],[1,"\\n"],[8,[39,5],null,[["@demo"],["types/composable/toggle/parametrized"]],null],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,6],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,4,["BlogPost"]],null,[["@title","@year","@url"],["Presentational and Container Components","2015","https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0"]],[["default"],[[[[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[5]]]]],[1,"\\n\\n "],[8,[30,4,["BlogPost"]],null,[["@title","@year","@url"],["Mixins Are Dead. Long Live Composition","2015","https://medium.com/@dan_abramov/mixins-are-dead-long-live-higher-order-components-94a0d2f9e750"]],[["default"],[[[[1,"\\n "],[8,[30,6,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[6]]]]],[1,"\\n\\n "],[8,[30,4,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Composable Components","2015","Video File","EmberCamp London 2015","https://www.youtube.com/watch?v=6N4qsO22fmw"]],[["default"],[[[[1,"\\n "],[8,[30,7,["Author"]],null,[["@given","@family"],["Miguel","Camba"]],null],[1,"\\n "]],[7]]]]],[1,"\\n\\n "],[8,[30,4,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Higher Order Components","2017","Video File","EmberConf 2017","https://www.youtube.com/watch?v=MpFudGJn2J0"]
62],[["default"],[[[[1,"\\n "],[8,[30,8,["Author"]],null,[["@given","@family"],["Miguel","Camba"]],null],[1,"\\n "]],[8]]]]],[1,"\\n\\n "],[8,[30,4,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Building Better Components","2019","Video File","EmberConf 2019","https://www.youtube.com/watch?v=Kyd2mQpR_9c"]],[["default"],[[[[1,"\\n "],[8,[30,9,["Author"]],null,[["@given","@family"],["Dianne","Eramo"]],null],[1,"\\n "]],[9]]]]],[1,"\\n\\n "],[8,[30,4,["BlogPost"]],null,[["@title","@year","@url"],["Higher-Order Components in Ember.js","2018","https://v4.chriskrycho.com/2018/higher-order-components-in-emberjs.html"]],[["default"],[[[[1,"\\n "],[8,[30,10,["Author"]],null,[["@given","@family"],["Chris","Krycho"]],null],[1,"\\n "]],[10]]]]],[1,"\\n\\n "],[8,[30,4,["BlogPost"]],null,[["@title","@year","@url"],["Components patterns in Ember.js","2018","https://medium.com/macsour/components-patterns-in-ember-js-5e6fc6eea28f"]],[["default"],[[[[1,"\\n "],[8,[30,11,["Author"]],null,[["@given","@family"],["Maciej","KwaÅniak"]],null],[1,"\\n "]],[11]]]]],[1,"\\n"]],[4]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","t","t","l","r","r","r","r","r","r","r"],false,["article","haptics","link-to","tabs","code-snippet","demo","references"]]',moduleName:"ember-handbook/component-architecture/types/composable/template.hbs",isStrictMode:!1}) 63e.default=n})) 64define("ember-handbook/component-architecture/types/container/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 65var n=(0,t.createTemplateFactory)({id:"kj19Ndpz",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Container%20Components%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Synopsis%22%2C%22slug%22%3A%22synopsis%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Also%20Known%20As%22%2C%22slug%22%3A%22also-known-as%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Principles%22%2C%22slug%22%3A%22principles%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Dichotomies%22%2C%22slug%22%3A%22dichotomies%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Concrete%20Containers%22%2C%22slug%22%3A%22concrete-containers%22%2C%22lvl%22%3A2%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"synopsis"],[12],[1,"Synopsis"],[13],[1,"\\n"],[8,[39,1],null,[["@invocation","@styled","@content","@structure","@logic"],["?","?","?","?","?"]],null],[1,"\\n"],[10,"h2"],[14,1,"also-known-as"],[12],[1,"Also Known As"],[13],[1,"\\n"],[10,2],[12],[1,"Wrapper"],[13],[1,"\\n"],[10,"h2"],[14,1,"principles"],[12],[1,"Principles"],[13],[1,"\\n"],[10,2],[12],[1,"Literature is fragmented, here is the summary:"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[10,"em"],[12],[1,"Some"],[13],[1," describe it as logic only"],[13],[1,"\\n"],[10,"li"],[12],[10,"em"],[12],[1,"Some"],[13],[1," describe it as a thing to structure other things on a page"],[13],[1,"\\n"],[10,"li"],[12],[1,"â¡ï¸ An arbitrary group(ing)"],[13],[1,"\\n"],[10,"li"],[12],[1,"Application/system specific"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h3"],[14,1,"dichotomies"],[12],[1,"Dichotomies"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Stateful vs. Stateless"],[13],[1,"\\n"],[10,"li"],[12],[1,"Classes vs. Functions (in React)"],[13],[1,"\\n"],[10,"li"],[12],[1,"Pure vs. Impure"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"concrete-containers"],[12],[1,"Concrete Containers"],[13],[1,"\\n"],[10,2],[12],[1,"It is far better to look at specific container component types:"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.types.provider"]],[["default"],[[[[1,"Provider"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"Composable"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[10,"li"],[12],[1,"\\n"],[8,[39,2],null,[["@route"],["component-architecture.types.data-entry"]],[["default"],[[[[1,"Data Entry"]],[]]]]],[1,"\\n"],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,3],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Container Components","2015","https://medium.com/@learnreact/container-components-c0e67432e005"]],[["default"],[[[[1,"\\n "],[8,[30,3,["Author"]],null,[["@given","@family"],["Michael","Chan"]],null],[1,"\\n "]],[3]]]]],[1,"\\n\\n "],[8,[30,2,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Making your app fast with high-performance components","2015","Video File","React.js Conf 2015","https://www.youtube.com/watch?v=KYzlpRvWZ6c&t=1351s"]],[["default"],[[[[1,"\\n "],[8,[30,4,["Author"]],null,[["@given","@family"],["Jason","Bonta"]],null],[1,"\\n "]],[4]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Presentational and Container Components","2015","https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0"]],[["default"],[[[[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[5]]]]],[1,"\\n\\n "],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Components patterns in Ember.js","2018","https://medium.com/macsour/components-patterns-in-ember-js-5e6fc6eea28f"]],[["default"],[[[[1,"\\n "],[8,[30,6,["Author"]],null,[["@given","@family"],["Maciej","KwaÅniak"]],null],[1,"\\n "]],[6]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","l","r","r","r","r"],false,["article","haptics","link-to","references"]]',moduleName:"ember-handbook/component-architecture/types/container/template.hbs",isStrictMode:!1}) 66e.default=n})),define("ember-handbook/component-architecture/types/data-entry/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esMo
66dule",{value:!0}),e.default=void 0 67var n=(0,t.createTemplateFactory)({id:"R3Ktfkre",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Data%20Entry%20Components%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Synopsis%22%2C%22slug%22%3A%22synopsis%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Principles%22%2C%22slug%22%3A%22principles%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%22%2C%22slug%22%3A%22example%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[1,"Collector & entry are a nice tandem to enter and collect data in a declarative way."],[13],[1,"\\n"],[10,"h2"],[14,1,"synopsis"],[12],[1,"Synopsis"],[13],[1,"\\n"],[8,[39,1],null,null,[["default"],[[[[1,"\\n "],[8,[30,2],null,[["@invocation","@styled","@content","@structure","@logic"],["block","yes","yes","yes","yes"]],[["default"],[[[[1,"\\n Collector\\n "]],[]]]]],[1,"\\n "],[8,[30,2],null,[["@invocation","@styled","@content","@structure","@logic"],["inline","no","no","no","no"]],[["default"],[[[[1,"\\n Entry\\n "]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,"h2"],[14,1,"principles"],[12],[1,"Principles"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Collector acquires data"],[13],[1,"\\n"],[10,"li"],[12],[1,"Collector yields entry components"],[13],[1,"\\n"],[10,"li"],[12],[1,"Entry component for declarative data input"],[13],[1,"\\n"],[10,"li"],[12],[1,"Collector can yield and/or display data"],[13],[1,"\\n"],[10,"li"],[12],[1,"Data up instead of down"],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"example"],[12],[1,"Example"],[13],[1,"\\n"],[10,2],[12],[1,"The "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<LeafletMap>"],[13],[13],[1," by "],[10,"code"],[12],[10,1],[14,0,"hljs-attribute"],[12],[1,"ember-leaflet"],[13],[13],[1," addon is a very nice example of a data entry\\ncomponent type."],[13],[1,"\\n"],[10,"h3"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[8,[39,2],null,[["@demo"],["types/data-entry/map"]],null],[1,"\\n\\n "]],[]]]]],[1,"\\n \\n "]],[1]]]]],[1,"\\n "]],["art","Item"],false,["article","haptics/matrix","demo"]]',moduleName:"ember-handbook/component-architecture/types/data-entry/template.hbs",isStrictMode:!1}) 68e.default=n})),define("ember-handbook/component-architecture/types/index/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 69var n=(0,t.createTemplateFactory)({id:"P+wsjiDL",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Types%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,2],[12],[10,"strong"],[12],[1,"Types"],[13],[1," express a "],[10,"em"],[12],[1,"common, repetitive"],[13],[1," use-case, which results in a given set\\nof haptics and the possible "],[10,"em"],[12],[1,"patterns"],[13],[1," it implements."],[13],[1,"\\n"],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.types.presentational"]],[["default"],[[[[1,"Presentational"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"Make things looking good"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,1],null,[["@route"],["component-architecture.types.container"]],[["default"],[[[[1,"Container"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"An arbitrary grouping"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.types.provider"]],[["default"],[[[[1,"Provider"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Pure logic"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.types.composable"]],[["default"],[[[[1,"Composable"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Connecting things"],[13],[1,"\\n "],[13],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[1,"\\n "],[8,[39,1],null,[["@route"],["component-architecture.types.data-entry"]],[["default"],[[[[1,"Data Entry"]],[]]]]],[1,"\\n "],[13],[1,"\\n "],[10,2],[12],[1,"Data collection and presentation"],[13],[1,"\\n "],[13],[1,"\\n"],[13],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,2],[[24,0,"references"]],null,[["default"],[[[[1,"\\n"],[8,[30,2,["Video"]],null,[["@title","@year","@series","@url"],["Building Better Components","2019","EmberConf 2019","https://www.youtube.com/watch?v=Kyd2mQpR_9c"]
69],[["default"],[[[[1,"\\n"],[8,[30,3,["Author"]],null,[["@given","@family"],["Dianne","Eramo"]],null],[1,"\\n"]],[3]]]]],[1,"\\n\\n"],[8,[30,2,["BlogPost"]],null,[["@title","@year","@url"],["Components patterns in Ember.js","2018","https://medium.com/macsour/components-patterns-in-ember-js-5e6fc6eea28f"]],[["default"],[[[[1,"\\n"],[8,[30,4,["Author"]],null,[["@given","@family"],["Maciej","KwaÅniak"]],null],[1,"\\n"]],[4]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","l","r","r"],false,["article","link-to","references"]]',moduleName:"ember-handbook/component-architecture/types/index/template.hbs",isStrictMode:!1}) 70e.default=n})),define("ember-handbook/component-architecture/types/presentational/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 71var n=(0,t.createTemplateFactory)({id:"XSoENEV6",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Presentational%20Component%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Synopsis%22%2C%22slug%22%3A%22synopsis%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Principles%22%2C%22slug%22%3A%22principles%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%22%2C%22slug%22%3A%22example%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Avatar%20Component%22%2C%22slug%22%3A%22avatar-component%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A3%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"synopsis"],[12],[1,"Synopsis"],[13],[1,"\\n"],[8,[39,1],null,[["@invocation","@styled","@content","@structure","@logic"],["both","yes","yes","no","no"]],null],[1,"\\n"],[10,"h2"],[14,1,"principles"],[12],[1,"Principles"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[1,"Are concerned with "],[10,"em"],[12],[1,"how things look"],[13],[1,"."],[13],[1,"\\n"],[10,"li"],[12],[1,"Are isolated, have no dependencies to the rest of the app."],[13],[1,"\\n"],[10,"li"],[12],[1,"Arenât responsible for data loading or mutating."],[13],[1,"\\n"],[10,"li"],[12],[1,"Receive data and callbacks exclusively via arguments."],[13],[1,"\\n"],[10,"li"],[12],[1,"Rarely have their own state - can only be UI state."],[13],[1,"\\n"],[10,"li"],[12],[1,"Render as minimal elements as possible."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"example"],[12],[1,"Example"],[13],[1,"\\n"],[10,2],[12],[1,"Presentational components take "],[10,"em"],[12],[1,"explicit"],[13],[1," and "],[10,"em"],[12],[1,"direct"],[13],[1," arguments and display them, as\\nsuch they donât take object (domain objects) and display properties."],[13],[1,"\\n"],[10,"h3"],[14,1,"avatar-component"],[12],[1,"Avatar Component"],[13],[1,"\\n"],[10,2],[12],[1,"The example is an avatar component that takes an url to an image as argument and\\npresents it in a circle with a border."],[13],[1,"\\n"],[8,[39,2],null,null,[["default"],[[[[1,"\\n "],[8,[30,2,["Tab"]],null,[["@label"],["template.hbs"]],[["default"],[[[[1,"\\n "],[8,[39,3],null,[["@name"],["components/examples/avatar/template.hbs"]],null],[1,"\\n "]],[]]]]],[1,"\\n\\n "],[8,[30,2,["Tab"]],null,[["@label"],["styles.css"]],[["default"],[[[[1,"\\n "],[8,[39,3],null,[["@name"],["components/examples/avatar/styles.css"]],null],[1,"\\n "]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,"h3"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[10,2],[12],[1,"Invoke the component with and pass down explicitely the arguments it needs to render."],[13],[1,"\\n"],[8,[39,4],null,[["@demo"],["types/presentational/avatar"]],null],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,5],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,3,["BlogPost"]],null,[["@title","@year","@url"],["Presentational and Container Components","2015","https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0"]],[["default"],[[[[1,"\\n "],[8,[30,4,["Author"]],null,[["@given","@family"],["Dan","Abramov"]],null],[1,"\\n "]],[4]]]]],[1,"\\n\\n "],[8,[30,3,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Building Better Components","2019","Video File","EmberConf 2019","https://www.youtube.com/watch?v=Kyd2mQpR_9c"]
71],[["default"],[[[[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Dianne","Eramo"]],null],[1,"\\n "]],[5]]]]],[1,"\\n\\n "],[8,[30,3,["BlogPost"]],null,[["@title","@year","@url"],["Introducing the Single Element Pattern","2018","https://www.freecodecamp.org/news/introducing-the-single-element-pattern-dfbd2c295c5d/"]],[["default"],[[[[1,"\\n "],[8,[30,6,["Author"]],null,[["@given","@family"],["Diego","Haz"]],null],[1,"\\n "]],[6]]]]],[1,"\\n\\n "],[8,[30,3,["BlogPost"]],null,[["@title","@year","@url"],["Components patterns in Ember.js","2018","https://medium.com/macsour/components-patterns-in-ember-js-5e6fc6eea28f"]],[["default"],[[[[1,"\\n "],[8,[30,7,["Author"]],null,[["@given","@family"],["Maciej","KwaÅniak"]],null],[1,"\\n "]],[7]]]]],[1,"\\n"]],[3]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","t","l","r","r","r","r"],false,["article","haptics","tabs","code-snippet","demo","references"]]',moduleName:"ember-handbook/component-architecture/types/presentational/template.hbs",isStrictMode:!1}) 72e.default=n})),define("ember-handbook/component-architecture/types/provider/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 73var n=(0,t.createTemplateFactory)({id:"PLaXlb3V",block:'[[[1,"\\n "],[8,[39,0],null,[["@data","@toc"],["%7B%22title%22%3A%22Provider%20Component%22%2C%22type%22%3A%22tech%22%7D","%5B%7B%22content%22%3A%22Synopsis%22%2C%22slug%22%3A%22synopsis%22%2C%22lvl%22%3A2%2C%22i%22%3A0%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Principles%22%2C%22slug%22%3A%22principles%22%2C%22lvl%22%3A2%2C%22i%22%3A1%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Example%22%2C%22slug%22%3A%22example%22%2C%22lvl%22%3A2%2C%22i%22%3A2%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22DataManager%20Component%22%2C%22slug%22%3A%22datamanager-component%22%2C%22lvl%22%3A3%2C%22i%22%3A3%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22Usage%22%2C%22slug%22%3A%22usage%22%2C%22lvl%22%3A3%2C%22i%22%3A4%2C%22seen%22%3A0%7D%2C%7B%22content%22%3A%22References%22%2C%22slug%22%3A%22references%22%2C%22lvl%22%3A2%2C%22i%22%3A5%2C%22seen%22%3A0%7D%5D"]],[["default"],[[[[1,"\\n "],[8,[30,1,["Header"]],null,null,null],[1,"\\n "],[8,[30,1,["Body"]],null,null,[["default"],[[[[1,"\\n "],[10,"h2"],[14,1,"synopsis"],[12],[1,"Synopsis"],[13],[1,"\\n"],[8,[39,1],null,[["@invocation","@styled","@content","@structure","@logic"],["block","no","no","no","yes"]],null],[1,"\\n"],[10,"h2"],[14,1,"principles"],[12],[1,"Principles"],[13],[1,"\\n"],[10,"ul"],[12],[1,"\\n"],[10,"li"],[12],[10,"strong"],[12],[1,"Only"],[13],[1," concerned with "],[10,"em"],[12],[1,"how things work"],[13],[1,"."],[13],[1,"\\n"],[10,"li"],[12],[1,"Contains logic."],[13],[1,"\\n"],[10,"li"],[12],[1,"Renderless."],[13],[1,"\\n"],[10,"li"],[12],[1,"Yields data and functions for further interaction."],[13],[1,"\\n"],[13],[1,"\\n"],[10,"h2"],[14,1,"example"],[12],[1,"Example"],[13],[1,"\\n"],[10,2],[12],[1,"Provider components are and invisible logic layer that provide you data and/or\\nmethods to operate with that."],[13],[1,"\\n"],[10,"h3"],[14,1,"datamanager-component"],[12],[1,"DataManager Component"],[13],[1,"\\n"],[10,2],[12],[1,"As an example, a very, very simple version of the "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<DataManager>"],[13],[13],[1," component\\nDesai (2017) describes in detail is been used. It takes an arbitrary list of\\nitems and will provide them in a sorted fashion."],[13],[1,"\\n"],[8,[39,2],null,null,[["default"],[[[[1,"\\n"],[8,[30,2,["Tab"]],null,[["@label"],["template.hbs"]],[["default"],[[[[1,"\\n"],[8,[39,3],null,[["@name"],["components/examples/data-manager/template.hbs"]],null],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[8,[30,2,["Tab"]],null,[["@label"],["component.ts"]],[["default"],[[[[1,"\\n"],[8,[39,3],null,[["@name"],["components/examples/data-manager/component.ts"]],null],[1,"\\n"]],[]]]]],[1,"\\n"]],[2]]]]],[1,"\\n"],[10,"h3"],[14,1,"usage"],[12],[1,"Usage"],[13],[1,"\\n"],[10,2],[12],[1,"The "],[10,"code"],[12],[10,1],[14,0,"hljs-section"],[12],[1,"<DataManager>
73"],[13],[13],[1," is invoked and "],[10,"code"],[12],[10,1],[14,0,"hljs-meta"],[12],[1,"@items"],[13],[13],[1," are passed in. In this case itâs\\ndeclarative but can also be a variable available to the template. The yielded\\n"],[10,"code"],[12],[10,1],[14,0,"hljs-class"],[12],[10,1],[14,0,"hljs-keyword"],[12],[1,"data"],[13],[13],[13],[1," variable provides access to the sorted items, that are displayed in a list."],[13],[1,"\\n"],[8,[39,4],null,[["@demo"],["types/provider/fruits"]],null],[1,"\\n\\n "]],[]]]]],[1,"\\n "],[8,[30,1,["Footer"]],null,null,[["default"],[[[[10,"h2"],[14,1,"references"],[12],[1,"References"],[13],[1,"\\n"],[8,[39,5],[[24,0,"references"]],null,[["default"],[[[[1,"\\n "],[8,[30,3,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Building Better Components","2019","Video File","EmberConf 2019","https://www.youtube.com/watch?v=Kyd2mQpR_9c"]],[["default"],[[[[1,"\\n "],[8,[30,4,["Author"]],null,[["@given","@family"],["Dianne","Eramo"]],null],[1,"\\n "]],[4]]]]],[1,"\\n\\n "],[8,[30,3,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Making your app fast with high-performance components","2015","Video File","React.js Conf 2015","https://www.youtube.com/watch?v=KYzlpRvWZ6c&t=1351s"]],[["default"],[[[[1,"\\n "],[8,[30,5,["Author"]],null,[["@given","@family"],["Jason","Bonta"]],null],[1,"\\n "]],[5]]]]],[1,"\\n\\n"],[1," "],[8,[30,3,["Video"]],null,[["@title","@year","@medium","@series","@url"],["Design Considerations for a Modern Data Table","2017","Video File","@Ember SF","https://www.youtube.com/watch?v=M6MHWgHjoJs"]],[["default"],[[[[1,"\\n "],[8,[30,6,["Author"]],null,[["@given","@family"],["Devendra","Desai"]],null],[1,"\\n "]],[6]]]]],[1,"\\n"]],[3]]]]],[1,"\\n"]],[]]]]],[1,"\\n "]],[1]]]]],[1,"\\n "]],["art","t","l","r","r","r"],false,["article","haptics","tabs","code-snippet","demo","references"]]',moduleName:"ember-handbook/component-architecture/types/provider/template.hbs",isStrictMode:!1}) 74e.default=n})),define("ember-handbook/component-architecture/types/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 75var n=(0,t.createTemplateFactory)({id:"x06NZeq9",block:'[[[1,[28,[35,0],["Types"],null]],[1,"\\n"],[46,[28,[37,2],null,null],null,null,null]],[],false,["page-title","component","-outlet"]]',moduleName:"ember-handbook/component-architecture/types/template.hbs",isStrictMode:!1}) 76e.default=n})),define("ember-handbook/component-managers/glimmer",["exports","@glimmer/component/-private/ember-component-manager"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/-dynamic-element-alt",["exports","@glimmer/component"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 77class n extends t.default{}e.default=n})),define("ember-handbook/components/-dynamic-element",["exports","@glimmer/component"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 78class n extends t.default{}e.default=n})),define("ember-handbook/components/array-path-layer",["exports","ember-leaflet/components/array-path-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/article/body/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 79var n=(0,t.createTemplateFactory)({id:"HJ0QLg91",block:'[[[11,0],[24,0,"text"],[24,"itemprop","articleBody"],[17,1],[12],[1,"\\n "],[18,2,null],[1,"\\n"],[13]],["&attrs","&default"],false,["yield"]]',moduleName:"ember-handbook/components/article/body/template.hbs",isStrictMode:!1}) 80e.default=n})),define("ember-handbook/components/article/component",["exports","@glimmer/component","slugify"],(function(e,t,n){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 81const o={tech:"TechArticle",article:"Article"} 82class l extends t.default{get meta(){return JSON.parse(decodeURIComponent(this.args.data?this.args.data:"{}"))}get title(){return this.meta.title}get slug(){return this.title?(0,n.default)(this.title,{lower:!0}):""}get toc(){return JSON.parse(decodeURIComponent(this.args.toc?this.args.toc:"{}"))}get type(){const{type:e}=this.meta 83return e&&o[e]?o[e]:o.article}}e.default=l}
83)),define("ember-handbook/components/article/footer/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 84e.default={footer:"_footer_8yns5g"}})),define("ember-handbook/components/article/footer/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 85var n=(0,t.createTemplateFactory)({id:"4IcJCla9",block:'[[[11,"footer"],[16,0,[29,["text ",[28,[37,0],["footer"],[["from"],["ember-handbook/components/article/footer/styles"]]]]]],[17,1],[12],[1,"\\n "],[18,2,null],[1,"\\n"],[13]],["&attrs","&default"],false,["local-class","yield"]]',moduleName:"ember-handbook/components/article/footer/template.hbs",isStrictMode:!1}) 86e.default=n})),define("ember-handbook/components/article/header/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 87e.default={header:"_header_1of7jz",toc:"_toc_1of7jz",title:"_title_1of7jz","level-1":"_level-1_1of7jz","level-2":"_level-2_1of7jz","level-3":"_level-3_1of7jz","level-4":"_level-4_1of7jz"}})),define("ember-handbook/components/article/header/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 88var n=(0,t.createTemplateFactory)({id:"p8kbJUbh",block:'[[[11,"header"],[16,0,[29,[[28,[37,0],["header"],[["from"],["ember-handbook/components/article/header/styles"]]]]]],[17,1],[12],[1,"\\n "],[10,0],[14,0,"text"],[12],[1,"\\n"],[41,[48,[30,6]],[[[1," "],[18,6,null],[1,"\\n"]],[]],[[[1," "],[1,[28,[35,4],[[30,2]],null]],[1,"\\n "],[10,"h1"],[14,"itemprop","name headline"],[15,1,[29,[[30,3]]]],[12],[1,[30,2]],[13],[1,"\\n"]],[]]],[1," "],[13],[1,"\\n\\n"],[41,[30,4],[[[1," "],[10,"nav"],[15,0,[29,[[28,[37,0],["toc"],[["from"],["ember-handbook/components/article/header/styles"]]]]]],[12],[1,"\\n "],[10,3],[15,0,[29,[[28,[37,0],["title"],[["from"],["ember-handbook/components/article/header/styles"]]]]]],[15,6,[29,["#",[30,3]]]],[12],[1,[30,2]],[13],[1,"\\n\\n"],[42,[28,[37,6],[[28,[37,6],[[30,4]],null]],null],null,[[[1," "],[10,3],[15,0,[29,[[28,[37,0],[[28,[37,7],["level-",[30,5,["lvl"]]],null]],[["from"],["ember-handbook/components/article/header/styles"]]]]]],[15,6,[29,["#",[30,5,["slug"]]]]],[12],[1,[30,5,["content"]]],[13],[1,"\\n"]],[5]],null],[1," "],[13],[1,"\\n"]],[]],null],[13]],["&attrs","@title","@slug","@toc","heading","&default"],false,["local-class","if","has-block","yield","page-title","each","-track-array","concat"]]',moduleName:"ember-handbook/components/article/header/template.hbs",isStrictMode:!1}) 89e.default=n})),define("ember-handbook/components/article/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 90e.default={article:"_article_cuhssu"}})),define("ember-handbook/components/article/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 91var n=(0,t.createTemplateFactory)({id:"R7ScQDSc",block:'[[[11,"article"],[16,0,[29,[[28,[37,0],["article"],[["from"],["ember-handbook/components/article/styles"]]]]]],[24,"itemprop","mainContentOfPage"],[24,"itemscope",""],[24,"itemtype","https://schema.org/Article"],[17,1],[12],[1,"\\n"],[41,[49,[30,2]],[[[1," "],[18,2,[[28,[37,4],null,[["Header","Body","Footer"],[[50,"article/header",0,null,[["toc","title","slug"],[[30,0,["toc"]],[30,0,["title"]],[30,0,["slug"]]]]],[50,"article/body",0,null,null],[50,"article/footer",0,null,null]]]]]],[1,"\\n"]],[]],[[[1," "],[8,[39,6],null,[["@toc","@title","@slug"],[[30,0,["toc"]],[30,0,["title"]],[30,0,["slug"]]]],null],[1,"\\n "],[8,[39,7],null,null,[["default"],[[[[1,"\\n "],[18,2,null],[1,"\\n "]],[]]]]],[1,"\\n"]],[]]],[13]],["&attrs","&default"],false,["local-class","if","has-block-params","yield","hash","component","article/header","article/body"]]',moduleName:"ember-handbook/components/article/template.hbs",isStrictMode:!1}) 92e.default=n})),define("ember-handbook/components/base-layer",["exports","ember-leaflet/components/base-layer"],(function(e,t){Object.defineProperty(e,"__esMo
92dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/circle-layer",["exports","ember-leaflet/components/circle-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/circle-marker-layer",["exports","ember-leaflet/components/circle-marker-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/code-snippet/component",["exports","@ember-handbook/resources/components/code-snippet/component"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/code-snippet/template",["exports","@ember-handbook/resources/components/code-snippet/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/composite/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 93var n=(0,t.createTemplateFactory)({id:"Xqq3gU0X",block:'[[[44,[[28,[37,1],[[30,1],"-layout"],null]],[[[1," "],[8,[30,2],[[17,3]],null,[["default"],[[[[1,"\\n "],[18,5,[[30,4]]],[1,"\\n "]],[4]]]]],[1,"\\n"]],[2]]]],["@layout","Layout","&attrs","l","&default"],false,["let","concat","yield"]]',moduleName:"ember-handbook/components/composite/template.hbs",isStrictMode:!1}) 94e.default=n})),define("ember-handbook/components/demo/component",["exports","@ember-handbook/resources/components/demo/component"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/template",["exports","@ember-handbook/resources/components/demo/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/composable/toggle/block-customization/template",["exports","@ember-handbook/resources/components/demo/types/composable/toggle/block-customization/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/composable/toggle/builder/template",["exports","@ember-handbook/resources/components/demo/types/composable/toggle/builder/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/composable/toggle/default/template",["exports","@ember-handbook/resources/components/demo/types/composable/toggle/default/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/composable/toggle/parametrized/template",["exports","@ember-handbook/resources/components/demo/types/composable/toggle/parametrized/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 95define("ember-handbook/components/demo/types/data-entry/map/template",["exports","@ember-handbook/resources/components/demo/types/data-entry/map/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/presentational/avatar/template",["exports","@ember-handbook/resources/components/demo/types/presentational/avatar/template"],(function(e,t){Object.defineProperty(e,"__esMo
95dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/demo/types/provider/fruits/template",["exports","@ember-handbook/resources/components/demo/types/provider/fruits/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/diagram/component",["exports","@ember/string","@glimmer/component","@glimmer/tracking","fetch"],(function(e,t,n,o,l){var r,a 96Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 97let i=(r=class extends n.default{constructor(e,n){var o,r,i,s 98super(e,n),o=this,r="svg",s=this,(i=a)&&Object.defineProperty(o,r,{enumerable:i.enumerable,configurable:i.configurable,writable:i.writable,value:i.initializer?i.initializer.call(s):void 0}),(0,l.default)(n.src).then((async e=>{this.svg=(0,t.htmlSafe)(await e.text())}))}},s=r.prototype,u="svg",c=[o.tracked],d={configurable:!0,enumerable:!0,writable:!0,initializer:null},p={},Object.keys(d).forEach((function(e){p[e]=d[e]})),p.enumerable=!!p.enumerable,p.configurable=!!p.configurable,("value"in p||p.initializer)&&(p.writable=!0),p=c.slice().reverse().reduce((function(e,t){return t(s,u,e)||e}),p),m&&void 0!==p.initializer&&(p.value=p.initializer?p.initializer.call(m):void 0,p.initializer=void 0),void 0===p.initializer&&(Object.defineProperty(s,u,p),p=null),a=p,r) 99var s,u,c,d,m,p 100e.default=i})),define("ember-handbook/components/diagram/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 101e.default={diagram:"_diagram_kwz4hr"}})),define("ember-handbook/components/diagram/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 102var n=(0,t.createTemplateFactory)({id:"tifVplMh",block:'[[[10,"figure"],[15,0,[29,[[28,[37,0],["diagram"],[["from"],["ember-handbook/components/diagram/styles"]]]]]],[12],[1,"\\n "],[1,[30,0,["svg"]]],[1,"\\n"],[13]],[],false,["local-class"]]',moduleName:"ember-handbook/components/diagram/template.hbs",isStrictMode:!1}) 103e.default=n})),define("ember-handbook/components/div-overlay-layer",["exports","ember-leaflet/components/div-overlay-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/avatar/template",["exports","@ember-handbook/resources/components/examples/avatar/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/card/body/template",["exports","@ember-handbook/resources/components/examples/card/body/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/card/footer/template",["exports","@ember-handbook/resources/components/examples/card/footer/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/card/header/template",["exports","@ember-handbook/resources/components/examples/card/header/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/card/template",["exports","@ember-handbook/resources/components/examples/card/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/data-manager/component",["exports","@ember-handbook/resources/components/examples/data-manager/component"],(function(e,t){Object.defineProperty(e,"__esMo
103dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/data-manager/template",["exports","@ember-handbook/resources/components/examples/data-manager/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/fancy-label/template",["exports","@ember-handbook/resources/components/examples/fancy-label/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/component",["exports","@ember-handbook/resources/components/examples/toggle/component"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/label",["exports","@ember-handbook/resources/components/examples/toggle/label"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/label/template",["exports","@ember-handbook/resources/components/examples/toggle/label/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/switch",["exports","@ember-handbook/resources/components/examples/toggle/switch"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/switch/template",["exports","@ember-handbook/resources/components/examples/toggle/switch/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/examples/toggle/template",["exports","@ember-handbook/resources/components/examples/toggle/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/geojson-layer",["exports","ember-leaflet/components/geojson-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/matrix/head/template",["exports","@ember-handbook/resources/components/haptics/matrix/head/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/matrix/item/template",["exports","@ember-handbook/resources/components/haptics/matrix/item/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/matrix/row/template",["exports","@ember-handbook/resources/components/haptics/matrix/row/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/matrix/table/template",["exports","@ember-handbook/resources/components/haptics/matrix/table/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/matrix/template",["exports","@ember-handbook/resources/components/haptics/matrix/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/haptics/template",["exports","@ember-handbook/resources/components/haptics/template"],(function(e,t){Object.defineProperty(e,"__esMo
103dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/image-layer",["exports","ember-leaflet/components/image-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/interactive-layer",["exports","ember-leaflet/components/interactive-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 104define("ember-handbook/components/leaflet-map",["exports","ember-leaflet/components/leaflet-map"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/marker-layer",["exports","ember-leaflet/components/marker-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/node",["exports","ember-composability-tools/components/node"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/page/component",["exports","@glimmer/component","@glimmer/tracking"],(function(e,t,n){var o,l 105Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 106let r=(o=class extends t.default{constructor(){var e,t,n,o 107super(...arguments),e=this,t="menu",o=this,(n=l)&&Object.defineProperty(e,t,{enumerable:n.enumerable,configurable:n.configurable,writable:n.writable,value:n.initializer?n.initializer.call(o):void 0})}},a=o.prototype,i="menu",s=[n.tracked],u={configurable:!0,enumerable:!0,writable:!0,initializer:function(){return!1}},d={},Object.keys(u).forEach((function(e){d[e]=u[e]})),d.enumerable=!!d.enumerable,d.configurable=!!d.configurable,("value"in d||d.initializer)&&(d.writable=!0),d=s.slice().reverse().reduce((function(e,t){return t(a,i,e)||e}),d),c&&void 0!==d.initializer&&(d.value=d.initializer?d.initializer.call(c):void 0,d.initializer=void 0),void 0===d.initializer&&(Object.defineProperty(a,i,d),d=null),l=d,o) 108var a,i,s,u,c,d 109e.default=r})),define("ember-handbook/components/page/main/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 110var n=(0,t.createTemplateFactory)({id:"mjkeY0ck",block:'[[[10,"main"],[12],[1,"\\n "],[18,1,null],[1,"\\n"],[13]],["&default"],false,["yield"]]',moduleName:"ember-handbook/components/page/main/template.hbs",isStrictMode:!1}) 111e.default=n})),define("ember-handbook/components/page/menu/chapter/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 112e.default={chapter:"_chapter_16navo"}})),define("ember-handbook/components/page/menu/chapter/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 113var n=(0,t.createTemplateFactory)({id:"TA9YUo4b",block:'[[[8,[39,0],[[16,0,[29,[[28,[37,1],["chapter"],[["from"],["ember-handbook/components/page/menu/chapter/styles"]]]]]],[17,1]],[["@route"],[[30,2]]],[["default"],[[[[18,3,null]],[]]]]]],["&attrs","@route","&default"],false,["page/menu/item","local-class","yield"]]',moduleName:"ember-handbook/components/page/menu/chapter/template.hbs",isStrictMode:!1}) 114e.default=n})),define("ember-handbook/components/page/menu/component",["exports","@ember/object","@glimmer/component"],(function(e,t,n){var o 115Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 116let l=(o=class extends n.default{setMenu(){this.args.page.menu=!0}},r=o.prototype,a="setMenu",i=[t.action],s=Object.getOwnPropertyDescriptor(o.prototype,"setMenu"),u=o.prototype,c={},Object.keys(s).forEach((function(e){c[e]=s[e]})),c.enumerable=!!c.enumerable,c.configurable=!!c.configurable,("value"in c||c.initializer)&&(c.writable=!0),c=i.slice().reverse().reduce((function(e,t){return t(r,a,e)||e}),c),u&&void 0!==c.initializer&&(c.value=c.initializer?c.initializer.call(u):void 0,c.initializer=void 0),void 0===c.initializer&&(Object.defineProperty(r,a,c),c=null),o) 117var r,a,i,s,u,c 118e.default=l})),define("ember-handbook/components/page/menu/divider/styles",["exports"],(function(e){Object.defineProperty(e,"__esMo
118dule",{value:!0}),e.default=void 0 119e.default={divider:"_divider_1w06or"}})),define("ember-handbook/components/page/menu/divider/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 120var n=(0,t.createTemplateFactory)({id:"MP4Iw68B",block:'[[[11,"hr"],[16,0,[29,[[28,[37,0],["divider"],[["from"],["ember-handbook/components/page/menu/divider/styles"]]]]]],[24,"data-item",""],[17,1],[12],[13]],["&attrs"],false,["local-class"]]',moduleName:"ember-handbook/components/page/menu/divider/template.hbs",isStrictMode:!1}) 121e.default=n})),define("ember-handbook/components/page/menu/item/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 122e.default={item:"_item_hgy9dr"}})),define("ember-handbook/components/page/menu/item/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 123var n=(0,t.createTemplateFactory)({id:"RTk4Rubq",block:'[[[41,[30,1],[[[1," "],[11,1],[16,0,[29,[[28,[37,1],["item"],[["from"],["ember-handbook/components/page/menu/item/styles"]]]]]],[24,"data-item",""],[17,2],[12],[1,"\\n "],[8,[39,2],null,[["@route"],[[30,1]]],[["default"],[[[[18,3,null]],[]]]]],[1,"\\n "],[13],[1,"\\n"]],[]],[[[1," "],[11,1],[16,0,[29,[[28,[37,1],["item"],[["from"],["ember-handbook/components/page/menu/item/styles"]]]]]],[24,"data-item",""],[17,2],[12],[18,3,null],[13],[1,"\\n"]],[]]]],["@route","&attrs","&default"],false,["if","local-class","link-to","yield"]]',moduleName:"ember-handbook/components/page/menu/item/template.hbs",isStrictMode:!1}) 124e.default=n})),define("ember-handbook/components/page/menu/section/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 125e.default={section:"_section_1xnfzn"}})),define("ember-handbook/components/page/menu/section/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 126var n=(0,t.createTemplateFactory)({id:"kwF3exv0",block:'[[[8,[39,0],[[16,0,[29,[[28,[37,1],["section"],[["from"],["ember-handbook/components/page/menu/section/styles"]]]]]],[17,1]],[["@route"],[[30,2]]],[["default"],[[[[18,3,null]],[]]]]]],["&attrs","@route","&default"],false,["page/menu/item","local-class","yield"]]',moduleName:"ember-handbook/components/page/menu/section/template.hbs",isStrictMode:!1}) 127e.default=n})),define("ember-handbook/components/page/menu/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 128e.default={menu:"_menu_pmkqzp",content:"_content_pmkqzp","toggle-label":"_toggle-label_pmkqzp"}})),define("ember-handbook/components/page/menu/subsection/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 129e.default={subsection:"_subsection_1rkb3k"}})),define("ember-handbook/components/page/menu/subsection/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 130var n=(0,t.createTemplateFactory)({id:"FzLaayE/",block:'[[[8,[39,0],[[16,0,[29,[[28,[37,1],["subsection"],[["from"],["ember-handbook/components/page/menu/subsection/styles"]]]]]],[17,1]],[["@route"],[[30,2]]],[["default"],[[[[18,3,null]],[]]]]]],["&attrs","@route","&default"],false,["page/menu/item","local-class","yield"]]',moduleName:"ember-handbook/components/page/menu/subsection/template.hbs",isStrictMode:!1}) 131e.default=n})),define("ember-handbook/components/page/menu/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 132var n=(0,t.createTemplateFactory)({id:"+vpQnahf",block:'[[[11,"nav"],[16,0,[29,[[28,[37,0],["menu"],[["from"],["ember-handbook/components/page/menu/styles"]]]]]],[4,[38,1],[[30,0,["setMenu"]]],null],[12],[1,"\\n "],[10,0],[15,0,[29,[[28,[37,0],["content"],[["from"],["ember-handbook/components/page/menu/styles"]]]]]],[12],[1,"\\n"],[44,[[28,[37,3],null,null]],[[[1," "],[10,"input"],[14,"data-toggle",""],[14,"data-nav",""],[14,0,"visually-hidden"],[15,1,[30,1]],[14,4,"checkbox"],[12],[13],[1,"\\n "],[10,"label"],[15,0,[29,[[28,[37,0],["toggle-label"],[["from"],["ember-handbook/components/page/menu/styles"]]]]]],[15,"for",[30,1]],[14,"aria-label","toggle menu"],[14,"data-nav",""],[12],[1,"\\n "],[10,"svg"],[14,"width","18"],[14,"height","11"],[14,"viewBox","0 0 18 11"],[14,"fill","none"],[14,"xmlns","http://www.w3.org/2000/svg","http://www.w3.org/2000/xmlns/"],[12],[1,"\\n "],[10,"path"],[14,"d","M1 1L9 9L17 1"],[14,"stroke-width","2"],[12],[13],[1,"\\n "],[13],[1,"\\n "],[13],[1,"\\n"]],[1]]],[1," "],[18,2,[[28,[37,5],null,[["Title","Chapter","Section","Subsection","Divi
132der"],[[50,"page/menu/title",0,null,null],[50,"page/menu/chapter",0,null,null],[50,"page/menu/section",0,null,null],[50,"page/menu/subsection",0,null,null],[50,"page/menu/divider",0,null,null]]]]]],[1,"\\n "],[13],[1,"\\n"],[13]],["toggleId","&default"],false,["local-class","did-insert","let","unique-id","yield","hash","component"]]',moduleName:"ember-handbook/components/page/menu/template.hbs",isStrictMode:!1}) 133e.default=n})),define("ember-handbook/components/page/menu/title/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 134e.default={title:"_title_9zmzey"}})),define("ember-handbook/components/page/menu/title/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 135var n=(0,t.createTemplateFactory)({id:"9cDF4ocC",block:'[[[8,[39,0],[[16,0,[29,[[28,[37,1],["title"],[["from"],["ember-handbook/components/page/menu/title/styles"]]]]]],[24,"itemprop","name"],[24,"data-title",""],[24,"data-nav",""],[17,1]],[["@route"],[[30,2]]],[["default"],[[[[18,3,null]],[]]]]]],["&attrs","@route","&default"],false,["page/menu/item","local-class","yield"]]',moduleName:"ember-handbook/components/page/menu/title/template.hbs",isStrictMode:!1}) 136e.default=n})),define("ember-handbook/components/page/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 137e.default={page:"_page_1h5jwb"}})),define("ember-handbook/components/page/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 138var n=(0,t.createTemplateFactory)({id:"/AIv2p9c",block:'[[[10,0],[15,0,[29,[[28,[37,0],["page"],[["from"],["ember-handbook/components/page/styles"]]]]]],[15,"data-page-menu",[30,0,["menu"]]],[14,"itemscope",""],[14,"itemtype","https://schema.org/WebPage"],[12],[1,"\\n"],[41,[49,[30,1]],[[[1," "],[18,1,[[28,[37,4],null,[["Menu","Main"],[[50,"page/menu",0,null,[["page"],[[30,0]]]],[50,"page/main",0,null,null]]]]]],[1,"\\n"]],[]],[[[1," "],[8,[39,6],null,null,[["default"],[[[[1,"\\n "],[18,1,null],[1,"\\n "]],[]]]]],[1,"\\n"]],[]]],[13]],["&default"],false,["local-class","if","has-block-params","yield","hash","component","page/main"]]',moduleName:"ember-handbook/components/page/template.hbs",isStrictMode:!1}) 139e.default=n})),define("ember-handbook/components/path-layer",["exports","ember-leaflet/components/path-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/point-path-layer",["exports","ember-leaflet/components/point-path-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/polygon-layer",["exports","ember-leaflet/components/polygon-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/polyline-layer",["exports","ember-leaflet/components/polyline-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/popup-layer",["exports","ember-leaflet/components/popup-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/portal-target",["exports","ember-stargate/components/portal-target.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/portal",["exports","ember-stargate/components/portal.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/rectangle-layer",["exports","ember-leaflet/components/rectangle-layer"],(function(e,t){Object.defineProperty(e,"__esMo
139dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 140define("ember-handbook/components/references/article/component",["exports","ember-cite/components/references/article/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/article/template",["exports","ember-cite/components/references/article/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/base/author/component",["exports","ember-cite/components/references/base/author/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/base/component",["exports","ember-cite/components/references/base/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/base/editor/component",["exports","ember-cite/components/references/base/editor/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/base/producer/component",["exports","ember-cite/components/references/base/producer/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/base/template",["exports","ember-cite/components/references/base/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/book/component",["exports","ember-cite/components/references/book/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/book/template",["exports","ember-cite/components/references/book/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/component",["exports","ember-cite/components/references/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/article/template",["exports","ember-cite/components/references/formatter/apa/article/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/book/template",["exports","ember-cite/components/references/formatter/apa/book/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/component",["exports","ember-cite/components/references/formatter/apa/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/media/component",["exports","ember-cite/components/references/formatter/apa/media/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/media/template",["exports","ember-cite/components/references/formatter/apa/media/template.js"],(function(e,t){Object.defineProperty(e,"__esMo
140dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/authors/template",["exports","ember-cite/components/references/formatter/apa/parts/authors/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/people/component",["exports","ember-cite/components/references/formatter/apa/parts/people/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/people/template",["exports","ember-cite/components/references/formatter/apa/parts/people/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/person/component",["exports","ember-cite/components/references/formatter/apa/parts/person/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/person/template",["exports","ember-cite/components/references/formatter/apa/parts/person/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/parts/source/template",["exports","ember-cite/components/references/formatter/apa/parts/source/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/template",["exports","ember-cite/components/references/formatter/apa/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/web/component",["exports","ember-cite/components/references/formatter/apa/web/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/formatter/apa/web/template",["exports","ember-cite/components/references/formatter/apa/web/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/component",["exports","ember-cite/components/references/media/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/template",["exports","ember-cite/components/references/media/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/tv-episode/component",["exports","ember-cite/components/references/media/tv-episode/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/tv-episode/template",["exports","ember-cite/components/references/media/tv-episode/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/video/component",["exports","ember-cite/components/references/media/video/component.js"],(function(e,t){Object.defineProperty(e,"__esMo
140dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/video/template",["exports","ember-cite/components/references/media/video/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 141define("ember-handbook/components/references/media/webisode/component",["exports","ember-cite/components/references/media/webisode/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/media/webisode/template",["exports","ember-cite/components/references/media/webisode/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/template",["exports","ember-cite/components/references/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/thesis/component",["exports","ember-cite/components/references/thesis/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/thesis/template",["exports","ember-cite/components/references/thesis/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/web/blog-post/component",["exports","ember-cite/components/references/web/blog-post/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/web/blog-post/template",["exports","ember-cite/components/references/web/blog-post/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/web/web-page/component",["exports","ember-cite/components/references/web/web-page/component.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/references/web/web-page/template",["exports","ember-cite/components/references/web/web-page/template.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/root",["exports","ember-composability-tools/components/root"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/stack-layout/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 142var n=(0,t.createTemplateFactory)({id:"HP0sQWpi",block:'[[[10,0],[14,0,"stack"],[12],[1,"\\n "],[18,1,null],[1,"\\n"],[13]],["&default"],false,["yield"]]',moduleName:"ember-handbook/components/stack-layout/template.hbs",isStrictMode:!1}) 143e.default=n})),define("ember-handbook/components/tabs/component",["exports","@ember/object","@ember/object/internals","@glimmer/component","@glimmer/tracking"],(function(e,t,n,o,l){var r,a 144function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function s(e,t,n,o,l){var r={} 145return Object.keys(o).forEach((function(e){r[e]=o[e]})),r.enumerable=!!r.enumerable,r.configurable=!!r.configurable,("value"in r||r.initializer)&&(r.writable=!0),r=n.slice().reverse().reduce((function(n,o){return o(e,t,n)||n}
145),r),l&&void 0!==r.initializer&&(r.value=r.initializer?r.initializer.call(l):void 0,r.initializer=void 0),void 0===r.initializer&&(Object.defineProperty(e,t,r),r=null),r}Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 146let u=(r=class extends o.default{constructor(){var e,t,o,l 147super(...arguments),i(this,"tabs",[]),e=this,t="activeTab",l=this,(o=a)&&Object.defineProperty(e,t,{enumerable:o.enumerable,configurable:o.configurable,writable:o.writable,value:o.initializer?o.initializer.call(l):void 0}),i(this,"tablist",void 0),i(this,"portal",`${(0,n.guidFor)(this)}-tablist`)}register(e){this.tabs.push(e),1===this.tabs.length&&(this.activeTab=e)}activate(e){const t=this.getTabFromEvent(e) 148t&&(this.activeTab=this.findSegment(t))}navigate(e){"ArrowRight"===e.key&&this.navigateNext(e),"ArrowLeft"===e.key&&this.navigatePrevious(e)}navigateNext(e){const t=this.getTabFromEvent(e) 149if(t){const e=this.findSegment(t),n=this.tabs.indexOf(e) 150n<this.tabs.length-1&&this.select(this.tabs[n+1])}}navigatePrevious(e){const t=this.getTabFromEvent(e) 151if(t){const e=this.findSegment(t),n=this.tabs.indexOf(e) 152n>0&&this.select(this.tabs[n-1])}}select(e){this.activeTab=e,this.getElementFromTab(e)?.focus()}getTabFromEvent(e){const t=e.target 153if(t&&"tab"===t.getAttribute("role"))return t}findSegment(e){const t=[...this.tablist.children].indexOf(e) 154return this.tabs[t]}getElementFromTab(e){return this.tablist.children[this.tabs.indexOf(e)]}},a=s(r.prototype,"activeTab",[l.tracked],{configurable:!0,enumerable:!0,writable:!0,initializer:null}),s(r.prototype,"register",[t.action],Object.getOwnPropertyDescriptor(r.prototype,"register"),r.prototype),s(r.prototype,"activate",[t.action],Object.getOwnPropertyDescriptor(r.prototype,"activate"),r.prototype),s(r.prototype,"navigate",[t.action],Object.getOwnPropertyDescriptor(r.prototype,"navigate"),r.prototype),r) 155e.default=u})),define("ember-handbook/components/tabs/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 156e.default={tabs:"_tabs_1uzuv8"}})),define("ember-handbook/components/tabs/tab/component",["exports","@ember/object/internals","@glimmer/component"],(function(e,t,n){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 157class o extends n.default{constructor(){var e,n,o 158super(...arguments),e=this,n="id",o=(0,t.guidFor)(this),n in e?Object.defineProperty(e,n,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[n]=o}get label(){return this.args.label}}e.default=o})),define("ember-handbook/components/tabs/tab/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 159e.default={content:"_content_mwnqk6"}})),define("ember-handbook/components/tabs/tab/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 160var n=(0,t.createTemplateFactory)({id:"NsoJKZWZ",block:'[[[1,[28,[35,0],[[28,[37,1],[[30,1],[30,0]],null]],null]],[1,"\\n\\n"],[8,[39,2],null,[["@target"],[[30,2]]],[["default"],[[[[1,"\\n"],[1," "],[10,"button"],[14,"role","tab"],[15,"aria-controls",[30,0,["id"]]],[15,"aria-selected",[29,[[52,[28,[37,4],[[30,3],[30,0]],null],"true","false"]]]],[15,"tabindex",[52,[28,[37,4],[[30,3],[30,0]],null],0,-1]],[12],[1,"\\n "],[1,[30,4]],[1,"\\n "],[13],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[10,"section"],[15,0,[29,[[28,[37,5],["content"],[["from"],["ember-handbook/components/tabs/tab/styles"]]]]]],[15,1,[30,0,["id"]]],[14,"role","tabpanel"],[15,"hidden",[28,[37,6],[[30,0],[30,3]],null]],[15,"aria-labelledby",[29,[[30,0,["id"]],"-label"]]],[12],[1,"\\n "],[18,5,null],[1,"\\n"],[13]],["@register","@tablist","@activeTab","@label","&default"],false,["did-insert","fn","portal","if","eq","local-class","not-eq","yield"]]',moduleName:"ember-handbook/components/tabs/tab/template.hbs",isStrictMode:!1}) 161e.default=n})),define("ember-handbook/components/tabs/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 162var n=(0,t.createTemplateFactory)({id:"8UcZtFlr",block:'[[[10,0],[15,0,[29,[[28,[37,0],["tabs"],[["from"],["ember-handbook/components/tabs/styles"]]]]]],[12],[1,"\\n "],[8,[39,1],[[24,"role","tablist"],[4,[38,2],[[28,[37,3],[[30,0],"tablist"],null]],null],[4,[38,4],["click",[30,0,["activate"]]],null],[4,[38,4],["keyup",[30,0,["navigate"]]],null]],[["@name","@multiple"],[[30,0,["portal"]],true]],null],[1,"\\n\\n "],[18,1,[[28,[37,6],null,[["Tab"],[[50,"tabs/tab",0,null,[["register","activeTab","tablist"],[[30,0,["register"]],[30,0,["activeTab"]],[30,0,["portal"]]]]]]]]]],[1,"\\n"],[13]],["&default"],false,["local-class","portal-target","did-insert","set","on","yield","hash","component"]]',moduleName:"ember-handbook/components/tabs/template.hbs",isStrictMode:!1}) 163e.default=n})),define("ember-handbook/components/tile-layer",["exports","ember-leaflet/components/tile-layer"],(function(e,t){Object.defineProperty(e,"__esMo
163dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/tooltip-layer",["exports","ember-leaflet/components/tooltip-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/video-layer",["exports","ember-leaflet/components/video-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/components/wms-tile-layer",["exports","ember-leaflet/components/wms-tile-layer"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/-element",["exports","ember-element-helper/helpers/-element"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/and",["exports","ember-truth-helpers/helpers/and"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"and",{enumerable:!0,get:function(){return t.and}}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/app-version",["exports","@ember/component/helper","ember-handbook/config/environment","ember-cli-app-version/utils/regexp"],(function(e,t,n,o){function l(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{} 164const l=n.default.APP.version 165let r=t.versionOnly||t.hideSha,a=t.shaOnly||t.hideVersion,i=null 166return r&&(t.showExtended&&(i=l.match(o.versionExtendedRegExp)),i||(i=l.match(o.versionRegExp))),a&&(i=l.match(o.shaRegExp)),i?i[0]:l}Object.defineProperty(e,"__esModule",{value:!0}),e.appVersion=l,e.default=void 0 167var r=(0,t.helper)(l) 168e.default=r})),define("ember-handbook/helpers/assign",["exports","ember-assign-helper/helpers/assign"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"assign",{enumerable:!0,get:function(){return t.assign}}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/cancel-all",["exports","ember-concurrency/helpers/cancel-all"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/did-insert",["exports","ember-render-helpers/helpers/did-insert"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/did-update",["exports","ember-render-helpers/helpers/did-update"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/div-icon",["exports","ember-leaflet/helpers/div-icon"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"divIcon",{enumerable:!0,get:function(){return t.divIcon}})})),define("ember-handbook/helpers/element",["exports","ember-element-helper/helpers/element"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 169define("ember-handbook/helpers/ember-leaflet-assign-to",["exports","ember-leaflet/helpers/ember-leaflet-assign-to"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"emberLeafletAssignTo",{enumerable:!0,get:function(){return t.emberLeafletAssignTo}})})),define("ember-handbook/helpers/ember-leaflet-eq",["exports","ember-leaflet/helpers/ember-leaflet-eq"],(function(e,t){Object.defineProperty(e,"__esMo
169dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"emberLeafletEq",{enumerable:!0,get:function(){return t.emberLeafletEq}})})),define("ember-handbook/helpers/ember-leaflet-hash",["exports","ember-leaflet/helpers/ember-leaflet-hash"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"emberLeafletHash",{enumerable:!0,get:function(){return t.emberLeafletHash}})})),define("ember-handbook/helpers/ember-leaflet-or",["exports","ember-leaflet/helpers/ember-leaflet-or"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"emberLeafletOr",{enumerable:!0,get:function(){return t.emberLeafletOr}})})),define("ember-handbook/helpers/ensure-safe-component",["exports","@embroider/util"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.EnsureSafeComponentHelper}})})),define("ember-handbook/helpers/eq",["exports","ember-truth-helpers/helpers/equal"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"equal",{enumerable:!0,get:function(){return t.equal}})})),define("ember-handbook/helpers/format-date",["exports","ember-intl/helpers/format-date"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/format-message",["exports","ember-intl/helpers/format-message"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/format-number",["exports","ember-intl/helpers/format-number"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/format-relative",["exports","ember-intl/helpers/format-relative"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/format-time",["exports","ember-intl/helpers/format-time"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/get-code-snippet",["exports","ember-code-snippet/helpers/get-code-snippet"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/gt",["exports","ember-truth-helpers/helpers/gt"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"gt",{enumerable:!0,get:function(){return t.gt}})})),define("ember-handbook/helpers/gte",["exports","ember-truth-helpers/helpers/gte"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"gte",{enumerable:!0,get:function(){return t.gte}})})),define("ember-handbook/helpers/icon",["exports","ember-leaflet/helpers/icon"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"icon",{enumerable:!0,get:function(){return t.icon}})})),define("ember-handbook/helpers/is-array",["exports","ember-truth-helpers/helpers/is-array"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"isArray",{enumerable:!0,get:function(){return t.isArray}})})),define("ember-handbook/helpers/is-empty",["exports","ember-truth-helpers/helpers/is-empty"],(function(e,t){Object.defineProperty(e,"__esMo
169dule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/is-equal",["exports","ember-truth-helpers/helpers/is-equal"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"isEqual",{enumerable:!0,get:function(){return t.isEqual}})})),define("ember-handbook/helpers/lat-lng-bounds",["exports","ember-leaflet/helpers/lat-lng-bounds"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"latLngBounds",{enumerable:!0,get:function(){return t.latLngBounds}})})),define("ember-handbook/helpers/link",["exports","ember-link/helpers/link"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/local-class",["exports","ember-css-modules/helpers/local-class"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"localClass",{enumerable:!0,get:function(){return t.localClass}})})),define("ember-handbook/helpers/lt",["exports","ember-truth-helpers/helpers/lt"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"lt",{enumerable:!0,get:function(){return t.lt}})})),define("ember-handbook/helpers/lte",["exports","ember-truth-helpers/helpers/lte"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"lte",{enumerable:!0,get:function(){return t.lte}})})),define("ember-handbook/helpers/not-eq",["exports","ember-truth-helpers/helpers/not-equal"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"notEqualHelper",{enumerable:!0,get:function(){return t.notEqualHelper}})})),define("ember-handbook/helpers/not",["exports","ember-truth-helpers/helpers/not"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"not",{enumerable:!0,get:function(){return t.not}})})),define("ember-handbook/helpers/or",["exports","ember-truth-helpers/helpers/or"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"or",{enumerable:!0,get:function(){return t.or}})})),define("ember-handbook/helpers/page-title",["exports","ember-page-title/helpers/page-title"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 170var n=t.default 171e.default=n})),define("ember-handbook/helpers/perform",["exports","ember-concurrency/helpers/perform"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/point",["exports","ember-leaflet/helpers/point"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"point",{enumerable:!0,get:function(){return t.point}})})),define("ember-handbook/helpers/set",["exports","ember-set-helper/helpers/set"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 172define("ember-handbook/helpers/svg-jar",["exports","ember-svg-jar/utils/make-helper","ember-svg-jar/utils/make-svg"],(function(e,t,n){function o(e){try{return require(`ember-svg-jar/inlined/${e}`).default}catch(t){return null}}function l(e,t){return(0,n.default)(e,t,o)}
172Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0,e.svgJar=l 173var r=(0,t.default)(l) 174e.default=r})),define("ember-handbook/helpers/t",["exports","ember-intl/helpers/t"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/task",["exports","ember-concurrency/helpers/task"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/unique-id",["exports","ember-unique-id-helper-polyfill/helpers/unique-id"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/will-destroy",["exports","ember-render-helpers/helpers/will-destroy"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/helpers/xor",["exports","ember-truth-helpers/helpers/xor"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"xor",{enumerable:!0,get:function(){return t.xor}})})),define("ember-handbook/index/styles",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 175e.default={footer:"_footer_w0tsav"}})),define("ember-handbook/index/template",["exports","@ember/template-factory"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 176var n=(0,t.createTemplateFactory)({id:"ClBR1/HM",block:'[[[1,[28,[35,0],["Ember Handbook"],null]],[1,"\\n"],[8,[39,1],null,null,[["default"],[[[[1,"\\n "],[10,"article"],[14,0,"text"],[12],[1,"\\n "],[10,"h1"],[12],[1,"Welcome to Ember Handbook"],[13],[1,"\\n\\n "],[10,2],[12],[1,"A resource for in-depth content of selected topics"],[13],[1,"\\n\\n "],[10,"ul"],[14,0,"cards"],[12],[1,"\\n "],[10,"li"],[12],[1,"\\n "],[10,"h2"],[12],[8,[39,2],null,[["@route"],["component-architecture"]],[["default"],[[[[1,"Component Architecture"]],[]]]]],[13],[1,"\\n "],[10,2],[12],[1,"To build resilient and beautiful components"],[13],[1,"\\n "],[13],[1,"\\n "],[13],[1,"\\n "],[13],[1,"\\n"]],[]]]]],[1,"\\n\\n"],[10,"footer"],[15,0,[29,[[28,[37,3],["footer"],[["from"],["ember-handbook/index/styles"]]]]]],[12],[1,"\\n Made by\\n"],[1," "],[10,3],[14,6,"https://gos.si"],[14,"target","_blank"],[12],[1,"Thomas \'gossi\' Gossmann"],[13],[1,"\\n -\\n "],[10,3],[14,6,"https://github.com/gossi/ember-handbook"],[14,"target","_blank"],[14,"rel","noopener noreferrer"],[12],[1,"github"],[13],[1,"\\n"],[13]],[],false,["page-title","page","link-to","local-class"]]',moduleName:"ember-handbook/index/template.hbs",isStrictMode:!1}) 177e.default=n})),define("ember-handbook/initializers/app-version",["exports","ember-cli-app-version/initializer-factory","ember-handbook/config/environment"],(function(e,t,n){let o,l 178Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0,n.default.APP&&(o=n.default.APP.name,l=n.default.APP.version) 179var r={name:"App Version",initialize:(0,t.default)(o,l)} 180e.default=r})),define("ember-handbook/initializers/container-debug-adapter",["exports","ember-resolver/resolvers/classic/container-debug-adapter"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 181var n={name:"container-debug-adapter",initialize(){(arguments[1]||arguments[0]).register("container-debug-adapter:main",t.default)}} 182e.default=n})),define("ember-handbook/initializers/ensure-local-class-included",["exports","ember-css-modules/templates/static-helpers-hack"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 183var n={initialize(){}} 184e.default=n})),define("ember-handbook/initializers/export-application-global",["exports","ember","ember-handbook/config/environment"],(function(e,t,n){function o(){var e=arguments[1]||arguments[0] 185if(!1!==n.default.exportApplicationGlobal){var o 186if("undefined"!=typeof window)o=window 187else if("undefined"!=typeof global)o=global 188else{if("undefined"==typeof self)return 189o=self}var l,r=n.default.exportApplicationGlobal 190l="string"==typeof r?r:t.default.String.classify(n.default.modulePrefix),o[l]||(o[l]=e,e.reopen({willDestroy:function(){this._super.apply(this,arguments),delete o[l]}}))}}
190Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0,e.initialize=o 191var l={name:"export-application-global",initialize:o} 192e.default=l})),define("ember-handbook/initializers/install-function-helper-manager",["exports","ember-functions-as-helper-polyfill/initializers/install-function-helper-manager"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"initialize",{enumerable:!0,get:function(){return t.initialize}})})),define("ember-handbook/initializers/leaflet-assets",["exports","ember-leaflet/initializers/leaflet-assets"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"initialize",{enumerable:!0,get:function(){return t.initialize}})})),define("ember-handbook/initializers/usable-function-manager",["exports","ember-functions-as-helper-polyfill/initializers/usable-function-manager"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}}),Object.defineProperty(e,"initialize",{enumerable:!0,get:function(){return t.initialize}})})),define("ember-handbook/instance-initializers/clear-double-boot",["exports","ember-cli-fastboot/instance-initializers/clear-double-boot"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/locations/none",["exports","ember-cli-fastboot/locations/none"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/modifiers/did-insert",["exports","@ember/render-modifiers/modifiers/did-insert"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/modifiers/did-update",["exports","@ember/render-modifiers/modifiers/did-update"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/modifiers/will-destroy",["exports","@ember/render-modifiers/modifiers/will-destroy"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/resolver",["exports","ember-resolver"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 193var n=t.default 194e.default=n})),define("ember-handbook/router",["exports","@ember/routing/router","ember-handbook/config/environment"],(function(e,t,n){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 195const o=t.default.extend({location:n.default.locationType,rootURL:n.default.rootURL}) 196o.map((function(){this.route("component-architecture",(function(){this.route("talk"),this.route("haptics",(function(){this.route("invocation"),this.route("plug-and-play"),this.route("blocks")})),this.route("types",(function(){this.route("presentational"),this.route("container"),this.route("provider"),this.route("composable"),this.route("data-entry")})),this.route("patterns",(function(){this.route("factory"),this.route("prototype"),this.route("builder"),this.route("decorator"),this.route("adapter"),this.route("bridge"),this.route("facade"),this.route("command"),this.route("strategy")})),this.route("styling"),this.route("classification"),this.route("glossary"),this.route("best-practices"),this.route("literature")}))})) 197var l=o 198e.default=l})),define("ember-handbook/services/-ensure-registered",["exports","@embroider/util/services/ensure-registered"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/-portal",["exports","ember-stargate/services/-p
198ortal.js"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/ember-leaflet",["exports","ember-leaflet/services/ember-leaflet"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/fastboot",["exports","ember-cli-fastboot/services/fastboot"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/intl",["exports","ember-intl/services/intl"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/link-manager",["exports","ember-link/services/link-manager"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/page-title-list",["exports","ember-page-title/services/page-title-list"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/services/page-title",["exports","ember-page-title/services/page-title"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})) 199define("ember-handbook/styles/app",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 200e.default={}})),define("ember-handbook/styles/eca",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 201e.default={}})),define("ember-handbook/styles/foundation",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 202e.default={t1:"_t1_9nz31u",t2:"_t2_9nz31u",t3:"_t3_9nz31u",t4:"_t4_9nz31u"}})),define("ember-handbook/styles/layouts",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 203e.default={stack:"_stack_149n67"}})),define("ember-handbook/styles/references",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 204e.default={}})),define("ember-handbook/styles/utilities",["exports"],(function(e){Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0 205e.default={}})),define("ember-handbook/templates/components/link",["exports","ember-link/components/link/template"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/utils/intl/missing-message",["exports","ember-intl/-private/utils/missing-message"],(function(e,t){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.default}})})),define("ember-handbook/config/environment",[],(function(){if("undefined"!=typeof FastBoot)return FastBoot.config("ember-handbook") 206try{var e="ember-handbook/config/environment",t=document.querySelector('meta[name="'+e+'"]').getAttribute("content"),n={default:JSON.parse(decodeURIComponent(t))} 207return Object.defineProperty(n,"__esModule",{value:!0}),n}catch(o){throw new Error('Could not read config from meta tag with name "'+e+'".')}})),"undefined"==typeof FastBoot&&(runningTests||require("ember-handbook/app").default.create({name:"ember-handbook",version:"0.0.0+c6118eba"}))
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.