@typekcz-nocobase-plugins/plugin-oidc-plus 1.0.6 → 1.0.7

package/dist/client/index.js

@@ -7,4 +7,4 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react-i18next"),require("@nocobase/plugin-auth/client"),require("@nocobase/client"),require("react-router-dom"),require("react"),require("@formily/antd-v5"),require("@formily/react"),require("@ant-design/icons"),require("antd")):"function"==typeof define&&define.amd?define("@typekcz-nocobase-plugins/plugin-oidc-plus",["react-i18next","@nocobase/plugin-auth/client","@nocobase/client","react-router-dom","react","@formily/antd-v5","@formily/react","@ant-design/icons","antd"],t):"object"==typeof exports?exports["@typekcz-nocobase-plugins/plugin-oidc-plus"]=t(require("react-i18next"),require("@nocobase/plugin-auth/client"),require("@nocobase/client"),require("react-router-dom"),require("react"),require("@formily/antd-v5"),require("@formily/react"),require("@ant-design/icons"),require("antd")):e["@typekcz-nocobase-plugins/plugin-oidc-plus"]=t(e["react-i18next"],e["@nocobase/plugin-auth/client"],e["@nocobase/client"],e["react-router-dom"],e.react,e["@formily/antd-v5"],e["@formily/react"],e["@ant-design/icons"],e.antd)}(self,function(e,t,r,o,n,i,a,c,u){return function(){"use strict";var l={482:function(e){e.exports=c},632:function(e){e.exports=i},505:function(e){e.exports=a},772:function(e){e.exports=r},689:function(e){e.exports=t},721:function(e){e.exports=u},156:function(e){e.exports=n},238:function(t){t.exports=e},128:function(e){e.exports=o}},p={};function s(e){var t=p[e];if(void 0!==t)return t.exports;var r=p[e]={exports:{}};return l[e](r,r.exports,s),r.exports}s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,{a:t}),t},s.d=function(e,t){for(var r in t)s.o(t,r)&&!s.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var d={};return!function(){s.r(d),s.d(d,{default:function(){return R},PluginOIDCClient:function(){return j}});var e=s(772),t=s(689),r=s.n(t),o="tnp_oidc_plus_logout",n=s(482),i=s(721),a=s(156),c=s.n(a),u=s(238),l="oidc";function p(t){return e.i18n.t(t,{ns:l})}function f(){return(0,u.useTranslation)(l)}var m=s(128);function y(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)e[o]=r[o]}return e}var b=function e(t,r){function o(e,o,n){if("undefined"!=typeof document){"number"==typeof(n=y({},r,n)).expires&&(n.expires=new Date(Date.now()+864e5*n.expires)),n.expires&&(n.expires=n.expires.toUTCString()),e=encodeURIComponent(e).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var i="";for(var a in n)n[a]&&(i+="; "+a,!0!==n[a]&&(i+="="+n[a].split(";")[0]));return document.cookie=e+"="+t.write(o,e)+i}}return Object.create({set:o,get:function(e){if("undefined"!=typeof document&&(!arguments.length||e)){for(var r=document.cookie?document.cookie.split("; "):[],o={},n=0;n<r.length;n++){var i=r[n].split("="),a=i.slice(1).join("=");try{var c=decodeURIComponent(i[0]);if(o[c]=t.read(a,c),e===c)break}catch(e){}}return e?o[e]:o}},remove:function(e,t){o(e,"",y({},t,{expires:-1}))},withAttributes:function(t){return e(this.converter,y({},this.attributes,t))},withConverter:function(t){return e(y({},this.converter,t),this.attributes)}},{attributes:{value:Object.freeze(r)},converter:{value:Object.freeze(t)}})}({read:function(e){return'"'===e[0]&&(e=e.slice(1,-1)),e.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(e){return encodeURIComponent(e).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}},{path:"/"});function v(e,t,r,o,n,i,a){try{var c=e[i](a),u=c.value}catch(e){r(e);return}c.done?t(u):Promise.resolve(u).then(o,n)}function h(){var e,t,r=(e=["\n        display: flex;\n      "],t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}})));return h=function(){return r},r}var x=function(t){var r,u,l=t.authenticator,p=f().t,s=(0,e.useAPIClient)(),d=new URLSearchParams((0,m.useLocation)().search),y=d.get("redirect"),x=(r=function(){var e,t,r;return function(e,t){var r,o,n,i,a={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function c(i){return function(c){var u=[i,c];if(r)throw TypeError("Generator is already executing.");for(;a;)try{if(r=1,o&&(n=2&u[0]?o.return:u[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,u[1])).done)return n;switch(o=0,n&&(u=[2&u[0],n.value]),u[0]){case 0:case 1:n=u;break;case 4:return a.label++,{value:u[1],done:!1};case 5:a.label++,o=u[1],u=[0];continue;case 7:u=a.ops.pop(),a.trys.pop();continue;default:if(!(n=(n=a.trys).length>0&&n[n.length-1])&&(6===u[0]||2===u[0])){a=0;continue}if(3===u[0]&&(!n||u[1]>n[0]&&u[1]<n[3])){a.label=u[1];break}if(6===u[0]&&a.label<n[1]){a.label=n[1],n=u;break}if(n&&a.label<n[2]){a.label=n[2],a.ops.push(u);break}n[2]&&a.ops.pop(),a.trys.pop();continue}u=t.call(e,a)}catch(e){u=[6,e],o=0}finally{r=n=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}}}(this,function(o){switch(o.label){case 0:return[4,s.request({method:"post",url:"oidc:getAuthUrl",headers:{"X-Authenticator":l.name},data:{redirect:y}})];case 1:return r=null==(t=o.sent())||null==(e=t.data)?void 0:e.data,window.location.replace(r),[2]}})},u=function(){var e=this,t=arguments;return new Promise(function(o,n){var i=r.apply(e,t);function a(e){v(i,o,n,a,c,"next",e)}function c(e){v(i,o,n,a,c,"throw",e)}a(void 0)})},function(){return u.apply(this,arguments)});return(0,a.useEffect)(function(){var e=b.get(o);if(e){var t=new URL(e);t.searchParams.set("post_logout_redirect_uri",window.location.href),b.remove(o,{domain:window.location.hostname}),window.location.href=t.href}var r=d.get("authenticator"),n=d.get("error");if(r===l.name&&n)return void i.message.error(p(n))}),c().createElement(i.Space,{direction:"vertical",className:(0,e.css)(h())},c().createElement(i.Button,{shape:"round",block:!0,icon:c().createElement(n.LoginOutlined,null),onClick:x},p(l.title)))},g=s(632),S=s(505),I={type:"object",properties:{public:{type:"object",properties:{autoSignup:{"x-decorator":"FormItem",type:"boolean",title:'{{t("Sign up automatically when the user does not exist")}}',"x-component":"Checkbox",default:!0}}},oidc:{type:"object",properties:{collapse:{type:"void","x-component":"FormTab",properties:{basic:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Basic configuration")},properties:{issuer:{type:"string",title:'{{t("Issuer")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},clientId:{type:"string",title:'{{t("Client ID")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},clientSecret:{type:"string",title:'{{t("Client Secret")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},scope:{type:"string",title:'{{t("scope")}}',"x-component":"Input","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Default: openid profile email")}}'}},idTokenSignedResponseAlg:{type:"string",title:'{{t("id_token signed response algorithm")}}',"x-component":"Select","x-decorator":"FormItem",enum:[{label:"HS256",value:"HS256"},{label:"HS384",value:"HS384"},{label:"HS512",value:"HS512"},{label:"RS256",value:"RS256"},{label:"RS384",value:"RS384"},{label:"RS512",value:"RS512"},{label:"ES256",value:"ES256"},{label:"ES384",value:"ES384"},{label:"ES512",value:"ES512"},{label:"PS256",value:"PS256"},{label:"PS384",value:"PS384"},{label:"PS512",value:"PS512"}]}}},mapping:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Field mapping")},properties:{fieldMap:{title:'{{t("Field Map")}}',type:"array","x-decorator":"FormItem","x-component":"ArrayItems",items:{type:"object","x-decorator":"ArrayItems.Item",properties:{space:{type:"void","x-component":"Space",properties:{source:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("source")}}'}},target:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("target")}}'}},remove:{type:"void","x-decorator":"FormItem","x-component":"ArrayItems.Remove"}}}}},properties:{add:{type:"void",title:"Add","x-component":"ArrayItems.Addition"}}},userBindField:{type:"string",title:'{{t("Use this field to bind the user")}}',"x-component":"Select","x-decorator":"FormItem",default:"email",enum:[{label:p("Email"),value:"email"},{label:p("Username"),value:"username"}],required:!0}}},advanced:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Advanced configuration")},properties:{logout:{type:"boolean",title:'{{t("RP-initiated logout")}}',"x-component":"Checkbox","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Performs logout on the issuer (uses end_session_endpoint in the issuer configuration)")}}'}},http:{type:"boolean",title:'{{t("HTTP")}}',"x-component":"Checkbox","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Check if NocoBase is running on HTTP protocol")}}'}},port:{type:"number",title:'{{t("Port")}}',"x-component":"InputNumber","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("The port number of the NocoBase service if it is not 80 or 443")}}'},"x-component-props":{style:{width:"15%",minWidth:"100px"}}},stateToken:{type:"string",title:'{{t("State token")}}',"x-component":"Input","x-decorator":"FormItem",description:p("The state token helps prevent CSRF attacks. It's recommended to leave it blank for automatic random generation.")},exchangeBodyKeys:{type:"array",title:'{{t("Pass parameters in the authorization code grant exchange")}}',"x-decorator":"FormItem","x-component":"ArrayItems",default:[{paramName:"",optionsKey:"clientId"},{paramName:"",optionsKey:"clientSecret"}],items:{type:"object","x-decorator":"ArrayItems.Item",properties:{space:{type:"void","x-component":"Space",properties:{enabled:{type:"boolean","x-decorator":"FormItem","x-component":"Checkbox"},optionsKey:{type:"string","x-decorator":"FormItem","x-decorator-props":{style:{width:"100px"}},"x-component":"Select","x-read-pretty":!0,enum:[{label:p("Client ID"),value:"clientId"},{label:p("Client Secret"),value:"clientSecret"}]},paramName:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("Parameter name")}}'}}}}}}},userInfoMethod:{type:"string",title:'{{t("Method to call the user info endpoint")}}',"x- decorator":"FormItem","x-component":"Radio.Group",default:"GET",enum:[{label:"GET",value:"GET"},{label:"POST",value:"POST"}],"x-reactions":[{dependencies:[".accessTokenVia"],when:'{{$deps[0] === "query"}}',fulfill:{state:{value:"GET"}}},{dependencies:[".accessTokenVia"],when:'{{$deps[0] === "body"}}',fulfill:{state:{value:"POST"}}}]},accessTokenVia:{type:"string",title:'{{t("Where to put the access token when calling the user info endpoint")}}',"x- decorator":"FormItem","x-component":"Radio.Group",default:"header",enum:[{label:p("Header"),value:"header"},{label:p("Body (Use with POST method)"),value:"body"},{label:p("Query parameters (Use with GET method)"),value:"query"}]}}}}}}},usage:{type:"void","x-component":"Usage"}}},w=(0,S.observer)(function(){var t=f().t,r=(0,e.useApp)(),o=(0,a.useMemo)(function(){return r.getApiUrl("oidc:redirect")},[r]),u=function(e){navigator.clipboard.writeText(e),i.message.success(t("Copied"))};return c().createElement(i.Card,{title:t("Usage"),type:"inner"},c().createElement(e.FormItem,{label:t("Redirect URL")},c().createElement(e.Input,{value:o,disabled:!0,addonBefore:c().createElement(n.CopyOutlined,{onClick:function(){return u(o)}})})))},{displayName:"Usage"}),T=function(){var t=f().t;return c().createElement(e.SchemaComponent,{scope:{t:t},components:{Usage:w,ArrayItems:g.ArrayItems,Space:i.Space,FormTab:g.FormTab},schema:I})};function P(e,t,r,o,n,i,a){try{var c=e[i](a),u=c.value}catch(e){r(e);return}c.done?t(u):Promise.resolve(u).then(o,n)}function F(e,t,r){return(F=E()?Reflect.construct:function(e,t,r){var o=[null];o.push.apply(o,t);var n=new(Function.bind.apply(e,o));return r&&C(n,r.prototype),n}).apply(null,arguments)}function k(e){return(k=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function C(e,t){return(C=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function O(e){var t="function"==typeof Map?new Map:void 0;return(O=function(e){if(null===e||-1===Function.toString.call(e).indexOf("[native code]"))return e;if("function"!=typeof e)throw TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,r)}function r(){return F(e,arguments,k(this).constructor)}return r.prototype=Object.create(e.prototype,{constructor:{value:r,enumerable:!1,writable:!0,configurable:!0}}),C(r,e)})(e)}function E(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(E=function(){return!!e})()}var j=function(e){var t;if("function"!=typeof e&&null!==e)throw TypeError("Super expression must either be null or a function");function o(){var e,t;if(!(this instanceof o))throw TypeError("Cannot call a class as a function");return e=o,t=arguments,e=k(e),function(e,t){var r;if(t&&("object"==((r=t)&&"undefined"!=typeof Symbol&&r.constructor===Symbol?"symbol":typeof r)||"function"==typeof t))return t;if(void 0===e)throw ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(this,E()?Reflect.construct(e,t||[],k(this).constructor):e.apply(this,t))}return o.prototype=Object.create(e&&e.prototype,{constructor:{value:o,writable:!0,configurable:!0}}),e&&C(o,e),t=[{key:"load",value:function(){var e,t=this;return(e=function(){return function(e,t){var r,o,n,i,a={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return i={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function c(i){return function(c){var u=[i,c];if(r)throw TypeError("Generator is already executing.");for(;a;)try{if(r=1,o&&(n=2&u[0]?o.return:u[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,u[1])).done)return n;switch(o=0,n&&(u=[2&u[0],n.value]),u[0]){case 0:case 1:n=u;break;case 4:return a.label++,{value:u[1],done:!1};case 5:a.label++,o=u[1],u=[0];continue;case 7:u=a.ops.pop(),a.trys.pop();continue;default:if(!(n=(n=a.trys).length>0&&n[n.length-1])&&(6===u[0]||2===u[0])){a=0;continue}if(3===u[0]&&(!n||u[1]>n[0]&&u[1]<n[3])){a.label=u[1];break}if(6===u[0]&&a.label<n[1]){a.label=n[1],n=u;break}if(n&&a.label<n[2]){a.label=n[2],a.ops.push(u);break}n[2]&&a.ops.pop(),a.trys.pop();continue}u=t.call(e,a)}catch(e){u=[6,e],o=0}finally{r=n=0}if(5&u[0])throw u[1];return{value:u[0]?u[1]:void 0,done:!0}}}}(this,function(e){return t.app.pm.get(r()).registerType("OIDC+",{components:{SignInButton:x,AdminSettingsForm:T}}),[2]})},function(){var t=this,r=arguments;return new Promise(function(o,n){var i=e.apply(t,r);function a(e){P(i,o,n,a,c,"next",e)}function c(e){P(i,o,n,a,c,"throw",e)}a(void 0)})})()}}],function(e,t){for(var r=0;r<t.length;r++){var o=t[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}(o.prototype,t),o}(O(e.Plugin)),R=j}(),d}()});
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react-i18next"),require("@nocobase/plugin-auth/client"),require("@nocobase/client"),require("react-router-dom"),require("react"),require("@formily/antd-v5"),require("@formily/react"),require("@ant-design/icons"),require("antd")):"function"==typeof define&&define.amd?define("@typekcz-nocobase-plugins/plugin-oidc-plus",["react-i18next","@nocobase/plugin-auth/client","@nocobase/client","react-router-dom","react","@formily/antd-v5","@formily/react","@ant-design/icons","antd"],t):"object"==typeof exports?exports["@typekcz-nocobase-plugins/plugin-oidc-plus"]=t(require("react-i18next"),require("@nocobase/plugin-auth/client"),require("@nocobase/client"),require("react-router-dom"),require("react"),require("@formily/antd-v5"),require("@formily/react"),require("@ant-design/icons"),require("antd")):e["@typekcz-nocobase-plugins/plugin-oidc-plus"]=t(e["react-i18next"],e["@nocobase/plugin-auth/client"],e["@nocobase/client"],e["react-router-dom"],e.react,e["@formily/antd-v5"],e["@formily/react"],e["@ant-design/icons"],e.antd)}(self,function(e,t,r,o,n,a,i,c,l){return function(){"use strict";var u={482:function(e){e.exports=c},632:function(e){e.exports=a},505:function(e){e.exports=i},772:function(e){e.exports=r},689:function(e){e.exports=t},721:function(e){e.exports=l},156:function(e){e.exports=n},238:function(t){t.exports=e},128:function(e){e.exports=o}},p={};function s(e){var t=p[e];if(void 0!==t)return t.exports;var r=p[e]={exports:{}};return u[e](r,r.exports,s),r.exports}s.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return s.d(t,{a:t}),t},s.d=function(e,t){for(var r in t)s.o(t,r)&&!s.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var d={};return!function(){s.r(d),s.d(d,{default:function(){return _},PluginOIDCClient:function(){return B}});var e,t=s(772),r=s(689),o=s.n(r),n="tnp_oidc_plus_logout",a=s(721),i=s(156),c=s.n(i),l=s(238),u="oidc";function p(e){return t.i18n.t(e,{ns:u})}function m(){return(0,l.useTranslation)(u)}var f=s(128);function y(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)e[o]=r[o]}return e}var v=function e(t,r){function o(e,o,n){if("undefined"!=typeof document){"number"==typeof(n=y({},r,n)).expires&&(n.expires=new Date(Date.now()+864e5*n.expires)),n.expires&&(n.expires=n.expires.toUTCString()),e=encodeURIComponent(e).replace(/%(2[346B]|5E|60|7C)/g,decodeURIComponent).replace(/[()]/g,escape);var a="";for(var i in n)n[i]&&(a+="; "+i,!0!==n[i]&&(a+="="+n[i].split(";")[0]));return document.cookie=e+"="+t.write(o,e)+a}}return Object.create({set:o,get:function(e){if("undefined"!=typeof document&&(!arguments.length||e)){for(var r=document.cookie?document.cookie.split("; "):[],o={},n=0;n<r.length;n++){var a=r[n].split("="),i=a.slice(1).join("=");try{var c=decodeURIComponent(a[0]);if(o[c]=t.read(i,c),e===c)break}catch(e){}}return e?o[e]:o}},remove:function(e,t){o(e,"",y({},t,{expires:-1}))},withAttributes:function(t){return e(this.converter,y({},this.attributes,t))},withConverter:function(t){return e(y({},this.converter,t),this.attributes)}},{attributes:{value:Object.freeze(r)},converter:{value:Object.freeze(t)}})}({read:function(e){return'"'===e[0]&&(e=e.slice(1,-1)),e.replace(/(%[\dA-F]{2})+/gi,decodeURIComponent)},write:function(e){return encodeURIComponent(e).replace(/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,decodeURIComponent)}},{path:"/"});function b(e,t,r,o,n,a,i){try{var c=e[a](i),l=c.value}catch(e){r(e);return}c.done?t(l):Promise.resolve(l).then(o,n)}function h(){var e,t,r=(e=["\n        display: flex;\n      "],t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}})));return h=function(){return r},r}var x=function(e){var r,o,l,u,p,s=e.authenticator,d=m().t,y=(0,t.useAPIClient)(),x=new URLSearchParams((0,f.useLocation)().search),g=x.get("redirect"),S=x.get("error"),I=(r=function(){var e,t,r;return function(e,t){var r,o,n,a,i={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return a={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function c(a){return function(c){var l=[a,c];if(r)throw TypeError("Generator is already executing.");for(;i;)try{if(r=1,o&&(n=2&l[0]?o.return:l[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,l[1])).done)return n;switch(o=0,n&&(l=[2&l[0],n.value]),l[0]){case 0:case 1:n=l;break;case 4:return i.label++,{value:l[1],done:!1};case 5:i.label++,o=l[1],l=[0];continue;case 7:l=i.ops.pop(),i.trys.pop();continue;default:if(!(n=(n=i.trys).length>0&&n[n.length-1])&&(6===l[0]||2===l[0])){i=0;continue}if(3===l[0]&&(!n||l[1]>n[0]&&l[1]<n[3])){i.label=l[1];break}if(6===l[0]&&i.label<n[1]){i.label=n[1],n=l;break}if(n&&i.label<n[2]){i.label=n[2],i.ops.push(l);break}n[2]&&i.ops.pop(),i.trys.pop();continue}l=t.call(e,i)}catch(e){l=[6,e],o=0}finally{r=n=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}}}(this,function(o){switch(o.label){case 0:return[4,y.request({method:"post",url:"oidc:getAuthUrl",headers:{"X-Authenticator":s.name},data:{redirect:g}})];case 1:return r=null==(t=o.sent())||null==(e=t.data)?void 0:e.data,window.location.replace(r),[2]}})},o=function(){var e=this,t=arguments;return new Promise(function(o,n){var a=r.apply(e,t);function i(e){b(a,o,n,i,c,"next",e)}function c(e){b(a,o,n,i,c,"throw",e)}i(void 0)})},function(){return o.apply(this,arguments)});(0,i.useEffect)(function(){var e,t=v.get(n);if(!S&&t){var r=new URL(t);r.searchParams.set("post_logout_redirect_uri",window.location.href),v.remove(n,{domain:window.location.hostname}),console.info("OIDC+: Redirect to logout from SSO."),window.location.href=r.href;return}if(!S&&(null==(e=s.options)?void 0:e.autoLoginRedirect)&&null!=g){console.info("OIDC+: Redirect to login in SSO."),I();return}var o=x.get("authenticator"),i=x.get("error");if(o===s.name&&i)return void a.message.error(d(i))});var w=null==(l=s.options)?void 0:l.buttonStyle;return c().createElement(a.Space,{direction:"vertical",className:(0,t.css)(h())},c().createElement(a.Button,{block:!0,onClick:I,icon:c().createElement(t.Icon,{type:null==w?void 0:w.icon}),type:null==w?void 0:w.type,shape:null!=(p=null==w?void 0:w.shape)?p:"round",color:null==w?void 0:w.color,variant:null==w?void 0:w.variant,style:null==w||null==(u=w.customStyle)?void 0:u.reduce(function(e,t){return e[t.property]=t.value,e},{})},d(s.title)))},g=s(482),S=s(632),I=s(505);function w(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,o=Array(t);r<t;r++)o[r]=e[r];return o}let F=/^[\u4E00-\u9FA5]{2}$/;F.test.bind(F);let k=["default","primary","danger"].concat(function(e){if(Array.isArray(e))return w(e)}(e=["blue","purple","cyan","green","magenta","pink","red","orange","yellow","volcano","geekblue","lime","gold"])||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,t){if(e){if("string"==typeof e)return w(e,void 0);var r=({}).toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?w(e,void 0):void 0}}(e)||function(){throw TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}());var P={type:"object",properties:{public:{type:"object",properties:{autoSignup:{"x-decorator":"FormItem",type:"boolean",title:'{{t("Sign up automatically when the user does not exist")}}',"x-component":"Checkbox",default:!0}}},oidc:{type:"object",properties:{collapse:{type:"void","x-component":"FormTab",properties:{basic:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Basic configuration")},properties:{issuer:{type:"string",title:'{{t("Issuer")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},clientId:{type:"string",title:'{{t("Client ID")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},clientSecret:{type:"string",title:'{{t("Client Secret")}}',"x-component":"Input","x-decorator":"FormItem",required:!0},scope:{type:"string",title:'{{t("scope")}}',"x-component":"Input","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Default: openid profile email")}}'}},idTokenSignedResponseAlg:{type:"string",title:'{{t("id_token signed response algorithm")}}',"x-component":"Select","x-decorator":"FormItem",enum:[{label:"HS256",value:"HS256"},{label:"HS384",value:"HS384"},{label:"HS512",value:"HS512"},{label:"RS256",value:"RS256"},{label:"RS384",value:"RS384"},{label:"RS512",value:"RS512"},{label:"ES256",value:"ES256"},{label:"ES384",value:"ES384"},{label:"ES512",value:"ES512"},{label:"PS256",value:"PS256"},{label:"PS384",value:"PS384"},{label:"PS512",value:"PS512"}]},usage:{type:"void","x-component":"Usage"}}},mapping:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Field mapping")},properties:{fieldMap:{title:'{{t("Field Map")}}',type:"array","x-decorator":"FormItem","x-component":"ArrayItems",items:{type:"object","x-decorator":"ArrayItems.Item",properties:{space:{type:"void","x-component":"Space",properties:{source:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("source")}}'}},target:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("target")}}'}},remove:{type:"void","x-decorator":"FormItem","x-component":"ArrayItems.Remove"}}}}},properties:{add:{type:"void",title:"Add","x-component":"ArrayItems.Addition"}}},userBindField:{type:"string",title:'{{t("Use this field to bind the user")}}',"x-component":"Select","x-decorator":"FormItem",default:"email",enum:[{label:p("Email"),value:"email"},{label:p("Username"),value:"username"}],required:!0}}},advanced:{type:"void","x-component":"FormTab.TabPane","x-component-props":{tab:p("Advanced configuration")},properties:{logout:{type:"boolean",title:'{{t("RP-initiated logout")}}',"x-component":"Checkbox","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Performs logout on the issuer (uses end_session_endpoint in the issuer configuration)")}}'}},autoLoginRedirect:{type:"boolean",title:'{{t("Automatic redirect to issuer login")}}',"x-component":"Checkbox","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("When user is logged out, redirect them to issuer login, skipping Nocobase login page. If you want to access the login page without being redirected, make sure your URL doesn\'t have the redirect parameter.")}}'}},http:{type:"boolean",title:'{{t("HTTP")}}',"x-component":"Checkbox","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("Check if NocoBase is running on HTTP protocol")}}'}},port:{type:"number",title:'{{t("Port")}}',"x-component":"InputNumber","x-decorator":"FormItem","x-decorator-props":{tooltip:'{{t("The port number of the NocoBase service if it is not 80 or 443")}}'},"x-component-props":{style:{width:"15%",minWidth:"100px"}}},stateToken:{type:"string",title:'{{t("State token")}}',"x-component":"Input","x-decorator":"FormItem",description:p("The state token helps prevent CSRF attacks. It's recommended to leave it blank for automatic random generation.")},exchangeBodyKeys:{type:"array",title:'{{t("Pass parameters in the authorization code grant exchange")}}',"x-decorator":"FormItem","x-component":"ArrayItems",default:[{paramName:"",optionsKey:"clientId"},{paramName:"",optionsKey:"clientSecret"}],items:{type:"object","x-decorator":"ArrayItems.Item",properties:{space:{type:"void","x-component":"Space",properties:{enabled:{type:"boolean","x-decorator":"FormItem","x-component":"Checkbox"},optionsKey:{type:"string","x-decorator":"FormItem","x-decorator-props":{style:{width:"100px"}},"x-component":"Select","x-read-pretty":!0,enum:[{label:p("Client ID"),value:"clientId"},{label:p("Client Secret"),value:"clientSecret"}]},paramName:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("Parameter name")}}'}}}}}}},userInfoMethod:{type:"string",title:'{{t("Method to call the user info endpoint")}}',"x- decorator":"FormItem","x-component":"Radio.Group",default:"GET",enum:[{label:"GET",value:"GET"},{label:"POST",value:"POST"}],"x-reactions":[{dependencies:[".accessTokenVia"],when:'{{$deps[0] === "query"}}',fulfill:{state:{value:"GET"}}},{dependencies:[".accessTokenVia"],when:'{{$deps[0] === "body"}}',fulfill:{state:{value:"POST"}}}]},accessTokenVia:{type:"string",title:'{{t("Where to put the access token when calling the user info endpoint")}}',"x- decorator":"FormItem","x-component":"Radio.Group",default:"header",enum:[{label:p("Header"),value:"header"},{label:p("Body (Use with POST method)"),value:"body"},{label:p("Query parameters (Use with GET method)"),value:"query"}]}}},buttonStyle:{type:"object","x-component":"FormTab.TabPane","x-component-props":{tab:p("Button Style")},properties:{type:{type:"string",title:'{{t("Type")}}',"x-component":"Select","x-decorator":"FormItem",enum:["default","primary","dashed","link","text"].map(function(e){return{label:e.charAt(0).toUpperCase()+e.slice(1),value:e}})},shape:{type:"string",title:'{{t("Shape")}}',"x-component":"Select","x-decorator":"FormItem",enum:["default","circle","round"].map(function(e){return{label:e.charAt(0).toUpperCase()+e.slice(1),value:e}})},variant:{type:"string",title:'{{t("Variant")}}',"x-component":"Select","x-decorator":"FormItem",enum:["outlined","dashed","solid","filled","text","link"].map(function(e){return{label:e.charAt(0).toUpperCase()+e.slice(1),value:e}})},color:{type:"string",title:'{{t("Color")}}',"x-component":"Select","x-decorator":"FormItem",enum:k.map(function(e){return{label:e.charAt(0).toUpperCase()+e.slice(1),value:e}})},icon:{type:"string",title:'{{t("Icon")}}',"x-component":"IconPicker","x-decorator":"FormItem",enum:k.map(function(e){return{label:e.charAt(0).toUpperCase()+e.slice(1),value:e}})},customStyle:{title:'{{t("Custom Style")}}',type:"array","x-decorator":"FormItem","x-component":"ArrayItems",items:{type:"object","x-decorator":"ArrayItems.Item",properties:{space:{type:"void","x-component":"Space",properties:{property:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("property")}}'}},value:{type:"string","x-decorator":"FormItem","x-component":"Input","x-component-props":{placeholder:'{{t("value")}}'}},remove:{type:"void","x-decorator":"FormItem","x-component":"ArrayItems.Remove"}}}}},description:p("JavaScript style CSS property names on the left, values on the right."),properties:{add:{type:"void",title:"Add","x-component":"ArrayItems.Addition"}}},preview:{type:"void","x-component":"ButtonStylePreview"}}}}}}}}},C=(0,I.observer)(function(){var e=m().t,r=(0,t.useApp)(),o=(0,i.useMemo)(function(){return r.getApiUrl("oidc:redirect")},[r]),n=function(t){navigator.clipboard.writeText(t),a.message.success(e("Copied"))};return c().createElement(a.Card,{title:e("Usage"),type:"inner"},c().createElement(t.FormItem,{label:e("Redirect URL")},c().createElement(t.Input,{value:o,disabled:!0,addonBefore:c().createElement(g.CopyOutlined,{onClick:function(){return n(o)}})})))},{displayName:"Usage"}),T=(0,I.observer)(function(){var e=(0,I.useField)(),r=e.query(".type").take(),o=e.query(".shape").take(),n=e.query(".variant").take(),l=e.query(".color").take(),u=e.query(".icon").take(),p=e.query(".customStyle").take(),s=(0,i.useMemo)(function(){var e={};return(null==r?void 0:r.value)&&(e.type=r.value),(null==o?void 0:o.value)&&(e.shape=o.value),(null==n?void 0:n.value)&&(e.variant=n.value),(null==l?void 0:l.value)&&(e.color=l.value),(null==u?void 0:u.value)&&(e.icon=c().createElement(t.Icon,{type:u.value})),Array.isArray(null==p?void 0:p.value)&&(e.style=p.value.reduce(function(e,t){return e[t.property]=t.value,e},{})),e},[null==r?void 0:r.value,null==o?void 0:o.value,null==n?void 0:n.value,null==l?void 0:l.value,null==u?void 0:u.value,null==p?void 0:p.value]);return c().createElement(a.Card,{title:"Preview",type:"inner"},c().createElement(a.Space,{direction:"vertical",style:{width:"100%"}},c().createElement("div",{style:{display:"flex",flexDirection:"column",width:"320px"}},c().createElement(a.Button,s,"Preview Button"))))},{displayName:"ButtonStylePreview"}),A=function(){var e=m().t;return c().createElement(t.SchemaComponent,{scope:{t:e},components:{Usage:C,ButtonStylePreview:T,ArrayItems:S.ArrayItems,Space:a.Space,FormTab:S.FormTab},schema:P})};function E(e,t,r,o,n,a,i){try{var c=e[a](i),l=c.value}catch(e){r(e);return}c.done?t(l):Promise.resolve(l).then(o,n)}function O(e,t,r){return(O=U()?Reflect.construct:function(e,t,r){var o=[null];o.push.apply(o,t);var n=new(Function.bind.apply(e,o));return r&&j(n,r.prototype),n}).apply(null,arguments)}function R(e){return(R=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function j(e,t){return(j=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function q(e){var t="function"==typeof Map?new Map:void 0;return(q=function(e){if(null===e||-1===Function.toString.call(e).indexOf("[native code]"))return e;if("function"!=typeof e)throw TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,r)}function r(){return O(e,arguments,R(this).constructor)}return r.prototype=Object.create(e.prototype,{constructor:{value:r,enumerable:!1,writable:!0,configurable:!0}}),j(r,e)})(e)}function U(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(U=function(){return!!e})()}var B=function(e){var t;if("function"!=typeof e&&null!==e)throw TypeError("Super expression must either be null or a function");function r(){var e,t;if(!(this instanceof r))throw TypeError("Cannot call a class as a function");return e=r,t=arguments,e=R(e),function(e,t){var r;if(t&&("object"==((r=t)&&"undefined"!=typeof Symbol&&r.constructor===Symbol?"symbol":typeof r)||"function"==typeof t))return t;if(void 0===e)throw ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(this,U()?Reflect.construct(e,t||[],R(this).constructor):e.apply(this,t))}return r.prototype=Object.create(e&&e.prototype,{constructor:{value:r,writable:!0,configurable:!0}}),e&&j(r,e),t=[{key:"load",value:function(){var e,t=this;return(e=function(){return function(e,t){var r,o,n,a,i={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return a={next:c(0),throw:c(1),return:c(2)},"function"==typeof Symbol&&(a[Symbol.iterator]=function(){return this}),a;function c(a){return function(c){var l=[a,c];if(r)throw TypeError("Generator is already executing.");for(;i;)try{if(r=1,o&&(n=2&l[0]?o.return:l[0]?o.throw||((n=o.return)&&n.call(o),0):o.next)&&!(n=n.call(o,l[1])).done)return n;switch(o=0,n&&(l=[2&l[0],n.value]),l[0]){case 0:case 1:n=l;break;case 4:return i.label++,{value:l[1],done:!1};case 5:i.label++,o=l[1],l=[0];continue;case 7:l=i.ops.pop(),i.trys.pop();continue;default:if(!(n=(n=i.trys).length>0&&n[n.length-1])&&(6===l[0]||2===l[0])){i=0;continue}if(3===l[0]&&(!n||l[1]>n[0]&&l[1]<n[3])){i.label=l[1];break}if(6===l[0]&&i.label<n[1]){i.label=n[1],n=l;break}if(n&&i.label<n[2]){i.label=n[2],i.ops.push(l);break}n[2]&&i.ops.pop(),i.trys.pop();continue}l=t.call(e,i)}catch(e){l=[6,e],o=0}finally{r=n=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}}}(this,function(e){return t.app.pm.get(o()).registerType("OIDC+",{components:{SignInButton:x,AdminSettingsForm:A}}),[2]})},function(){var t=this,r=arguments;return new Promise(function(o,n){var a=e.apply(t,r);function i(e){E(a,o,n,i,c,"next",e)}function c(e){E(a,o,n,i,c,"throw",e)}i(void 0)})})()}}],function(e,t){for(var r=0;r<t.length;r++){var o=t[r];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}(r.prototype,t),r}(q(t.Plugin)),_=B}(),d}()});

package/dist/externalVersion.js

@@ -8,16 +8,17 @@
  */
 
 module.exports = {
-  "@ant-design/icons": "5.6.1",
-  "@nocobase/client": "1.9.5",
+  "@nocobase/client": "1.9.47",
   "antd": "5.24.2",
   "react": "18.2.0",
   "react-router-dom": "6.28.1",
-  "@nocobase/plugin-auth": "1.9.5",
+  "@nocobase/plugin-auth": "1.9.47",
+  "@ant-design/icons": "5.6.1",
   "@formily/antd-v5": "1.2.3",
   "@formily/react": "2.3.0",
-  "@nocobase/auth": "1.9.5",
-  "@nocobase/server": "1.9.5",
+  "@formily/core": "2.3.0",
+  "@nocobase/auth": "1.9.47",
+  "@nocobase/server": "1.9.47",
   "react-i18next": "11.18.6",
-  "@nocobase/actions": "1.9.5"
+  "@nocobase/actions": "1.9.47"
 };

package/dist/server/plugin.js

@@ -50,9 +50,15 @@ class PluginOIDCServer extends import_server.Plugin {
       }
     });
     this.app.authManager.registerTypes(import_constants.authType, {
-      auth: import_oidc_auth.OIDCAuth
+      auth: import_oidc_auth.OIDCAuth,
+      getPublicOptions(options) {
+        return {
+          autoLoginRedirect: options.oidc.autoLoginRedirect,
+          buttonStyle: options.oidc.buttonStyle
+        };
+      }
     });
