{"version":3,"sources":["jsdelivr-header.js","/npm/@fractal-components/toggle-button@1.1.1/src/actions/types.js","/npm/@fractal-components/toggle-button@1.1.1/src/actions/index.js","/npm/@fractal-components/toggle-button@1.1.1/src/styles/index.js","/npm/@fractal-components/toggle-button@1.1.1/src/index.js"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,mqBCNa,MAAQ,OAAO,S,yCCErB,SAAS,Q,MACL,CACH,KAAM,M,wCCFR,OAAS,CACX,MAAO,CACH,QAAS,O,YACI,OACb,OAAQ,0BACR,QAAS,E,iBACS,SAClB,MAAO,QAEX,KAAM,C,aACY,a,YACD,EACb,MAAO,OACP,SAAU,SACV,QAAS,cACT,OAAM,aAAe,MAAM,aAAa,KAAK,I,gBAC5B,O,mBACG,UACpB,QAAS,O,cACM,S,kBACI,S,eACH,C,6BACkB,MAAM,aAAa,KAC7C,IADJ,e,qBAIkB,CAClB,OAAQ,S,WACI,C,YACK,Q,YAEJ,C,mBACW,QACpB,MAAO,S,cAEI,C,mBACS,MACpB,MAAO,W,mBAIC,GACpB,OAAQ,GACR,SAAU,IC9BN,GAAO,uBAAP,GAEF,a,uBACU,G,2BACF,IAAN,MACK,MAAQ,CACT,UAAU,G,EAET,iBAAmB,IAAI,kCAAJ,8CAAA,IAA2B,CAC/C,UAAW,gCACX,QAAS,SAAS,EAAO,G,OACb,EAAO,OACN,M,YACW,EAAZ,CAAmB,UAAW,EAAM,WAE7B,C,EAQnB,wBAIA,oCAAqC,IACrC,sBAAuB,SAAA,G,MAaZ,CAAE,YAXJ,EAAM,OAIE,IAFA,IAAI,MAAM,qBAKlB,iBAAiB,EAAM,OAAS,EAAM,OAAS,OAAQ,CACpD,kBAAmB,EAAiB,6BAEvC,S,EAGT,yBAA0B,SAAA,GAAoB,EAAjB,WACd,Q,6CAKvB,OAAA,W,WAEY,EADe,KAAK,iBAAiB,mBAArC,WACA,Q,OAEJ,MAAA,cAAA,OAAK,UAAW,EAAQ,OACpB,MAAA,cAAA,OAAK,UAAW,EAAQ,M,gBACxB,MAAA,cAAA,OACI,UAAc,EAAQ,KAAb,IAAqB,EAAQ,qBAEtC,MAAA,cAAA,UACI,UACI,KAAK,MAAM,SACL,EAAO,OACP,EAAO,SAEjB,QAAS,WACL,EAAK,iBAAiB,SAAS,Q,GAGlC,KAAK,MAAM,SAAW,SAAW,aAW1C,MAAA,cAAC,iCAAD,CACI,gBAAiB,KAAK,MAAM,gBAC5B,QAAS,KAAK,MAAM,QACpB,qBAAsB,KAAK,MAAM,qBACjC,YAAa,SAAA,G,IACL,E,GACA,GAAG,KAAK,EAAK,MAAM,aACnB,EAAY,EAAK,MAAM,YAAY,OAChC,KAAI,GAAG,OAAO,EAAK,MAAM,a,MAMtB,IAAI,MAAM,6BALhB,EAAS,SAAA,GACF,EADE,CAEL,KAAM,EAAK,MAAM,a,oBAMlB,EADP,CAEI,mBAAoB,EAAK,MAAM,U,EAGvC,aAAc,KAAK,MAAM,e,KAlGlB,MAAM,WAyGjC,aAAa,UAAY,CACrB,gBAAiB,UAAU,OAAO,WAClC,QAAS,UAAU,UAAU,CACzB,UAAU,OACV,UAAU,KACV,UAAU,QACN,UAAU,UAAU,CAAC,UAAU,OAAQ,UAAU,UAGzD,qBAAsB,UAAU,OAChC,YAAa,UAAU,UAAU,CAAC,UAAU,OAAQ,UAAU,OAC9D,OAAQ,UAAU,OAClB,aAAc,UAAU,WAAW,gCAIvC,aAAa,YAAc,qC","file":"/npm/@fractal-components/toggle-button@1.1.1/dist/@fractal-components/toggle-button.cjs.js","sourceRoot":"","sourcesContent":["/**\n * Minified by jsDelivr using Terser v5.39.0.\n * Original file: /npm/@fractal-components/toggle-button@1.1.1/dist/@fractal-components/toggle-button.cjs.js\n *\n * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files\n */\n","export const CLICK = Symbol(\"CLICK\");\n","import * as actionTypes from \"./types\";\n\nexport function click() {\n    return {\n        type: actionTypes.CLICK\n    };\n}\n","import color from \"color\";\n\nconst styles = {\n    table: {\n        display: \"flex\",\n        \"flex-wrap\": \"wrap\",\n        margin: \"0.2em 0.2em 0.2em 0.2em\",\n        padding: 0,\n        \"flex-direction\": \"column\",\n        width: \"20em\"\n    },\n    cell: {\n        \"box-sizing\": \"border-box\",\n        \"flex-grow\": 1,\n        width: \"100%\",\n        overflow: \"hidden\",\n        padding: \"0.2em 0.2em\",\n        border: `solid 2px ${color(\"slategrey\").fade(0.5)}`,\n        \"border-bottom\": \"none\",\n        \"background-color\": \"#f7f7f7\",\n        display: \"flex\",\n        \"align-items\": \"center\",\n        \"justify-content\": \"center\",\n        \"&:last-child\": {\n            \"border-bottom\": `solid 2px ${color(\"slategrey\").fade(\n                0.5\n            )} !important`\n        },\n        \"&$button-container\": {\n            height: \"16.5em\",\n            \"& button\": {\n                \"font-size\": \"32px\"\n            },\n            \"& $active\": {\n                \"background-color\": \"green\",\n                color: \"white\"\n            },\n            \"& $inactive\": {\n                \"background-color\": \"red\",\n                color: \"white\"\n            }\n        }\n    },\n    \"button-container\": {},\n    active: {},\n    inactive: {}\n};\n\nexport default styles;\n","import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport {\n    ComponentManager,\n    ActionForwarder,\n    utils,\n    AppContainer,\n    AppContainerContext\n} from \"fractal-component\";\nimport * as actionTypes from \"./actions/types\";\nimport * as actions from \"./actions/index\";\nimport jss from \"jss\";\nimport jssDefaultPreset from \"jss-preset-default\";\nimport styles from \"./styles\";\n\nconst { is } = utils;\n\nclass ToggleButton extends React.Component {\n    constructor(props) {\n        super(props);\n        this.state = {\n            isActive: false\n        };\n        this.componentManager = new ComponentManager(this, {\n            namespace: \"io.github.t83714/ToggleButton\",\n            reducer: function(state, action) {\n                switch (action.type) {\n                    case actionTypes.CLICK:\n                        return { ...state, isActive: !state.isActive };\n                    default:\n                        return state;\n                }\n            },\n            /**\n             * Register actions for action serialisation / deserialisation.\n             * It's much easier to use Symbol as action type to make sure no action type collision among different component.\n             * ( Considering we now use actions as primary way for inter-component communication, it's quite important in a multicaset action environment)\n             */\n            actionTypes,\n            // --- specify accepted types of external multicast actions\n            // --- By default, component will not accept any incoming multicast action.\n            // --- No limit to actions that are sent out\n            allowedIncomingMulticastActionTypes: \"*\",\n            namespaceInitCallback: componentManager => {\n                let jssRef;\n                if (!props.styles) {\n                    // --- if use built-in style, we want to make sure this component use its own jss setting\n                    jssRef = jss.setup(jssDefaultPreset());\n                } else {\n                    jssRef = jss;\n                }\n                const styleSheet = jssRef\n                    .createStyleSheet(props.styles ? props.styles : styles, {\n                        generateClassName: componentManager.createClassNameGenerator()\n                    })\n                    .attach();\n                return { styleSheet };\n            },\n            namespaceDestroyCallback: ({ styleSheet }) => {\n                styleSheet.detach();\n            }\n        });\n    }\n\n    render() {\n        const { styleSheet } = this.componentManager.getNamespaceData();\n        const { classes } = styleSheet;\n        return (\n            <div className={classes.table}>\n                <div className={classes.cell}>ToggleButton</div>\n                <div\n                    className={`${classes.cell} ${classes[\"button-container\"]}`}\n                >\n                    <button\n                        className={\n                            this.state.isActive\n                                ? classes[\"active\"]\n                                : classes[\"inactive\"]\n                        }\n                        onClick={() => {\n                            this.componentManager.dispatch(actions.click());\n                        }}\n                    >\n                        {this.state.isActive ? \"ACTIVE\" : \"INACTIVE\"}\n                    </button>\n                </div>\n                {/*\n                    Set namespacePrefix to same as this component `namespacePrefix`\n                    so this ActionForwarder will get all incoming actions\n                    We use `this.props.namespacePrefix` & `this.props.pattern` \n                    so that `ToggleButton` can be used as generic `action transformer` later\n                    We don't need to worry if the namespace field of transformed action will match its original namespace\n                    ActionForwarder will do the query and adjust accordingly\n                */}\n                <ActionForwarder\n                    namespacePrefix={this.props.namespacePrefix}\n                    pattern={this.props.pattern}\n                    relativeDispatchPath={this.props.relativeDispatchPath}\n                    transformer={action => {\n                        let newAction;\n                        if (is.func(this.props.transformer)) {\n                            newAction = this.props.transformer(action);\n                        } else if (is.symbol(this.props.transformer)) {\n                            newAction = {\n                                ...action,\n                                type: this.props.transformer\n                            };\n                        } else {\n                            throw new Error(\"Invalid transformer type.\");\n                        }\n                        return {\n                            ...newAction,\n                            toggleButtonActive: this.state.isActive\n                        };\n                    }}\n                    appContainer={this.props.appContainer}\n                />\n            </div>\n        );\n    }\n}\n\nToggleButton.propTypes = {\n    namespacePrefix: PropTypes.string.isRequired,\n    pattern: PropTypes.oneOfType([\n        PropTypes.symbol,\n        PropTypes.func,\n        PropTypes.arrayOf(\n            PropTypes.oneOfType([PropTypes.string, PropTypes.func])\n        )\n    ]),\n    relativeDispatchPath: PropTypes.string,\n    transformer: PropTypes.oneOfType([PropTypes.symbol, PropTypes.func]),\n    styles: PropTypes.object,\n    appContainer: PropTypes.instanceOf(AppContainer)\n};\n\n// --- Define contentType allow `AppContainer` pass through React Content\nToggleButton.contextType = AppContainerContext;\n\nexport default ToggleButton;\n\nexport { actionTypes, actions };\n"]}