{"version":3,"sources":["webpack:///./src/components/Payment/payment-form-style.ts"],"names":["PaymentFormStyle","constructor","computedStyles","themeSettings","styleEl","focusStyles","color","placeholderColor","fontFamily","fontUrl","lineHeight","fontSize","fontWeight","borderColor","borderWidth","borderStyle","borderRadius","boxShadow","highlightColor","negativeColor","textColor","this","PlaceholderText","Color","HighlightColor","Text","FontFamily","indexOf","split","getFormStyles","styleSource","$el","classList","add","_objectSpread","getComputedStyle","remove","foundStyles"],"mappings":"y0BAGO,MAAMA,EAoBZC,YAAYC,EAAqCC,EAA8BC,EAAmBC,GAAmC,KAnB5HC,WAAK,OACLC,sBAAgB,OAChBC,gBAAU,OACVC,aAAO,OACPC,gBAAU,OACVC,cAAQ,OACRC,gBAAU,OACVC,iBAAW,OACXC,iBAAW,OACXC,iBAAW,OACXC,kBAAY,OACZC,eAAS,OACTC,oBAAc,OACdC,mBAAa,OACbC,eAAS,OACTlB,oBAAc,OACdG,iBAAW,OACXD,aAAO,EAGfiB,KAAKnB,eAAiBA,EACtBmB,KAAKf,MAAQJ,EAAsB,MACnCmB,KAAKb,WAAaN,EAAe,eACjCmB,KAAKX,WAAaR,EAA2B,WAC7CmB,KAAKV,SAAWT,EAAyB,SACzCmB,KAAKT,WAAaV,EAA2B,WAC7CmB,KAAKR,YAAcX,EAAe,gBAClCmB,KAAKP,YAAcZ,EAAe,gBAClCmB,KAAKN,YAAcb,EAAe,gBAClCmB,KAAKL,aAAed,EAAe,iBACnCmB,KAAKJ,UAAYf,EAAe,cAChCmB,KAAKd,iBAAmBJ,EAAcmB,gBAAkBnB,EAAcmB,gBAAgBC,MAAQ,OAC9FF,KAAKH,eAAiBf,EAAcqB,eAAiBrB,EAAcqB,eAAiB,oBACpFH,KAAKF,cAAgB,UACrBE,KAAKjB,QAAUA,EACfiB,KAAKhB,YAAcA,EAEfF,EAAcsB,MACbtB,EAAcsB,KAAKC,WAAWC,QAAQ,MAAQ,IACjDN,KAAKZ,QAAUN,EAAcsB,KAAKC,WAAWE,MAAM,KAAK,IACzDP,KAAKD,UAAYjB,EAAcsB,KAAKF,OAGpCF,KAAKD,UAAYC,KAAKf,MAMxB,mBACC,QAASe,KAAKjB,SAIT,SAASyB,EAAcC,EAA4B3B,GAEzD,IAAIC,EAAmB,KACvB,GAAI0B,EACH,GAAI,YAAaA,EAChB1B,EAAU0B,MAEN,CAEJ1B,EADkB0B,EACEC,IAKtB3B,EAAQ4B,UAAUC,IAAI,YAEtB,MAAM5B,E,+VAAW6B,CAAA,GAAQC,iBAAiB/B,IAC1CA,EAAQ4B,UAAUI,OAAO,YACzB,MAAMC,EAAcF,iBAAiB/B,GAErC,OAAO,IAAIJ,EAAiBqC,EAAalC,EAAeC,EAASC","file":"31.c736ca6af9f5a02c4389.js","sourcesContent":["import type Vue from 'vue';\r\nimport type { ThemeSettings } from '@cognitoforms/types/server-types/forms/configuration/theme-settings';\r\n\r\nexport class PaymentFormStyle {\r\n\treadonly color?: string;\r\n\treadonly placeholderColor?: string;\r\n\treadonly fontFamily?: string;\r\n\treadonly fontUrl?: string;\r\n\treadonly lineHeight?: string;\r\n\treadonly fontSize?: string;\r\n\treadonly fontWeight?: string;\r\n\treadonly borderColor?: string;\r\n\treadonly borderWidth?: string;\r\n\treadonly borderStyle?: string;\r\n\treadonly borderRadius?: string;\r\n\treadonly boxShadow?: string;\r\n\treadonly highlightColor?: string;\r\n\treadonly negativeColor?: string;\r\n\treadonly textColor?: string;\r\n\treadonly computedStyles: CSSStyleDeclaration;\r\n\treadonly focusStyles?: CSSStyleDeclaration;\r\n\treadonly styleEl: Element;\r\n\r\n\tconstructor(computedStyles: CSSStyleDeclaration, themeSettings: ThemeSettings, styleEl?: Element, focusStyles?: CSSStyleDeclaration) {\r\n\t\tthis.computedStyles = computedStyles;\r\n\t\tthis.color = computedStyles['color'];\r\n\t\tthis.fontFamily = computedStyles['font-family'];\r\n\t\tthis.lineHeight = computedStyles['lineHeight'];\r\n\t\tthis.fontSize = computedStyles['fontSize'];\r\n\t\tthis.fontWeight = computedStyles['fontWeight'];\r\n\t\tthis.borderColor = computedStyles['border-color'];\r\n\t\tthis.borderWidth = computedStyles['border-width'];\r\n\t\tthis.borderStyle = computedStyles['border-style'];\r\n\t\tthis.borderRadius = computedStyles['border-radius'];\r\n\t\tthis.boxShadow = computedStyles['box-shadow'];\r\n\t\tthis.placeholderColor = themeSettings.PlaceholderText ? themeSettings.PlaceholderText.Color : '#ccc';\r\n\t\tthis.highlightColor = themeSettings.HighlightColor ? themeSettings.HighlightColor : 'rgb(26, 152, 255)';\r\n\t\tthis.negativeColor = '#cc2a24';\r\n\t\tthis.styleEl = styleEl;\r\n\t\tthis.focusStyles = focusStyles;\r\n\r\n\t\tif (themeSettings.Text) {\r\n\t\t\tif (themeSettings.Text.FontFamily.indexOf('|') >= 0)\r\n\t\t\t\tthis.fontUrl = themeSettings.Text.FontFamily.split('|')[1];\r\n\t\t\tthis.textColor = themeSettings.Text.Color;\r\n\t\t}\r\n\t\telse {\r\n\t\t\tthis.textColor = this.color;\r\n\t\t}\r\n\t}\r\n\r\n\t// In the payment dialog we don't want to style the payment fields using the form's theme\r\n\t// We create a \"fake\" PaymentFormStyle object instead to prevent harvesting styles (which doesn't have a style element)\r\n\tget useFormTheme() {\r\n\t\treturn !!this.styleEl;\r\n\t}\r\n}\r\n\r\nexport function getFormStyles(styleSource: Vue | Element, themeSettings: ThemeSettings): PaymentFormStyle {\r\n\t// Get the element to extract styles from\r\n\tlet styleEl: Element = null;\r\n\tif (styleSource) {\r\n\t\tif ('tagName' in styleSource) {\r\n\t\t\tstyleEl = styleSource as Element;\r\n\t\t}\r\n\t\telse {\r\n\t\t\tconst component = styleSource as Vue;\r\n\t\t\tstyleEl = component.$el as Element;\r\n\t\t}\r\n\t}\r\n\r\n\t// Fetch styles from style marker\r\n\tstyleEl.classList.add('is-focus');\r\n\t// convert to a normal object so it doesn't update.\r\n\tconst focusStyles = { ...getComputedStyle(styleEl) };\r\n\tstyleEl.classList.remove('is-focus');\r\n\tconst foundStyles = getComputedStyle(styleEl);\r\n\r\n\treturn new PaymentFormStyle(foundStyles, themeSettings, styleEl, focusStyles);\r\n}\r\n"],"sourceRoot":""}