{"version":3,"file":"/Users/anthonygubler/development/dojo-org/widgets/src/speed-dial/index.tsx","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { create, tsx } from '@dojo/framework/core/vdom';\nimport theme from '../middleware/theme';\nimport FloatingActionButton from '../floating-action-button';\nimport * as fixedCss from './styles/speed-dial.m.css';\nimport * as css from '../theme/default/speed-dial.m.css';\nimport * as fabCss from '../theme/default/floating-action-button.m.css';\nimport { createICacheMiddleware } from '@dojo/framework/core/middleware/icache';\nimport Icon, { IconType } from '../icon';\nimport { RenderResult } from '@dojo/framework/core/interfaces';\nimport { isRenderResult } from '../common/util';\n\n// Enum used to position the action label\nexport enum LabelOrientation {\n\tbottom = 'bottom',\n\tleft = 'left',\n\tright = 'right',\n\ttop = 'top'\n}\n\nexport interface ActionProperties {\n\t/* On click callback for the action */\n\tonClick(): void;\n\t/* Title text for the action */\n\ttitle?: string;\n\t/* Orientation for the label */\n\tlabelOrientation?: LabelOrientation;\n}\n\nexport interface ActionChildren {\n\t/** The icon for the action */\n\ticon?: RenderResult;\n\t/* Static label for the action */\n\tlabel?: RenderResult;\n}\n\nconst actionFactory = create({ theme })\n\t.properties<ActionProperties>()\n\t.children<ActionChildren | [ActionChildren] | RenderResult | RenderResult[]>();\n\nexport const Action = actionFactory(function Action({\n\tproperties,\n\tid,\n\tchildren,\n\tmiddleware: { theme }\n}) {\n\tconst {\n\t\tlabelOrientation = LabelOrientation.left,\n\t\tonClick,\n\t\ttitle,\n\t\tvariant,\n\t\tclasses\n\t} = properties();\n\tconst themedCss = theme.classes(css);\n\tconst [labelChild] = children();\n\tconst labelId = `${id}-label`;\n\tconst { icon, label = undefined } = isRenderResult(labelChild)\n\t\t? { icon: labelChild }\n\t\t: labelChild;\n\n\tconst fab = (\n\t\t<FloatingActionButton\n\t\t\tsize=\"small\"\n\t\t\ttitle={title}\n\t\t\ttheme={theme.compose(\n\t\t\t\tfabCss,\n\t\t\t\tcss,\n\t\t\t\t'action'\n\t\t\t)}\n\t\t\tonClick={onClick}\n\t\t\tclasses={classes}\n\t\t\tvariant={variant}\n\t\t\taria={\n\t\t\t\tlabel\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tdescribedby: labelId\n\t\t\t\t\t  }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t>\n\t\t\t{icon}\n\t\t</FloatingActionButton>\n\t);\n\n\tif (label) {\n\t\tlet orientationClass: string | undefined;\n\t\tswitch (labelOrientation) {\n\t\t\tcase LabelOrientation.top:\n\t\t\t\torientationClass = themedCss.labelTop;\n\t\t\t\tbreak;\n\t\t\tcase LabelOrientation.right:\n\t\t\t\torientationClass = themedCss.labelRight;\n\t\t\t\tbreak;\n\t\t\tcase LabelOrientation.bottom:\n\t\t\t\torientationClass = themedCss.labelBottom;\n\t\t\t\tbreak;\n\t\t\tcase LabelOrientation.left:\n\t\t\tdefault:\n\t\t\t\torientationClass = themedCss.labelLeft;\n\t\t\t\tbreak;\n\t\t}\n\n\t\treturn (\n\t\t\t<div classes={[themedCss.labelContainer, orientationClass]} key=\"labelRoot\">\n\t\t\t\t<label classes={themedCss.label} id={labelId}>\n\t\t\t\t\t{label}\n\t\t\t\t</label>\n\t\t\t\t{fab}\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn fab;\n});\n\nexport type SpeedDialPositions =\n\t| 'bottom-right'\n\t| 'bottom-center'\n\t| 'bottom-left'\n\t| 'left-center'\n\t| 'right-center'\n\t| 'top-left'\n\t| 'top-center'\n\t| 'top-right';\n\nexport interface SpeedDialProperties {\n\t/**\n\t * Speed dial direction. Defaults to \"right\" if position is not set.\n\t * Defaults to up for bottom positions, down for top positions,\n\t * right for left-center position, and left for right-center position.\n\t */\n\tdirection?: 'up' | 'left' | 'down' | 'right';\n\t/**\n\t * Where to position the FAB. Displayed inline if not set.\n\t * Position-direction combinations other than away from an adjacent edge are not supported.\n\t */\n\tposition?: SpeedDialPositions;\n\t/** Set an initial value for the open property */\n\tinitialOpen?: boolean;\n\t/** Control the open property */\n\topen?: boolean;\n\t/** Callback when opening */\n\tonOpen?(): void;\n\t/** Callback when closed */\n\tonClose?(): void;\n\t/* transition delay for each action upon open, defaults to 30ms */\n\tdelay?: number;\n\t/* The icon type, defaults to plusIcon */\n\ticonType?: IconType;\n}\n\ninterface SpeedDialIcache {\n\tinitialOpen?: boolean;\n\topen?: boolean;\n}\n\nconst icache = createICacheMiddleware<SpeedDialIcache>();\nconst factory = create({ theme, icache }).properties<SpeedDialProperties>();\n\nexport const SpeedDial = factory(function SpeedDial({\n\tproperties,\n\tchildren,\n\tmiddleware: { theme, icache }\n}) {\n\tconst {\n\t\tinitialOpen,\n\t\tposition,\n\t\tonOpen,\n\t\tonClose,\n\t\ttheme: themeProp,\n\t\tclasses,\n\t\tvariant,\n\t\tdelay = 30,\n\t\ticonType = 'plusIcon'\n\t} = properties();\n\tconst themedCss = theme.classes(css);\n\n\tlet { open, direction } = properties();\n\n\tif (open === undefined) {\n\t\topen = icache.get('open');\n\t\tconst existingInitialOpen = icache.get('initialOpen');\n\n\t\tif (initialOpen !== existingInitialOpen) {\n\t\t\ticache.set('open', initialOpen);\n\t\t\ticache.set('initialOpen', initialOpen);\n\t\t\topen = initialOpen;\n\t\t}\n\t}\n\tlet positionClass: string | undefined;\n\tswitch (position) {\n\t\tcase 'bottom-left':\n\t\t\tpositionClass = themedCss.bottomLeft;\n\t\t\tdirection = direction || 'up';\n\t\t\tbreak;\n\t\tcase 'bottom-center':\n\t\t\tpositionClass = themedCss.bottomCenter;\n\t\t\tdirection = direction || 'up';\n\t\t\tbreak;\n\t\tcase 'left-center':\n\t\t\tpositionClass = themedCss.leftCenter;\n\t\t\tdirection = direction || 'right';\n\t\t\tbreak;\n\t\tcase 'right-center':\n\t\t\tpositionClass = themedCss.rightCenter;\n\t\t\tdirection = direction || 'left';\n\t\t\tbreak;\n\t\tcase 'top-left':\n\t\t\tpositionClass = themedCss.topLeft;\n\t\t\tdirection = direction || 'down';\n\t\t\tbreak;\n\t\tcase 'top-right':\n\t\t\tpositionClass = themedCss.topRight;\n\t\t\tdirection = direction || 'down';\n\t\t\tbreak;\n\t\tcase 'top-center':\n\t\t\tpositionClass = themedCss.topCenter;\n\t\t\tdirection = direction || 'down';\n\t\t\tbreak;\n\t\tcase 'bottom-right':\n\t\tdefault:\n\t\t\tpositionClass = themedCss.bottomRight;\n\t\t\tdirection = direction || 'up';\n\t\t\tbreak;\n\t}\n\n\tconst actions = children();\n\n\tfunction toggleOpen() {\n\t\tconst open = icache.get('open');\n\t\tif (!open) {\n\t\t\ticache.set('open', true);\n\t\t\tonOpen && onOpen();\n\t\t}\n\t}\n\n\tfunction toggleClose() {\n\t\tconst open = icache.get('open');\n\t\tif (open) {\n\t\t\ticache.set('open', false);\n\t\t\tonClose && onClose();\n\t\t}\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tkey=\"root\"\n\t\t\tclasses={[\n\t\t\t\ttheme.variant(),\n\t\t\t\tthemedCss.root,\n\t\t\t\tfixedCss.root,\n\t\t\t\tdirection === 'left' && themedCss.left,\n\t\t\t\tdirection === 'right' && themedCss.right,\n\t\t\t\tdirection === 'down' && themedCss.down,\n\t\t\t\tdirection === 'up' && themedCss.up,\n\t\t\t\tpositionClass\n\t\t\t]}\n\t\t\tonmouseleave={toggleClose}\n\t\t>\n\t\t\t<FloatingActionButton\n\t\t\t\tkey=\"trigger\"\n\t\t\t\ttheme={theme.compose(\n\t\t\t\t\tfabCss,\n\t\t\t\t\tcss,\n\t\t\t\t\t'trigger'\n\t\t\t\t)}\n\t\t\t\tonOver={toggleOpen}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tconst open = icache.get('open');\n\t\t\t\t\tif (open) {\n\t\t\t\t\t\ttoggleClose();\n\t\t\t\t\t} else {\n\t\t\t\t\t\ttoggleOpen();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tclasses={classes}\n\t\t\t\tvariant={variant}\n\t\t\t>\n\t\t\t\t<Icon\n\t\t\t\t\tsize=\"large\"\n\t\t\t\t\ttheme={themeProp}\n\t\t\t\t\ttype={iconType}\n\t\t\t\t\tclasses={classes}\n\t\t\t\t\tvariant={variant}\n\t\t\t\t/>\n\t\t\t</FloatingActionButton>\n\t\t\t<div\n\t\t\t\tkey=\"actions\"\n\t\t\t\tclasses={[themedCss.actions, open ? themedCss.open : undefined]}\n\t\t\t\tonpointerdown={toggleClose}\n\t\t\t>\n\t\t\t\t{actions.map((child, index) => {\n\t\t\t\t\tconst delayMultiplyer = open ? index : actions.length - index - 1;\n\t\t\t\t\tconst calculatedDelay = `${delayMultiplyer * delay}ms`;\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={`action-wrapper-${index}`}\n\t\t\t\t\t\t\tstyles={{ transitionDelay: calculatedDelay }}\n\t\t\t\t\t\t\tclasses={[themedCss.action, themedCss.actionTransition]}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{child}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n});\n\nexport default SpeedDial;\n"]}