@semcore/feedback-form 6.42.2 → 16.0.0-prerelease.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/lib/cjs/FeedbackForm.js +9 -11
- package/lib/cjs/FeedbackForm.js.map +1 -1
- package/lib/cjs/component/checkbox-button/CheckboxButton.js +5 -7
- package/lib/cjs/component/checkbox-button/CheckboxButton.js.map +1 -1
- package/lib/cjs/component/feedback-item/FeedbackItem.js +4 -4
- package/lib/cjs/component/feedback-item/FeedbackItem.js.map +1 -1
- package/lib/cjs/component/feedback-rating/FeedbackRating.js +6 -8
- package/lib/cjs/component/feedback-rating/FeedbackRating.js.map +1 -1
- package/lib/cjs/component/slider-rating/SliderRating.js +13 -17
- package/lib/cjs/component/slider-rating/SliderRating.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/style/slider-rating.shadow.css +1 -6
- package/lib/es6/FeedbackForm.js +9 -9
- package/lib/es6/FeedbackForm.js.map +1 -1
- package/lib/es6/component/checkbox-button/CheckboxButton.js +5 -5
- package/lib/es6/component/checkbox-button/CheckboxButton.js.map +1 -1
- package/lib/es6/component/feedback-item/FeedbackItem.js +4 -4
- package/lib/es6/component/feedback-item/FeedbackItem.js.map +1 -1
- package/lib/es6/component/feedback-rating/FeedbackRating.js +6 -6
- package/lib/es6/component/feedback-rating/FeedbackRating.js.map +1 -1
- package/lib/es6/component/slider-rating/SliderRating.js +13 -15
- package/lib/es6/component/slider-rating/SliderRating.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/style/slider-rating.shadow.css +1 -6
- package/lib/esm/FeedbackForm.mjs +13 -14
- package/lib/esm/component/checkbox-button/CheckboxButton.mjs +6 -7
- package/lib/esm/component/feedback-item/FeedbackItem.mjs +4 -4
- package/lib/esm/component/feedback-rating/FeedbackRating.mjs +9 -10
- package/lib/esm/component/slider-rating/SliderRating.mjs +15 -18
- package/lib/esm/style/slider-rating.shadow.css +1 -6
- package/lib/types/component/checkbox-button/CheckboxButton.d.ts +1 -1
- package/lib/types/index.d.ts +1 -7
- package/package.json +16 -19
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderRating.js","names":["React","createComponent","Component","Root","sstyled","Flex","Box","style","_sstyled","insert","keyboardFocusEnhance","uniqueIDEnhancement","i18nEnhance","localizedMessages","MIN","MAX","SliderRatingRoot","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty","_assertThisInitialized","hoveredIndex","clickedIndex","newValue","e","readonly","asProps","setValue","index","setState","_this$asProps","onChange","value","event","includes","key","preventDefault","state","direction","_createClass","getStarProps","_","_this$asProps2","filled","onClick","handleClick","onMouseEnter","undefined","handleMouseEnder","hovered","getLabelText","_this$asProps3","getI18nText","selectedRating","max","render","_ref","_ref3","_this$asProps4","styles","SSliderRating","label","createElement","_assignProps","fill","map","position","SliderRating","Star","hoverValue","editModeLabel","cn","_objectSpread","_assignProps2","handleMouseLeave","handleKeyDown","i18n","locale","props","_ref2","arguments[0]","_ref4","SStar","_assignProps3","displayName"],"sources":["../../../../src/component/slider-rating/SliderRating.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, Root, sstyled, Intergalactic } from '@semcore/core';\nimport { Flex, Box, BoxProps } from '@semcore/flex-box';\nimport style from '../../style/slider-rating.shadow.css';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { ScreenReaderOnly } from '@semcore/flex-box';\nimport { localizedMessages } from '../../translations/__intergalactic-dynamic-locales';\n\ntype SliderRatingProps = {\n value: number;\n onChange?: (value: number) => void;\n readonly?: boolean;\n};\n\ntype State = {\n hoveredIndex: number;\n clickedIndex: number;\n};\n\ntype StarProps = BoxProps & {\n filled?: boolean;\n};\n\nconst MIN = 1;\nconst MAX = 5;\n\nclass SliderRatingRoot extends Component<\n SliderRatingProps,\n {},\n State,\n typeof SliderRatingRoot.enhance\n> {\n static displayName = 'SliderRating';\n static style = style;\n\n static enhance = [\n keyboardFocusEnhance(),\n uniqueIDEnhancement(),\n i18nEnhance(localizedMessages),\n ] as const;\n\n state: State = {\n hoveredIndex: -1,\n clickedIndex: -1,\n };\n\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n handleClick = (newValue: number) => (e: React.SyntheticEvent<SVGElement>) => {\n const { readonly } = this.asProps;\n\n if (!readonly) {\n this.setValue(newValue);\n }\n };\n\n handleMouseEnder = (index: number) => () => {\n this.setState({ hoveredIndex: index });\n };\n\n handleMouseLeave = () => {\n this.setState({ hoveredIndex: -1 });\n };\n\n getStarProps(_: any, index: number) {\n const { value, readonly } = this.asProps;\n const { hoveredIndex } = this.state;\n\n return {\n filled: value ? index + 1 <= value || index <= hoveredIndex : index <= hoveredIndex,\n onClick: this.handleClick(index + 1),\n onMouseEnter: readonly ? undefined : this.handleMouseEnder(index),\n hovered: hoveredIndex === index,\n };\n }\n\n setValue = (newValue: number) => {\n const { onChange, value } = this.asProps;\n\n if (onChange) {\n onChange(newValue);\n }\n\n if (newValue <= value) {\n this.setState({ clickedIndex: newValue, hoveredIndex: -1 });\n } else {\n this.setState({ clickedIndex: -1, hoveredIndex: -1 });\n }\n };\n\n handleKeyDown = (event: React.KeyboardEvent) => {\n if (!['ArrowLeft', 'ArrowRight', 'Enter'].includes(event.key)) return;\n event.preventDefault();\n\n if (event.key === 'Enter') {\n const { hoveredIndex } = this.state;\n\n this.setValue(hoveredIndex + 1);\n } else {\n const { value } = this.asProps;\n const { hoveredIndex } = this.state;\n\n const direction = event.key === 'ArrowLeft' ? -1 : 1;\n let newValue = hoveredIndex === -1 ? value + direction : hoveredIndex + 1 + direction;\n\n if (newValue > MAX) newValue = MAX;\n if (newValue < MIN) newValue = MIN;\n\n this.setState({ hoveredIndex: newValue - 1 });\n }\n };\n\n getLabelText() {\n const { hoveredIndex } = this.state;\n const { readonly, value, getI18nText } = this.asProps;\n\n if (readonly) {\n return getI18nText('FeedbackRating.SliderRating.aria-valuetext.readonly', {\n selectedRating: value,\n max: MAX,\n });\n }\n\n if (value) {\n const selectedRating = hoveredIndex > -1 ? hoveredIndex + 1 : value;\n return getI18nText('FeedbackRating.SliderRating.aria-valuetext', {\n selectedRating: selectedRating,\n max: MAX,\n });\n }\n\n return hoveredIndex === -1\n ? getI18nText('FeedbackRating.SliderRating.aria-valuetext.empty')\n : getI18nText('FeedbackRating.SliderRating.aria-valuetext', {\n selectedRating: hoveredIndex + 1,\n max: MAX,\n });\n }\n\n render() {\n const { styles, readonly, getI18nText, value } = this.asProps;\n const { hoveredIndex } = this.state;\n\n const SSliderRating = Root;\n const label = this.getLabelText();\n\n if (readonly) {\n return (\n <SSliderRating render={Flex} gap={1} role='img' aria-label={label} use:tabIndex={-1}>\n {new Array(MAX).fill(null).map((_, index) => {\n return (\n <Box key={index} position={'relative'}>\n <SliderRating.Star />\n </Box>\n );\n })}\n </SSliderRating>\n );\n }\n\n const hoverValue = hoveredIndex + 1;\n\n const editModeLabel =\n hoverValue > 0 || value\n ? `${label}. ${getI18nText(\n 'FeedbackRating.SliderRating.ScreenReaderOnly.sliderDescriber',\n )}.`\n : label;\n\n return sstyled(styles)(\n <SSliderRating\n render={Flex}\n gap={1}\n onMouseLeave={this.handleMouseLeave}\n onKeyDown={this.handleKeyDown}\n role={'slider'}\n aria-orientation='horizontal'\n aria-valuemin={MIN}\n aria-valuemax={MAX}\n aria-valuetext={editModeLabel}\n aria-valuenow={hoverValue}\n >\n {new Array(MAX).fill(null).map((_, index) => {\n return (\n <Box key={index} position={'relative'}>\n <SliderRating.Star />\n </Box>\n );\n })}\n </SSliderRating>,\n );\n }\n}\n\nfunction Star(props: StarProps) {\n const SStar = Root;\n return sstyled(props.styles)(\n <SStar\n render={Box}\n tag={'svg'}\n role='none'\n width='24'\n height='24'\n viewBox='0 0 24 24'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n >\n {props.filled ? (\n <path d='M11.646 1.214a.4.4 0 0 1 .708 0l3.314 6.293 7 1.214a.4.4 0 0 1 .219.673l-4.952 5.104 1.012 7.044a.4.4 0 0 1-.573.416L12 18.818l-6.374 3.14a.4.4 0 0 1-.572-.416l1.01-7.044-4.95-5.104a.4.4 0 0 1 .218-.673l7-1.214 3.314-6.293Z' />\n ) : (\n <path\n d='M14.358 9.31 12 4.834 9.642 9.31l-4.985.864 3.526 3.634-.72 5.014L12 16.588l4.537 2.235-.72-5.014 3.526-3.634-4.985-.864Zm8.31-.59a.4.4 0 0 1 .219.674l-4.952 5.104 1.012 7.044a.4.4 0 0 1-.573.416L12 18.818l-6.374 3.14a.4.4 0 0 1-.572-.416l1.01-7.044-4.95-5.104a.4.4 0 0 1 .218-.673l7-1.214 3.314-6.293a.4.4 0 0 1 .708 0l3.314 6.293 7 1.214Z'\n fillRule='evenodd'\n clipRule='evenodd'\n />\n )}\n </SStar>,\n );\n}\nStar.displayName = 'Star';\n\nconst SliderRating = createComponent(SliderRatingRoot, {\n Star,\n}) as Intergalactic.Component<typeof Flex, SliderRatingProps> & {\n Star: Intergalactic.Component<typeof Box, StarProps>;\n};\n\nexport default SliderRating;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SliderRating.js","names":["React","createComponent","Component","Root","sstyled","Flex","Box","style","_sstyled","insert","uniqueIDEnhancement","i18nEnhance","localizedMessages","MIN","MAX","SliderRatingRoot","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty","_assertThisInitialized","hoveredIndex","clickedIndex","newValue","e","readonly","asProps","setValue","index","setState","_this$asProps","onChange","value","event","includes","key","preventDefault","state","direction","_createClass","getStarProps","_","_this$asProps2","filled","onClick","handleClick","onMouseEnter","undefined","handleMouseEnder","hovered","getLabelText","_this$asProps3","getI18nText","selectedRating","max","render","_ref","_ref3","_this$asProps4","styles","SSliderRating","label","createElement","_assignProps","fill","map","position","SliderRating","Star","hoverValue","editModeLabel","cn","_objectSpread","_assignProps2","handleMouseLeave","handleKeyDown","i18n","locale","props","_ref2","arguments[0]","_ref4","SStar","_assignProps3","displayName"],"sources":["../../../../src/component/slider-rating/SliderRating.tsx"],"sourcesContent":["import React from 'react';\nimport { createComponent, Component, Root, sstyled, Intergalactic } from '@semcore/core';\nimport { Flex, Box, BoxProps } from '@semcore/flex-box';\nimport style from '../../style/slider-rating.shadow.css';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport { localizedMessages } from '../../translations/__intergalactic-dynamic-locales';\n\ntype SliderRatingProps = {\n value: number;\n onChange?: (value: number) => void;\n readonly?: boolean;\n};\n\ntype State = {\n hoveredIndex: number;\n clickedIndex: number;\n};\n\ntype StarProps = BoxProps & {\n filled?: boolean;\n};\n\nconst MIN = 1;\nconst MAX = 5;\n\nclass SliderRatingRoot extends Component<\n SliderRatingProps,\n {},\n State,\n typeof SliderRatingRoot.enhance\n> {\n static displayName = 'SliderRating';\n static style = style;\n\n static enhance = [uniqueIDEnhancement(), i18nEnhance(localizedMessages)] as const;\n\n state: State = {\n hoveredIndex: -1,\n clickedIndex: -1,\n };\n\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n handleClick = (newValue: number) => (e: React.SyntheticEvent<SVGElement>) => {\n const { readonly } = this.asProps;\n\n if (!readonly) {\n this.setValue(newValue);\n }\n };\n\n handleMouseEnder = (index: number) => () => {\n this.setState({ hoveredIndex: index });\n };\n\n handleMouseLeave = () => {\n this.setState({ hoveredIndex: -1 });\n };\n\n getStarProps(_: any, index: number) {\n const { value, readonly } = this.asProps;\n const { hoveredIndex } = this.state;\n\n return {\n filled: value ? index + 1 <= value || index <= hoveredIndex : index <= hoveredIndex,\n onClick: this.handleClick(index + 1),\n onMouseEnter: readonly ? undefined : this.handleMouseEnder(index),\n hovered: hoveredIndex === index,\n };\n }\n\n setValue = (newValue: number) => {\n const { onChange, value } = this.asProps;\n\n if (onChange) {\n onChange(newValue);\n }\n\n if (newValue <= value) {\n this.setState({ clickedIndex: newValue, hoveredIndex: -1 });\n } else {\n this.setState({ clickedIndex: -1, hoveredIndex: -1 });\n }\n };\n\n handleKeyDown = (event: React.KeyboardEvent) => {\n if (!['ArrowLeft', 'ArrowRight', 'Enter'].includes(event.key)) return;\n event.preventDefault();\n\n if (event.key === 'Enter') {\n const { hoveredIndex } = this.state;\n\n this.setValue(hoveredIndex + 1);\n } else {\n const { value } = this.asProps;\n const { hoveredIndex } = this.state;\n\n const direction = event.key === 'ArrowLeft' ? -1 : 1;\n let newValue = hoveredIndex === -1 ? value + direction : hoveredIndex + 1 + direction;\n\n if (newValue > MAX) newValue = MAX;\n if (newValue < MIN) newValue = MIN;\n\n this.setState({ hoveredIndex: newValue - 1 });\n }\n };\n\n getLabelText() {\n const { hoveredIndex } = this.state;\n const { readonly, value, getI18nText } = this.asProps;\n\n if (readonly) {\n return getI18nText('FeedbackRating.SliderRating.aria-valuetext.readonly', {\n selectedRating: value,\n max: MAX,\n });\n }\n\n if (value) {\n const selectedRating = hoveredIndex > -1 ? hoveredIndex + 1 : value;\n return getI18nText('FeedbackRating.SliderRating.aria-valuetext', {\n selectedRating: selectedRating,\n max: MAX,\n });\n }\n\n return hoveredIndex === -1\n ? getI18nText('FeedbackRating.SliderRating.aria-valuetext.empty')\n : getI18nText('FeedbackRating.SliderRating.aria-valuetext', {\n selectedRating: hoveredIndex + 1,\n max: MAX,\n });\n }\n\n render() {\n const { styles, readonly, getI18nText, value } = this.asProps;\n const { hoveredIndex } = this.state;\n\n const SSliderRating = Root;\n const label = this.getLabelText();\n\n if (readonly) {\n return (\n <SSliderRating render={Flex} gap={1} role='img' aria-label={label}>\n {new Array(MAX).fill(null).map((_, index) => {\n return (\n <Box key={index} position={'relative'}>\n <SliderRating.Star />\n </Box>\n );\n })}\n </SSliderRating>\n );\n }\n\n const hoverValue = hoveredIndex + 1;\n\n const editModeLabel =\n hoverValue > 0 || value\n ? `${label}. ${getI18nText(\n 'FeedbackRating.SliderRating.ScreenReaderOnly.sliderDescriber',\n )}.`\n : label;\n\n return sstyled(styles)(\n <SSliderRating\n render={Flex}\n gap={1}\n tabIndex={0}\n onMouseLeave={this.handleMouseLeave}\n onKeyDown={this.handleKeyDown}\n role={'slider'}\n aria-orientation='horizontal'\n aria-valuemin={MIN}\n aria-valuemax={MAX}\n aria-valuetext={editModeLabel}\n aria-valuenow={hoverValue}\n >\n {new Array(MAX).fill(null).map((_, index) => {\n return (\n <Box key={index} position={'relative'}>\n <SliderRating.Star />\n </Box>\n );\n })}\n </SSliderRating>,\n );\n }\n}\n\nfunction Star(props: StarProps) {\n const SStar = Root;\n return sstyled(props.styles)(\n <SStar\n render={Box}\n tag={'svg'}\n role='none'\n width='24'\n height='24'\n viewBox='0 0 24 24'\n fill='none'\n xmlns='http://www.w3.org/2000/svg'\n >\n {props.filled ? (\n <path d='M11.646 1.214a.4.4 0 0 1 .708 0l3.314 6.293 7 1.214a.4.4 0 0 1 .219.673l-4.952 5.104 1.012 7.044a.4.4 0 0 1-.573.416L12 18.818l-6.374 3.14a.4.4 0 0 1-.572-.416l1.01-7.044-4.95-5.104a.4.4 0 0 1 .218-.673l7-1.214 3.314-6.293Z' />\n ) : (\n <path\n d='M14.358 9.31 12 4.834 9.642 9.31l-4.985.864 3.526 3.634-.72 5.014L12 16.588l4.537 2.235-.72-5.014 3.526-3.634-4.985-.864Zm8.31-.59a.4.4 0 0 1 .219.674l-4.952 5.104 1.012 7.044a.4.4 0 0 1-.573.416L12 18.818l-6.374 3.14a.4.4 0 0 1-.572-.416l1.01-7.044-4.95-5.104a.4.4 0 0 1 .218-.673l7-1.214 3.314-6.293a.4.4 0 0 1 .708 0l3.314 6.293 7 1.214Z'\n fillRule='evenodd'\n clipRule='evenodd'\n />\n )}\n </SStar>,\n );\n}\nStar.displayName = 'Star';\n\nconst SliderRating = createComponent(SliderRatingRoot, {\n Star,\n}) as Intergalactic.Component<typeof Flex, SliderRatingProps> & {\n Star: Intergalactic.Component<typeof Box, StarProps>;\n};\n\nexport default SliderRating;\n"],"mappings":";;;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,EAAEC,SAAS,EAAEC,IAAI,EAAEC,OAAO,QAAuB,eAAe;AACxF,SAASC,IAAI,EAAEC,GAAG,QAAkB,mBAAmB;AAAC;AAAA,IAAAC,KAAA,+BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAExD,OAAOC,mBAAmB,MAAM,kCAAkC;AAClE,OAAOC,WAAW,MAAM,8CAA8C;AACtE,SAASC,iBAAiB,QAAQ,oDAAoD;AAiBtF,IAAMC,GAAG,GAAG,CAAC;AACb,IAAMC,GAAG,GAAG,CAAC;AAAC,IAERC,gBAAgB,0BAAAC,UAAA;EAAAC,SAAA,CAAAF,gBAAA,EAAAC,UAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,gBAAA;EAAA,SAAAA,iBAAA;IAAA,IAAAK,KAAA;IAAAC,eAAA,OAAAN,gBAAA;IAAA,SAAAO,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAP,KAAA,GAAAF,MAAA,CAAAU,IAAA,CAAAC,KAAA,CAAAX,MAAA,SAAAY,MAAA,CAAAL,IAAA;IAAAM,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,YAWL;MACba,YAAY,EAAE,CAAC,CAAC;MAChBC,YAAY,EAAE,CAAC;IACjB,CAAC;IAAAH,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,kBAOa,UAACe,QAAgB;MAAA,OAAK,UAACC,CAAmC,EAAK;QAC3E,IAAQC,QAAQ,GAAKjB,KAAA,CAAKkB,OAAO,CAAzBD,QAAQ;QAEhB,IAAI,CAACA,QAAQ,EAAE;UACbjB,KAAA,CAAKmB,QAAQ,CAACJ,QAAQ,CAAC;QACzB;MACF,CAAC;IAAA;IAAAJ,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,uBAEkB,UAACoB,KAAa;MAAA,OAAK,YAAM;QAC1CpB,KAAA,CAAKqB,QAAQ,CAAC;UAAER,YAAY,EAAEO;QAAM,CAAC,CAAC;MACxC,CAAC;IAAA;IAAAT,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,uBAEkB,YAAM;MACvBA,KAAA,CAAKqB,QAAQ,CAAC;QAAER,YAAY,EAAE,CAAC;MAAE,CAAC,CAAC;IACrC,CAAC;IAAAF,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,eAcU,UAACe,QAAgB,EAAK;MAC/B,IAAAO,aAAA,GAA4BtB,KAAA,CAAKkB,OAAO;QAAhCK,QAAQ,GAAAD,aAAA,CAARC,QAAQ;QAAEC,KAAK,GAAAF,aAAA,CAALE,KAAK;MAEvB,IAAID,QAAQ,EAAE;QACZA,QAAQ,CAACR,QAAQ,CAAC;MACpB;MAEA,IAAIA,QAAQ,IAAIS,KAAK,EAAE;QACrBxB,KAAA,CAAKqB,QAAQ,CAAC;UAAEP,YAAY,EAAEC,QAAQ;UAAEF,YAAY,EAAE,CAAC;QAAE,CAAC,CAAC;MAC7D,CAAC,MAAM;QACLb,KAAA,CAAKqB,QAAQ,CAAC;UAAEP,YAAY,EAAE,CAAC,CAAC;UAAED,YAAY,EAAE,CAAC;QAAE,CAAC,CAAC;MACvD;IACF,CAAC;IAAAF,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,oBAEe,UAACyB,KAA0B,EAAK;MAC9C,IAAI,CAAC,CAAC,WAAW,EAAE,YAAY,EAAE,OAAO,CAAC,CAACC,QAAQ,CAACD,KAAK,CAACE,GAAG,CAAC,EAAE;MAC/DF,KAAK,CAACG,cAAc,EAAE;MAEtB,IAAIH,KAAK,CAACE,GAAG,KAAK,OAAO,EAAE;QACzB,IAAQd,YAAY,GAAKb,KAAA,CAAK6B,KAAK,CAA3BhB,YAAY;QAEpBb,KAAA,CAAKmB,QAAQ,CAACN,YAAY,GAAG,CAAC,CAAC;MACjC,CAAC,MAAM;QACL,IAAQW,MAAK,GAAKxB,KAAA,CAAKkB,OAAO,CAAtBM,KAAK;QACb,IAAQX,aAAY,GAAKb,KAAA,CAAK6B,KAAK,CAA3BhB,YAAY;QAEpB,IAAMiB,SAAS,GAAGL,KAAK,CAACE,GAAG,KAAK,WAAW,GAAG,CAAC,CAAC,GAAG,CAAC;QACpD,IAAIZ,QAAQ,GAAGF,aAAY,KAAK,CAAC,CAAC,GAAGW,MAAK,GAAGM,SAAS,GAAGjB,aAAY,GAAG,CAAC,GAAGiB,SAAS;QAErF,IAAIf,QAAQ,GAAGrB,GAAG,EAAEqB,QAAQ,GAAGrB,GAAG;QAClC,IAAIqB,QAAQ,GAAGtB,GAAG,EAAEsB,QAAQ,GAAGtB,GAAG;QAElCO,KAAA,CAAKqB,QAAQ,CAAC;UAAER,YAAY,EAAEE,QAAQ,GAAG;QAAE,CAAC,CAAC;MAC/C;IACF,CAAC;IAAA,OAAAf,KAAA;EAAA;EAAA+B,YAAA,CAAApC,gBAAA;IAAAgC,GAAA;IAAAH,KAAA,EA9CD,SAAAQ,aAAaC,CAAM,EAAEb,KAAa,EAAE;MAClC,IAAAc,cAAA,GAA4B,IAAI,CAAChB,OAAO;QAAhCM,KAAK,GAAAU,cAAA,CAALV,KAAK;QAAEP,QAAQ,GAAAiB,cAAA,CAARjB,QAAQ;MACvB,IAAQJ,YAAY,GAAK,IAAI,CAACgB,KAAK,CAA3BhB,YAAY;MAEpB,OAAO;QACLsB,MAAM,EAAEX,KAAK,GAAGJ,KAAK,GAAG,CAAC,IAAII,KAAK,IAAIJ,KAAK,IAAIP,YAAY,GAAGO,KAAK,IAAIP,YAAY;QACnFuB,OAAO,EAAE,IAAI,CAACC,WAAW,CAACjB,KAAK,GAAG,CAAC,CAAC;QACpCkB,YAAY,EAAErB,QAAQ,GAAGsB,SAAS,GAAG,IAAI,CAACC,gBAAgB,CAACpB,KAAK,CAAC;QACjEqB,OAAO,EAAE5B,YAAY,KAAKO;MAC5B,CAAC;IACH;EAAC;IAAAO,GAAA;IAAAH,KAAA,EAsCD,SAAAkB,aAAA,EAAe;MACb,IAAQ7B,YAAY,GAAK,IAAI,CAACgB,KAAK,CAA3BhB,YAAY;MACpB,IAAA8B,cAAA,GAAyC,IAAI,CAACzB,OAAO;QAA7CD,QAAQ,GAAA0B,cAAA,CAAR1B,QAAQ;QAAEO,KAAK,GAAAmB,cAAA,CAALnB,KAAK;QAAEoB,WAAW,GAAAD,cAAA,CAAXC,WAAW;MAEpC,IAAI3B,QAAQ,EAAE;QACZ,OAAO2B,WAAW,CAAC,qDAAqD,EAAE;UACxEC,cAAc,EAAErB,KAAK;UACrBsB,GAAG,EAAEpD;QACP,CAAC,CAAC;MACJ;MAEA,IAAI8B,KAAK,EAAE;QACT,IAAMqB,cAAc,GAAGhC,YAAY,GAAG,CAAC,CAAC,GAAGA,YAAY,GAAG,CAAC,GAAGW,KAAK;QACnE,OAAOoB,WAAW,CAAC,4CAA4C,EAAE;UAC/DC,cAAc,EAAEA,cAAc;UAC9BC,GAAG,EAAEpD;QACP,CAAC,CAAC;MACJ;MAEA,OAAOmB,YAAY,KAAK,CAAC,CAAC,GACtB+B,WAAW,CAAC,kDAAkD,CAAC,GAC/DA,WAAW,CAAC,4CAA4C,EAAE;QACxDC,cAAc,EAAEhC,YAAY,GAAG,CAAC;QAChCiC,GAAG,EAAEpD;MACP,CAAC,CAAC;IACR;EAAC;IAAAiC,GAAA;IAAAH,KAAA,EAED,SAAAuB,OAAA,EAAS;MAAA,IAAAC,IAAA,QAAA9B,OAAA;QAAA+B,KAAA;MACP,IAAAC,cAAA,GAAiD,IAAI,CAAChC,OAAO;QAArDiC,MAAM,GAAAD,cAAA,CAANC,MAAM;QAAElC,QAAQ,GAAAiC,cAAA,CAARjC,QAAQ;QAAE2B,WAAW,GAAAM,cAAA,CAAXN,WAAW;QAAEpB,KAAK,GAAA0B,cAAA,CAAL1B,KAAK;MAC5C,IAAQX,YAAY,GAAK,IAAI,CAACgB,KAAK,CAA3BhB,YAAY;MAEpB,IAAMuC,aAAa,GA4BPnE,IAAI;MA3BhB,IAAMoE,KAAK,GAAG,IAAI,CAACX,YAAY,EAAE;MAEjC,IAAIzB,QAAQ,EAAE;QACZ,oBACErC,KAAA,CAAA0E,aAAA,CAACF,aAAa,EAAAG,YAAA;UAAA,OAAoB,CAAC;UAAA,QAAO,KAAK;UAAA,cAAaF;QAAK,GAAAL,IAAA,GAC9D,IAAI1C,KAAK,CAACZ,GAAG,CAAC,CAAC8D,IAAI,CAAC,IAAI,CAAC,CAACC,GAAG,CAAC,UAACxB,CAAC,EAAEb,KAAK,EAAK;UAC3C,oBACExC,KAAA,CAAA0E,aAAA,CAACpE,GAAG;YAACyC,GAAG,EAAEP,KAAM;YAACsC,QAAQ,EAAE;UAAW,gBACpC9E,KAAA,CAAA0E,aAAA,CAACK,YAAY,CAACC,IAAI,OAAG,CACjB;QAEV,CAAC,CAAC,CACY;MAEpB;MAEA,IAAMC,UAAU,GAAGhD,YAAY,GAAG,CAAC;MAEnC,IAAMiD,aAAa,GACjBD,UAAU,GAAG,CAAC,IAAIrC,KAAK,MAAAd,MAAA,CAChB2C,KAAK,QAAA3C,MAAA,CAAKkC,WAAW,CACtB,8DAA8D,CAC/D,SACDS,KAAK;MAEX,OAAAJ,KAAA,GAAOjE,OAAO,CAACmE,MAAM,CAAC,eACpBvE,KAAA,CAAA0E,aAAA,CAACF,aAAa,EAAAH,KAAA,CAAAc,EAAA,kBAAAC,aAAA,KAAAC,aAAA;QAAA,OAEP,CAAC;QAAA,YACI,CAAC;QAAA,gBACG,IAAI,CAACC,gBAAgB;QAAA,aACxB,IAAI,CAACC,aAAa;QAAA,QACvB,QAAQ;QAAA,oBACG,YAAY;QAAA,iBACd1E,GAAG;QAAA,iBACHC,GAAG;QAAA,kBACFoE,aAAa;QAAA,iBACdD;MAAU,GAAAb,IAAA,KAExB,IAAI1C,KAAK,CAACZ,GAAG,CAAC,CAAC8D,IAAI,CAAC,IAAI,CAAC,CAACC,GAAG,CAAC,UAACxB,CAAC,EAAEb,KAAK,EAAK;QAC3C,oBACExC,KAAA,CAAA0E,aAAA,CAACpE,GAAG;UAACyC,GAAG,EAAEP,KAAM;UAACsC,QAAQ,EAAE;QAAW,gBACpC9E,KAAA,CAAA0E,aAAA,CAACK,YAAY,CAACC,IAAI,OAAG,CACjB;MAEV,CAAC,CAAC,CACY;IAEpB;EAAC;EAAA,OAAAjE,gBAAA;AAAA,EArK4Bb,SAAS;AAAA6B,eAAA,CAAlChB,gBAAgB,iBAMC,cAAc;AAAAgB,eAAA,CAN/BhB,gBAAgB,WAOLR,KAAK;AAAAwB,eAAA,CAPhBhB,gBAAgB,aASH,CAACL,mBAAmB,EAAE,EAAEC,WAAW,CAACC,iBAAiB,CAAC,CAAC;AAAAmB,eAAA,CATpEhB,gBAAgB,kBAgBE;EACpByE,IAAI,EAAE5E,iBAAiB;EACvB6E,MAAM,EAAE;AACV,CAAC;AAqJH,SAAST,IAAIA,CAACU,KAAgB,EAAE;EAAA,IAAAC,KAAA,GAAAC,YAAA;IAAAC,KAAA;EAC9B,IAAMC,KAAK,GAGCxF,GAAG;EAFf,OAAAuF,KAAA,GAAOzF,OAAO,CAACsF,KAAK,CAACnB,MAAM,CAAC,eAC1BvE,KAAA,CAAA0E,aAAA,CAACoB,KAAK,EAAAD,KAAA,CAAAV,EAAA,UAAAC,aAAA,KAAAW,aAAA;IAAA,OAEC,KAAK;IAAA,QACL,MAAM;IAAA,SACL,IAAI;IAAA,UACH,IAAI;IAAA,WACH,WAAW;IAAA,QACd,MAAM;IAAA,SACL;EAA4B,GAAAJ,KAAA,KAEjCD,KAAK,CAACnC,MAAM,gBACXvD,KAAA,CAAA0E,aAAA,SAAAmB,KAAA,CAAAV,EAAA;IAAA,KAAQ;EAAiO,GAAG,gBAE5OnF,KAAA,CAAA0E,aAAA,SAAAmB,KAAA,CAAAV,EAAA;IAAA,KACI,sVAAsV;IAAA,YAC/U,SAAS;IAAA,YACT;EAAS,GAErB,CACK;AAEZ;AACAH,IAAI,CAACgB,WAAW,GAAG,MAAM;AAEzB,IAAMjB,YAAY,GAAG9E,eAAe,CAACc,gBAAgB,EAAE;EACrDiE,IAAI,EAAJA;AACF,CAAC,CAEA;AAED,eAAeD,YAAY"}
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":["default","FeedbackRating"],"sources":["../../src/index.d.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"index.d.js","names":["default","FeedbackRating"],"sources":["../../src/index.d.ts"],"sourcesContent":["import { FormProps, FieldProps, FieldInputProps, FieldMetaState } from 'react-final-form';\n\nimport { Intergalactic } from '@semcore/core';\nimport Button from '@semcore/button';\nimport { NoticeSmart } from '@semcore/notice';\nimport { Box } from '@semcore/flex-box';\n\nimport { default as FeedbackRating } from './component/feedback-rating/FeedbackRating';\n\n/** @deprecated */\nexport type IFeedbackForm = FeedbackFormProps;\nexport type FeedbackFormProps = FormProps & {\n /* The event is called when the form is submitted */\n onSubmit: (values: any, form: any, callback?: (errors?: {}) => void) => {} | Promise<{}> | void;\n /**\n * The property is in charge of the spinner showing\n * */\n loading?: boolean;\n /**\n * Color of container spinner; you can use your own color\n */\n background?: string;\n /** Spinner theme. There are several default themes or you can use your own color\n * @default dark\n **/\n theme?: 'dark' | 'invert' | string;\n};\n\ndeclare const FeedbackForm: Intergalactic.Component<'form', FeedbackFormProps> & {\n Item: Intergalactic.Component<\n 'div',\n FieldProps<any, any>,\n { input: FieldInputProps<any> & { state: 'normal' | 'invalid' }; meta: FieldMetaState<any> }\n >;\n Success: typeof Box;\n Submit: typeof Button;\n Cancel: typeof Button;\n Notice: typeof NoticeSmart;\n};\n\nexport default FeedbackForm;\n\nexport { FeedbackRating };\n"],"mappings":"AAOA,SAASA,OAAO,IAAIC,cAAc,QAAQ,4CAA4C;;AAEtF;;AAiCA,SAASA,cAAc"}
|
|
@@ -2,17 +2,12 @@ SSliderRating SStar {
|
|
|
2
2
|
transition: all calc(var(--intergalactic-duration-control, 200) * 1ms) ease-out;
|
|
3
3
|
}
|
|
4
4
|
|
|
5
|
-
SSliderRating
|
|
5
|
+
SSliderRating:focus-visible SStar[hovered],
|
|
6
6
|
SSliderRating SStar:hover {
|
|
7
7
|
cursor: pointer;
|
|
8
8
|
transform: scale(1.3);
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
SSliderRating[keyboardFocused] {
|
|
12
|
-
outline: none;
|
|
13
|
-
box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
|
|
14
|
-
}
|
|
15
|
-
|
|
16
11
|
SSliderRating[readonly] SStar:hover {
|
|
17
12
|
cursor: default;
|
|
18
13
|
transform: none;
|
package/lib/esm/FeedbackForm.mjs
CHANGED
|
@@ -7,8 +7,7 @@ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitial
|
|
|
7
7
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
8
8
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
|
-
import { sstyled } from "@semcore/
|
|
11
|
-
import createComponent, { sstyled as sstyled$1, Component, assignProps } from "@semcore/core";
|
|
10
|
+
import { createComponent, sstyled, Component, assignProps } from "@semcore/core";
|
|
12
11
|
import React from "react";
|
|
13
12
|
import { Form, Field } from "react-final-form";
|
|
14
13
|
import createFocusDecorator from "final-form-focus";
|
|
@@ -24,17 +23,17 @@ var style = (
|
|
|
24
23
|
/*__reshadow_css_start__*/
|
|
25
24
|
(sstyled.insert(
|
|
26
25
|
/*__inner_css_start__*/
|
|
27
|
-
`.
|
|
26
|
+
`.___SFeedbackForm_glabv_gg_{max-width:320px}.___SCancel_glabv_gg_,.___SSubmit_glabv_gg_{display:inline-flex;margin-right:var(--intergalactic-spacing-2x, 8px)}.___SNotice_glabv_gg_{padding:var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-4x, 16px);border-width:1px 0 0;border-top-style:solid;border-radius:0 0 var(--intergalactic-surface-rounded, 6px) var(--intergalactic-surface-rounded, 6px)}.___SSuccess_glabv_gg_{display:flex;align-items:center;flex-direction:column;width:320px;padding:var(--intergalactic-spacing-10x, 40px);box-sizing:border-box;outline:0}.___SEmail_glabv_gg_{margin-bottom:calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));width:80px;height:80px;background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345E0A8'/%3E%3Cpath d='M29 45.2852L29.2 45.6352C35.39 42.1852 53.39 31.9652 56.73 35.1052C55.6 32.0052 39.7 35.4352 29 45.2852Z' fill='white'/%3E%3Cpath d='M28.44 31.6343C26.63 37.6343 19.23 56.1043 15 61.9443L18 62.8543L19.58 61.5343C23.8 51.9843 29.58 35.5343 29.89 30.0743C29.39 29.8143 28.93 30.2143 28.44 31.6343Z' fill='white'/%3E%3Cpath d='M15 62.0078C19.23 56.1678 26.63 37.7378 28.44 31.6678C30.25 25.5978 33.49 37.6678 31.67 42.7878' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M28 45.9424C38.68 35.5824 55.27 31.9424 56.43 35.1024C57.12 36.9924 43 41.3624 38.02 47.4224' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.45 21.93C41.21 20.77 35.86 19.04 33 18.24C37.12 16.41 70 4.24 72.67 3C71.75 7.11 67.75 21.28 65.96 27.93C61.13 26.25 56.23 24.78 53.03 23.74C51.0298 26.3907 49.2219 29.1812 47.62 32.09C46.44 28.23 45.29 23.77 44.45 21.93Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M45 22.08L61.74 11' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M53 23.73L72.64 3' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48 32.58L55.86 25' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.23 30.77L51.69 25.13L52.66 24L54.73 24.61L55.16 24.48L51.8 27.91L49.33 30.18L48 31.29L48.23 30.77Z' fill='black'/%3E%3Cpath d='M33.81 22L23 27.12' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.89 23L34 27.37' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.04 29L58 38.85' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.68 41C50.29 43.42 44.81 49.52 43 51.12' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.17 44C51.31 46.09 48.33 51.76 46 54.6' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.86 49C54.37 53.48 36.31 72.72 35 73.78' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cmask id='mask0_11950_117175' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='4' y='6' width='73' height='73'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345DFA7'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_11950_117175)'%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' fill='black'/%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E%0A")}`,
|
|
28
27
|
/*__inner_css_end__*/
|
|
29
|
-
"
|
|
28
|
+
"glabv_gg_"
|
|
30
29
|
), /*__reshadow_css_end__*/
|
|
31
30
|
{
|
|
32
|
-
"__SFeedbackForm": "
|
|
33
|
-
"__SSubmit": "
|
|
34
|
-
"__SCancel": "
|
|
35
|
-
"__SNotice": "
|
|
36
|
-
"__SSuccess": "
|
|
37
|
-
"__SEmail": "
|
|
31
|
+
"__SFeedbackForm": "___SFeedbackForm_glabv_gg_",
|
|
32
|
+
"__SSubmit": "___SSubmit_glabv_gg_",
|
|
33
|
+
"__SCancel": "___SCancel_glabv_gg_",
|
|
34
|
+
"__SNotice": "___SNotice_glabv_gg_",
|
|
35
|
+
"__SSuccess": "___SSuccess_glabv_gg_",
|
|
36
|
+
"__SEmail": "___SEmail_glabv_gg_"
|
|
38
37
|
})
|
|
39
38
|
);
|
|
40
39
|
var FeedbackForm = /* @__PURE__ */ function(_Component) {
|
|
@@ -67,7 +66,7 @@ var FeedbackForm = /* @__PURE__ */ function(_Component) {
|
|
|
67
66
|
decorators: [this.focusDecorator]
|
|
68
67
|
}, other), function(api) {
|
|
69
68
|
var _ref4;
|
|
70
|
-
return _ref4 = sstyled
|
|
69
|
+
return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref4.cn("SpinContainer", {
|
|
71
70
|
"background": background,
|
|
72
71
|
"theme": theme,
|
|
73
72
|
"size": "xl",
|
|
@@ -120,7 +119,7 @@ function Success(props) {
|
|
|
120
119
|
var Children = props.Children, styles = props.styles;
|
|
121
120
|
var SSuccess = Box;
|
|
122
121
|
var SEmail = "div";
|
|
123
|
-
return _ref5 = sstyled
|
|
122
|
+
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SSuccess, _ref5.cn("SSuccess", _objectSpread({}, assignProps({
|
|
124
123
|
"tabIndex": -1
|
|
125
124
|
}, _ref))), /* @__PURE__ */ React.createElement(SEmail, _ref5.cn("SEmail", {
|
|
126
125
|
"aria-hidden": true
|
|
@@ -131,7 +130,7 @@ function Cancel(props) {
|
|
|
131
130
|
var _ref2 = arguments[0], _ref6;
|
|
132
131
|
var styles = props.styles;
|
|
133
132
|
var SCancel = Button;
|
|
134
|
-
return _ref6 = sstyled
|
|
133
|
+
return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SCancel, _ref6.cn("SCancel", _objectSpread({}, assignProps({
|
|
135
134
|
"type": "reset",
|
|
136
135
|
"use": "secondary",
|
|
137
136
|
"theme": "muted"
|
|
@@ -141,7 +140,7 @@ function Notice(props) {
|
|
|
141
140
|
var _ref3 = arguments[0], _ref7;
|
|
142
141
|
var styles = props.styles, _props$theme = props.theme, theme = _props$theme === void 0 ? "muted" : _props$theme, _props$use = props.use, use = _props$use === void 0 ? "secondary" : _props$use;
|
|
143
142
|
var SNotice = NoticeSmart;
|
|
144
|
-
return _ref7 = sstyled
|
|
143
|
+
return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SNotice, _ref7.cn("SNotice", _objectSpread({}, assignProps({
|
|
145
144
|
"use:theme": theme,
|
|
146
145
|
"use:use": use
|
|
147
146
|
}, _ref3))));
|
|
@@ -5,8 +5,7 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
6
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
7
7
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
8
|
-
import { sstyled } from "@semcore/
|
|
9
|
-
import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
|
|
8
|
+
import { sstyled, createComponent, assignProps, Component } from "@semcore/core";
|
|
10
9
|
import React from "react";
|
|
11
10
|
import { Box } from "@semcore/flex-box";
|
|
12
11
|
import Checkbox from "@semcore/checkbox";
|
|
@@ -16,13 +15,13 @@ var style = (
|
|
|
16
15
|
/*__reshadow_css_start__*/
|
|
17
16
|
(sstyled.insert(
|
|
18
17
|
/*__inner_css_start__*/
|
|
19
|
-
".
|
|
18
|
+
".___SCheckboxButton_nj35w_gg_{margin-top:var(--intergalactic-spacing-2x, 8px);border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:var(--intergalactic-rounded-medium, 6px)}.___SCheckboxButton_nj35w_gg_ label{width:100%;padding:var(--intergalactic-spacing-3x, 12px);box-sizing:border-box}.___SCheckboxButton_nj35w_gg_.__checked_nj35w_gg_{cursor:pointer;border-color:var(--intergalactic-border-info-active, #006dca);background-color:rgba(0,143,248,.1)}@media (hover:hover){.___SCheckboxButton_nj35w_gg_:hover{cursor:pointer;border-color:var(--intergalactic-border-info-active, #006dca);background-color:rgba(0,143,248,.1)}.___SCheckboxButton_nj35w_gg_.__checked_nj35w_gg_:hover{background-color:rgba(0,143,248,.2)}}",
|
|
20
19
|
/*__inner_css_end__*/
|
|
21
|
-
"
|
|
20
|
+
"nj35w_gg_"
|
|
22
21
|
), /*__reshadow_css_end__*/
|
|
23
22
|
{
|
|
24
|
-
"__SCheckboxButton": "
|
|
25
|
-
"_checked": "
|
|
23
|
+
"__SCheckboxButton": "___SCheckboxButton_nj35w_gg_",
|
|
24
|
+
"_checked": "__checked_nj35w_gg_"
|
|
26
25
|
})
|
|
27
26
|
);
|
|
28
27
|
var CheckboxButtonRoot = /* @__PURE__ */ function(_Component) {
|
|
@@ -41,7 +40,7 @@ var CheckboxButtonRoot = /* @__PURE__ */ function(_Component) {
|
|
|
41
40
|
var focused = _this$asProps.focused, other = _objectWithoutProperties(_this$asProps, _excluded);
|
|
42
41
|
var autoFocus = focused ? 20 : false;
|
|
43
42
|
var SCheckboxButton = Box;
|
|
44
|
-
return _ref2 = sstyled
|
|
43
|
+
return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(SCheckboxButton, _ref2.cn("SCheckboxButton", _objectSpread({}, assignProps({
|
|
45
44
|
"__excludeProps": ["onChange", "id", "type"]
|
|
46
45
|
}, _ref))), /* @__PURE__ */ React.createElement(Checkbox, _ref2.cn("Checkbox", _objectSpread({}, other)), /* @__PURE__ */ React.createElement(Checkbox.Value, {
|
|
47
46
|
autoFocus,
|
|
@@ -4,10 +4,10 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
|
|
|
4
4
|
import React from "react";
|
|
5
5
|
import { Field } from "react-final-form";
|
|
6
6
|
import Tooltip from "@semcore/tooltip";
|
|
7
|
-
import pick from "@semcore/
|
|
8
|
-
import uniqueIDEnhancement from "@semcore/
|
|
9
|
-
import { assignProps } from "@semcore/
|
|
10
|
-
import propsForElement from "@semcore/
|
|
7
|
+
import pick from "@semcore/core/lib/utils/pick";
|
|
8
|
+
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
9
|
+
import { assignProps } from "@semcore/core";
|
|
10
|
+
import propsForElement from "@semcore/core/lib/utils/propsForElement";
|
|
11
11
|
var _excluded = ["Children", "tag", "uid", "tooltipProps"], _excluded2 = ["input", "meta"];
|
|
12
12
|
var deafultTooltipPropsList = ["title", "theme", "strategy", "modifiers", "placement", "interaction", "timeout", "visible", "defaultVisible", "onVisibleChange", "offset", "preventOverflow", "arrow", "flip", "computeStyles", "eventListeners", "onFirstUpdate"];
|
|
13
13
|
function FeedbackItem(_ref) {
|
|
@@ -7,14 +7,13 @@ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitial
|
|
|
7
7
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
8
8
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
|
-
import { sstyled } from "@semcore/
|
|
11
|
-
import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
|
|
10
|
+
import { sstyled, createComponent, assignProps, Component } from "@semcore/core";
|
|
12
11
|
import React from "react";
|
|
13
12
|
import { Field, Form } from "react-final-form";
|
|
14
13
|
import createFocusDecorator from "final-form-focus";
|
|
15
14
|
import SpinContainer from "@semcore/spin-container";
|
|
16
|
-
import i18nEnhance from "@semcore/
|
|
17
|
-
import uniqueIDEnhancement from "@semcore/
|
|
15
|
+
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
16
|
+
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
18
17
|
import Notice from "@semcore/notice";
|
|
19
18
|
import CheckM from "@semcore/icon/Check/m";
|
|
20
19
|
import WarnM from "@semcore/icon/Warning/m";
|
|
@@ -37,12 +36,12 @@ var style = (
|
|
|
37
36
|
/*__reshadow_css_start__*/
|
|
38
37
|
(sstyled.insert(
|
|
39
38
|
/*__inner_css_start__*/
|
|
40
|
-
".
|
|
39
|
+
".___SFeedbackRating_kmztw_gg_ ul{margin:0;padding:0;list-style:none}.___SFeedbackRating_kmztw_gg_ li{list-style:none}",
|
|
41
40
|
/*__inner_css_end__*/
|
|
42
|
-
"
|
|
41
|
+
"kmztw_gg_"
|
|
43
42
|
), /*__reshadow_css_end__*/
|
|
44
43
|
{
|
|
45
|
-
"__SFeedbackRating": "
|
|
44
|
+
"__SFeedbackRating": "___SFeedbackRating_kmztw_gg_"
|
|
46
45
|
})
|
|
47
46
|
);
|
|
48
47
|
var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
@@ -219,7 +218,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
|
219
218
|
return item.type === "textarea" || item.type === "input" || item.type === "email";
|
|
220
219
|
});
|
|
221
220
|
var notificationId = this.getNoticeTextId();
|
|
222
|
-
return _ref4 = sstyled
|
|
221
|
+
return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(Box, assignProps({}, _ref2), /* @__PURE__ */ React.createElement(Notice, _ref4.cn("Notice", {
|
|
223
222
|
"visible": notificationVisible,
|
|
224
223
|
"aria-label": getI18nText("leaveFeedback"),
|
|
225
224
|
"tag": Flex,
|
|
@@ -254,7 +253,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
|
254
253
|
"decorators": [this.focusDecorator]
|
|
255
254
|
}, other)), function(api) {
|
|
256
255
|
var _ref5;
|
|
257
|
-
return _ref5 = sstyled
|
|
256
|
+
return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref5.cn("SpinContainer", {
|
|
258
257
|
"background": background,
|
|
259
258
|
"theme": theme,
|
|
260
259
|
"size": "xl",
|
|
@@ -345,7 +344,7 @@ function Header(props) {
|
|
|
345
344
|
var _ref3 = arguments[0], _ref6;
|
|
346
345
|
var styles = props.styles;
|
|
347
346
|
var SHeader = Text;
|
|
348
|
-
return _ref6 = sstyled
|
|
347
|
+
return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SHeader, _ref6.cn("SHeader", _objectSpread({}, assignProps({
|
|
349
348
|
"size": 300,
|
|
350
349
|
"tag": "h2",
|
|
351
350
|
"mb": 4,
|
|
@@ -5,30 +5,27 @@ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitial
|
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
6
|
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
7
7
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
8
|
-
import { sstyled } from "@semcore/
|
|
9
|
-
import createComponent, { assignProps, sstyled as sstyled$1, Component } from "@semcore/core";
|
|
8
|
+
import { sstyled, createComponent, assignProps, Component } from "@semcore/core";
|
|
10
9
|
import React from "react";
|
|
11
10
|
import { Box, Flex } from "@semcore/flex-box";
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import i18nEnhance from "@semcore/utils/lib/enhances/i18nEnhance";
|
|
11
|
+
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
12
|
+
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
15
13
|
import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
|
|
16
14
|
/*!__reshadow-styles__:"../../style/slider-rating.shadow.css"*/
|
|
17
15
|
var style = (
|
|
18
16
|
/*__reshadow_css_start__*/
|
|
19
17
|
(sstyled.insert(
|
|
20
18
|
/*__inner_css_start__*/
|
|
21
|
-
".
|
|
19
|
+
".___SSliderRating_111bn_gg_ .___SStar_111bn_gg_{transition:all calc(var(--intergalactic-duration-control, 200)*1ms) ease-out}.___SSliderRating_111bn_gg_:focus-visible .___SStar_111bn_gg_.__hovered_111bn_gg_{cursor:pointer;transform:scale(1.3)}@media (hover:hover){.___SSliderRating_111bn_gg_ .___SStar_111bn_gg_:hover{cursor:pointer;transform:scale(1.3)}.___SSliderRating_111bn_gg_.__readonly_111bn_gg_ .___SStar_111bn_gg_:hover{cursor:default;transform:none;transition:none}}.___SStar_111bn_gg_.__filled_111bn_gg_:active{animation:wobble .8s ease-in-out}.___SStar_111bn_gg_ path{fill:var(--intergalactic-slider-rating-normal, #a9abb6)}.___SStar_111bn_gg_.__filled_111bn_gg_ path{stroke-width:0;fill:var(--intergalactic-slider-rating-hover-active, #fdc23c)}",
|
|
22
20
|
/*__inner_css_end__*/
|
|
23
|
-
"
|
|
21
|
+
"111bn_gg_"
|
|
24
22
|
), /*__reshadow_css_end__*/
|
|
25
23
|
{
|
|
26
|
-
"__SSliderRating": "
|
|
27
|
-
"__SStar": "
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
"
|
|
31
|
-
"_filled": "__filled_1eilm_gg_"
|
|
24
|
+
"__SSliderRating": "___SSliderRating_111bn_gg_",
|
|
25
|
+
"__SStar": "___SStar_111bn_gg_",
|
|
26
|
+
"_hovered": "__hovered_111bn_gg_",
|
|
27
|
+
"_readonly": "__readonly_111bn_gg_",
|
|
28
|
+
"_filled": "__filled_111bn_gg_"
|
|
32
29
|
})
|
|
33
30
|
);
|
|
34
31
|
var MIN = 1;
|
|
@@ -151,8 +148,7 @@ var SliderRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
|
151
148
|
return /* @__PURE__ */ React.createElement(SSliderRating, assignProps({
|
|
152
149
|
"gap": 1,
|
|
153
150
|
"role": "img",
|
|
154
|
-
"aria-label": label
|
|
155
|
-
"use:tabIndex": -1
|
|
151
|
+
"aria-label": label
|
|
156
152
|
}, _ref), new Array(MAX).fill(null).map(function(_, index) {
|
|
157
153
|
return /* @__PURE__ */ React.createElement(Box, {
|
|
158
154
|
key: index,
|
|
@@ -162,8 +158,9 @@ var SliderRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
|
162
158
|
}
|
|
163
159
|
var hoverValue = hoveredIndex + 1;
|
|
164
160
|
var editModeLabel = hoverValue > 0 || value ? "".concat(label, ". ").concat(getI18nText("FeedbackRating.SliderRating.ScreenReaderOnly.sliderDescriber"), ".") : label;
|
|
165
|
-
return _ref3 = sstyled
|
|
161
|
+
return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SSliderRating, _ref3.cn("SSliderRating", _objectSpread({}, assignProps({
|
|
166
162
|
"gap": 1,
|
|
163
|
+
"tabIndex": 0,
|
|
167
164
|
"onMouseLeave": this.handleMouseLeave,
|
|
168
165
|
"onKeyDown": this.handleKeyDown,
|
|
169
166
|
"role": "slider",
|
|
@@ -184,7 +181,7 @@ var SliderRatingRoot = /* @__PURE__ */ function(_Component) {
|
|
|
184
181
|
}(Component);
|
|
185
182
|
_defineProperty(SliderRatingRoot, "displayName", "SliderRating");
|
|
186
183
|
_defineProperty(SliderRatingRoot, "style", style);
|
|
187
|
-
_defineProperty(SliderRatingRoot, "enhance", [
|
|
184
|
+
_defineProperty(SliderRatingRoot, "enhance", [uniqueIDEnhancement(), i18nEnhance(localizedMessages)]);
|
|
188
185
|
_defineProperty(SliderRatingRoot, "defaultProps", {
|
|
189
186
|
i18n: localizedMessages,
|
|
190
187
|
locale: "en"
|
|
@@ -192,7 +189,7 @@ _defineProperty(SliderRatingRoot, "defaultProps", {
|
|
|
192
189
|
function Star(props) {
|
|
193
190
|
var _ref2 = arguments[0], _ref4;
|
|
194
191
|
var SStar = Box;
|
|
195
|
-
return _ref4 = sstyled
|
|
192
|
+
return _ref4 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SStar, _ref4.cn("SStar", _objectSpread({}, assignProps({
|
|
196
193
|
"tag": "svg",
|
|
197
194
|
"role": "none",
|
|
198
195
|
"width": "24",
|
|
@@ -2,17 +2,12 @@ SSliderRating SStar {
|
|
|
2
2
|
transition: all calc(var(--intergalactic-duration-control, 200) * 1ms) ease-out;
|
|
3
3
|
}
|
|
4
4
|
|
|
5
|
-
SSliderRating
|
|
5
|
+
SSliderRating:focus-visible SStar[hovered],
|
|
6
6
|
SSliderRating SStar:hover {
|
|
7
7
|
cursor: pointer;
|
|
8
8
|
transform: scale(1.3);
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
SSliderRating[keyboardFocused] {
|
|
12
|
-
outline: none;
|
|
13
|
-
box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
|
|
14
|
-
}
|
|
15
|
-
|
|
16
11
|
SSliderRating[readonly] SStar:hover {
|
|
17
12
|
cursor: default;
|
|
18
13
|
transform: none;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const CheckboxButton: import("@semcore/core").ComponentType<unknown, {}, {}, {
|
|
1
|
+
declare const CheckboxButton: import("@semcore/core/lib/coreFactory").ComponentType<unknown, {}, {}, {
|
|
2
2
|
[key: string]: (arg: unknown) => void;
|
|
3
3
|
}, null>;
|
|
4
4
|
export default CheckboxButton;
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,10 +1,4 @@
|
|
|
1
|
-
import {
|
|
2
|
-
FormProps,
|
|
3
|
-
FieldProps,
|
|
4
|
-
FieldInputProps,
|
|
5
|
-
FieldMetaState,
|
|
6
|
-
FieldRenderProps,
|
|
7
|
-
} from 'react-final-form';
|
|
1
|
+
import { FormProps, FieldProps, FieldInputProps, FieldMetaState } from 'react-final-form';
|
|
8
2
|
|
|
9
3
|
import { Intergalactic } from '@semcore/core';
|
|
10
4
|
import Button from '@semcore/button';
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/feedback-form",
|
|
3
3
|
"description": "Semrush Feedback Form Component",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "16.0.0-prerelease.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,29 +14,26 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/
|
|
18
|
-
"@semcore/
|
|
19
|
-
"@semcore/
|
|
20
|
-
"@semcore/
|
|
21
|
-
"@semcore/
|
|
22
|
-
"@semcore/
|
|
23
|
-
"@semcore/
|
|
24
|
-
"@semcore/
|
|
25
|
-
"@semcore/
|
|
17
|
+
"@semcore/flex-box": "16.0.0-prerelease.0",
|
|
18
|
+
"@semcore/checkbox": "16.0.0-prerelease.0",
|
|
19
|
+
"@semcore/notice-bubble": "16.0.0-prerelease.0",
|
|
20
|
+
"@semcore/typography": "16.0.0-prerelease.0",
|
|
21
|
+
"@semcore/link": "16.0.0-prerelease.0",
|
|
22
|
+
"@semcore/modal": "16.0.0-prerelease.0",
|
|
23
|
+
"@semcore/illustration": "16.0.0-prerelease.0",
|
|
24
|
+
"@semcore/icon": "16.0.0-prerelease.0",
|
|
25
|
+
"@semcore/textarea": "16.0.0-prerelease.0",
|
|
26
|
+
"@semcore/input": "16.0.0-prerelease.0",
|
|
26
27
|
"final-form": "4.20.7",
|
|
27
|
-
"@semcore/button": "
|
|
28
|
-
"@semcore/
|
|
29
|
-
"@semcore/
|
|
30
|
-
"@semcore/
|
|
31
|
-
"@semcore/tooltip": "6.49.4",
|
|
32
|
-
"@semcore/utils": "4.48.5",
|
|
28
|
+
"@semcore/button": "16.0.0-prerelease.0",
|
|
29
|
+
"@semcore/notice": "16.0.0-prerelease.0",
|
|
30
|
+
"@semcore/spin-container": "16.0.0-prerelease.0",
|
|
31
|
+
"@semcore/tooltip": "16.0.0-prerelease.0",
|
|
33
32
|
"final-form-focus": "1.1.2",
|
|
34
33
|
"react-final-form": "6.5.9"
|
|
35
34
|
},
|
|
36
35
|
"peerDependencies": {
|
|
37
|
-
"@semcore/
|
|
38
|
-
"react": "16.8 - 18",
|
|
39
|
-
"react-dom": "16.8 - 18"
|
|
36
|
+
"@semcore/base-components": "^16.0.0-prerelease.0"
|
|
40
37
|
},
|
|
41
38
|
"repository": {
|
|
42
39
|
"type": "git",
|