-    this.app.resource({
+    this.app.resourceManager.define({
       name: "oidc",
       actions: {
         getAuthUrl: import_getAuthUrl.getAuthUrl,

package/package.json

@@ -2,7 +2,7 @@
   "name": "@typekcz-nocobase-plugins/plugin-oidc-plus",
   "displayName": "Auth: OIDC Plus",
   "description": "OIDC (OpenID Connect) authentication with extra features.",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "license": "AGPL-3.0",
   "main": "dist/server/index.js",
   "devDependencies": {

package/src/client/OIDCButton.tsx

@@ -1,5 +1,4 @@
-import { LoginOutlined } from '@ant-design/icons';
-import { css, useAPIClient } from '@nocobase/client';
+import { css, Icon, useAPIClient } from '@nocobase/client';
 import { Button, Space, message } from 'antd';
 import React, { useEffect } from 'react';
 import { useOidcTranslation } from './locale';
@@ -19,6 +18,7 @@ export const OIDCButton = ({ authenticator }: { authenticator: Authenticator })
   const location = useLocation();
   const params = new URLSearchParams(location.search);
   const redirect = params.get('redirect');
+  const errorParam = params.get('error');
 
   const login = async () => {
     const response = await api.request({
@@ -38,12 +38,21 @@ export const OIDCButton = ({ authenticator }: { authenticator: Authenticator })
 
   useEffect(() => {
     const logoutUrl = Cookies.get(logoutCookieName);
-    if (logoutUrl) {
+    if (!errorParam && logoutUrl) {
       const logoutUrlObj = new URL(logoutUrl);
       logoutUrlObj.searchParams.set('post_logout_redirect_uri', window.location.href);
       Cookies.remove(logoutCookieName, { domain: window.location.hostname });
+      console.info("OIDC+: Redirect to logout from SSO.");
       window.location.href = logoutUrlObj.href;
+      return;
+    }
+
+    if(!errorParam && authenticator.options?.autoLoginRedirect && redirect != null) {
+      console.info("OIDC+: Redirect to login in SSO.");
+      login();
+      return;
     }
+
     const name = params.get('authenticator');
     const error = params.get('error');
     if (name !== authenticator.name) {
@@ -55,6 +64,8 @@ export const OIDCButton = ({ authenticator }: { authenticator: Authenticator })
     }
   });
 
+  const btnStyle = authenticator.options?.buttonStyle;
+
   return (
     <Space
       direction="vertical"
@@ -62,7 +73,13 @@ export const OIDCButton = ({ authenticator }: { authenticator: Authenticator })
         display: flex;
       `}
     >
-      <Button shape="round" block icon={<LoginOutlined />} onClick={login}>
+      <Button block onClick={login}
+        icon={<Icon type={btnStyle?.icon} />}
+        type={btnStyle?.type}
+        shape={btnStyle?.shape ?? "round"}
+        color={btnStyle?.color}
+        variant={btnStyle?.variant}
+        style={btnStyle?.customStyle?.reduce((obj, s) => { obj[s.property] = s.value; return obj; }, {})}>
         {t(authenticator.title)}
       </Button>
     </Space>

package/src/client/Options.tsx

@@ -1,10 +1,12 @@
 import { CopyOutlined } from '@ant-design/icons';
 import { ArrayItems, FormTab } from '@formily/antd-v5';
-import { observer } from '@formily/react';
-import { FormItem, Input, SchemaComponent, useApp } from '@nocobase/client';
-import { Card, Space, message } from 'antd';
+import { observer, useField } from '@formily/react';
+import type { ArrayField, Field } from '@formily/core';
+import { FormItem, Icon, Input, SchemaComponent, useApp } from '@nocobase/client';
+import { Button, Card, Space, message } from 'antd';
 import React, { useMemo } from 'react';
 import { lang, useOidcTranslation } from './locale';
+import { _ButtonColorTypes, _ButtonVariantTypes } from 'antd/es/button';
 
 const schema = {
   type: 'object',
@@ -85,6 +87,10 @@ const schema = {
                     { label: 'PS512', value: 'PS512' },
                   ],
                 },
+                usage: {
+                  type: 'void',
+                  'x-component': 'Usage',
+                },
               },
             },
             mapping: {
@@ -171,6 +177,16 @@ const schema = {
                       '{{t("Performs logout on the issuer (uses end_session_endpoint in the issuer configuration)")}}',
                   },
                 },
+                autoLoginRedirect: {
+                  type: 'boolean',
+                  title: '{{t("Automatic redirect to issuer login")}}',
+                  'x-component': 'Checkbox',
+                  'x-decorator': 'FormItem',
+                  'x-decorator-props': {
+                    tooltip:
+                      '{{t("When user is logged out, redirect them to issuer login, skipping Nocobase login page. If you want to access the login page without being redirected, make sure your URL doesn\'t have the redirect parameter.")}}',
+                  },
+                },
                 http: {
                   type: 'boolean',
                   title: '{{t("HTTP")}}',
@@ -317,14 +333,105 @@ const schema = {
                 },
               },
             },
+            buttonStyle: {
+              type: 'object',
+              'x-component': 'FormTab.TabPane',
+              'x-component-props': {
+                tab: lang('Button Style'),
+              },
+              properties: {
+                type: {
+                  type: 'string',
+                  title: '{{t("Type")}}',
+                  'x-component': 'Select',
+                  'x-decorator': 'FormItem',
+                  enum: ["default", "primary", "dashed", "link", "text"].map(v => ({ label: v.charAt(0).toUpperCase()+v.slice(1), value: v})),
+                },
+                shape: {
+                  type: 'string',
+                  title: '{{t("Shape")}}',
+                  'x-component': 'Select',
+                  'x-decorator': 'FormItem',
+                  enum: ["default", "circle", "round"].map(v => ({ label: v.charAt(0).toUpperCase()+v.slice(1), value: v})),
+                },
+                variant: {
+                  type: 'string',
+                  title: '{{t("Variant")}}',
+                  'x-component': 'Select',
+                  'x-decorator': 'FormItem',
+                  enum: _ButtonVariantTypes.map(v => ({ label: v.charAt(0).toUpperCase()+v.slice(1), value: v})),
+                },
+                color: {
+                  type: 'string',
+                  title: '{{t("Color")}}',
+                  'x-component': 'Select',
+                  'x-decorator': 'FormItem',
+                  enum: _ButtonColorTypes.map(v => ({ label: v.charAt(0).toUpperCase()+v.slice(1), value: v})),
+                },
+                icon: {
+                  type: 'string',
+                  title: '{{t("Icon")}}',
+                  'x-component': 'IconPicker',
+                  'x-decorator': 'FormItem',
+                  enum: _ButtonColorTypes.map(v => ({ label: v.charAt(0).toUpperCase()+v.slice(1), value: v})),
+                },
+                customStyle: {
+                  title: '{{t("Custom Style")}}',
+                  type: 'array',
+                  'x-decorator': 'FormItem',
+                  'x-component': 'ArrayItems',
+                  items: {
+                    type: 'object',
+                    'x-decorator': 'ArrayItems.Item',
+                    properties: {
+                      space: {
+                        type: 'void',
+                        'x-component': 'Space',
+                        properties: {
+                          property: {
+                            type: 'string',
+                            'x-decorator': 'FormItem',
+                            'x-component': 'Input',
+                            'x-component-props': {
+                              placeholder: '{{t("property")}}',
+                            },
+                          },
+                          value: {
+                            type: 'string',
+                            'x-decorator': 'FormItem',
+                            'x-component': 'Input',
+                            'x-component-props': {
+                              placeholder: '{{t("value")}}',
+                            },
+                          },
+                          remove: {
+                            type: 'void',
+                            'x-decorator': 'FormItem',
+                            'x-component': 'ArrayItems.Remove',
+                          },
+                        },
+                      },
+                    },
+                  },
+                  description: lang("JavaScript style CSS property names on the left, values on the right."),
+                  properties: {
+                    add: {
+                      type: 'void',
+                      title: 'Add',
+                      'x-component': 'ArrayItems.Addition',
+                    },
+                  },
+                },
+                preview: {
+                  type: 'void',
+                  'x-component': 'ButtonStylePreview',
+                },
+              },
+            },
           },
         },
       },
     },
-    usage: {
-      type: 'void',
-      'x-component': 'Usage',
-    },
   },
 };
 
@@ -353,7 +460,52 @@ const Usage = observer(
   { displayName: 'Usage' },
 );
 
+const ButtonStylePreview = observer(
+  () => {
+    const field = useField();
+
+    // Query sibling fields to access their observable values
+    const typeField = field.query('.type').take() as Field;
+    const shapeField = field.query('.shape').take() as Field;
+    const variantField = field.query('.variant').take() as Field;
+    const colorField = field.query('.color').take() as Field;
+    const iconField = field.query('.icon').take() as Field;
+    const customStyleField = field.query('.customStyle').take() as ArrayField;
+
+    const buttonProps = useMemo(() => {
+      const props: any = {};
+
+      if(typeField?.value) props.type = typeField.value;
+      if(shapeField?.value) props.shape = shapeField.value;
+      if(variantField?.value) props.variant = variantField.value;
+      if(colorField?.value) props.color = colorField.value;
+      if(iconField?.value) props.icon = <Icon type={iconField.value} />;
+
+      if (Array.isArray(customStyleField?.value)) {
+        props.style = customStyleField.value.reduce((obj: React.CSSProperties, s: { property: string, value: string }) => {
+          obj[s.property] = s.value; return obj;
+        }, {});
+      }
+
+      return props;
+    }, [typeField?.value, shapeField?.value, variantField?.value, colorField?.value, iconField?.value, customStyleField?.value]);
+
+    return (
+      <Card title="Preview" type="inner">
+        <Space direction="vertical" style={{ width: '100%' }}>
+          <div style={{ display: "flex", flexDirection: "column", width: "320px" }}>
+            <Button {...buttonProps}>
+              Preview Button
+            </Button>
+          </div>
+        </Space>
+      </Card>
+    );
+  },
+  { displayName: 'ButtonStylePreview' },
+);
+
 export const Options = () => {
   const { t } = useOidcTranslation();
-  return <SchemaComponent scope={{ t }} components={{ Usage, ArrayItems, Space, FormTab }} schema={schema} />;
+  return <SchemaComponent scope={{ t }} components={{ Usage, ButtonStylePreview, ArrayItems, Space, FormTab }} schema={schema} />;
 };

package/src/server/plugin.ts

@@ -21,9 +21,15 @@ export class PluginOIDCServer extends Plugin {
 
     this.app.authManager.registerTypes(authType, {
       auth: OIDCAuth,
+      getPublicOptions(options) {
+        return {
+          autoLoginRedirect: options.oidc.autoLoginRedirect,
+          buttonStyle: options.oidc.buttonStyle,
+        };
+      },
     });
 
-    this.app.resource({
+    this.app.resourceManager.define({
       name: 'oidc',
       actions: {
         getAuthUrl,