@wordpress/components 25.9.0 → 25.10.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 +32 -0
- package/build/alignment-matrix-control/cell.js +8 -5
- package/build/alignment-matrix-control/cell.js.map +1 -1
- package/build/alignment-matrix-control/index.js +27 -43
- package/build/alignment-matrix-control/index.js.map +1 -1
- package/build/alignment-matrix-control/utils.js +29 -9
- package/build/alignment-matrix-control/utils.js.map +1 -1
- package/build/circular-option-picker/circular-option-picker-option.js +20 -39
- package/build/circular-option-picker/circular-option-picker-option.js.map +1 -1
- package/build/circular-option-picker/circular-option-picker.js +11 -32
- package/build/circular-option-picker/circular-option-picker.js.map +1 -1
- package/build/circular-option-picker/types.js.map +1 -1
- package/build/color-palette/index.js +7 -2
- package/build/color-palette/index.js.map +1 -1
- package/build/color-picker/component.js +12 -2
- package/build/color-picker/component.js.map +1 -1
- package/build/color-picker/picker.js +77 -1
- package/build/color-picker/picker.js.map +1 -1
- package/build/color-picker/styles.js +8 -8
- package/build/color-picker/styles.js.map +1 -1
- package/build/color-picker/types.js.map +1 -1
- package/build/composite/v2.js +43 -0
- package/build/composite/v2.js.map +1 -0
- package/build/confirm-dialog/component.js +74 -8
- package/build/confirm-dialog/component.js.map +1 -1
- package/build/confirm-dialog/types.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/control-points.js +13 -4
- package/build/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build/font-size-picker/utils.js +1 -1
- package/build/font-size-picker/utils.js.map +1 -1
- package/build/modal/index.js +45 -16
- package/build/modal/index.js.map +1 -1
- package/build/palette-edit/index.js +4 -0
- package/build/palette-edit/index.js.map +1 -1
- package/build/popover/index.js +34 -6
- package/build/popover/index.js.map +1 -1
- package/build/private-apis.js +9 -1
- package/build/private-apis.js.map +1 -1
- package/build/progress-bar/styles.js +5 -5
- package/build/progress-bar/styles.js.map +1 -1
- package/build/sandbox/index.js +1 -1
- package/build/sandbox/index.js.map +1 -1
- package/build/sandbox/index.native.js +1 -1
- package/build/sandbox/index.native.js.map +1 -1
- package/build/tabs/context.js +16 -0
- package/build/tabs/context.js.map +1 -0
- package/build/tabs/index.js +147 -0
- package/build/tabs/index.js.map +1 -0
- package/build/tabs/styles.js +38 -0
- package/build/tabs/styles.js.map +1 -0
- package/build/tabs/tab.js +46 -0
- package/build/tabs/tab.js.map +1 -0
- package/build/tabs/tablist.js +47 -0
- package/build/tabs/tablist.js.map +1 -0
- package/build/tabs/tabpanel.js +48 -0
- package/build/tabs/tabpanel.js.map +1 -0
- package/build/tabs/types.js +6 -0
- package/build/tabs/types.js.map +1 -0
- package/build/text/component.js +7 -6
- package/build/text/component.js.map +1 -1
- package/build/text/hook.js +6 -15
- package/build/text/hook.js.map +1 -1
- package/build/text/index.js.map +1 -1
- package/build/text/styles.js +7 -7
- package/build/text/styles.js.map +1 -1
- package/build/text/types.js.map +1 -1
- package/build/text/utils.js +17 -33
- package/build/text/utils.js.map +1 -1
- package/build/toggle-group-control/toggle-group-control-option-base/component.js +1 -0
- package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build/toolbar/toolbar/index.js +17 -10
- package/build/toolbar/toolbar/index.js.map +1 -1
- package/build/toolbar/toolbar/types.js.map +1 -1
- package/build/tools-panel/tools-panel-item/hook.js +2 -2
- package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
- package/build/tools-panel/types.js.map +1 -1
- package/build/unit-control/utils.js +108 -0
- package/build/unit-control/utils.js.map +1 -1
- package/build/utils/unit-values.js +1 -1
- package/build/utils/unit-values.js.map +1 -1
- package/build-module/alignment-matrix-control/cell.js +7 -4
- package/build-module/alignment-matrix-control/cell.js.map +1 -1
- package/build-module/alignment-matrix-control/index.js +27 -43
- package/build-module/alignment-matrix-control/index.js.map +1 -1
- package/build-module/alignment-matrix-control/utils.js +29 -8
- package/build-module/alignment-matrix-control/utils.js.map +1 -1
- package/build-module/circular-option-picker/circular-option-picker-option.js +20 -39
- package/build-module/circular-option-picker/circular-option-picker-option.js.map +1 -1
- package/build-module/circular-option-picker/circular-option-picker.js +10 -31
- package/build-module/circular-option-picker/circular-option-picker.js.map +1 -1
- package/build-module/circular-option-picker/types.js.map +1 -1
- package/build-module/color-palette/index.js +7 -2
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/color-picker/component.js +13 -3
- package/build-module/color-picker/component.js.map +1 -1
- package/build-module/color-picker/picker.js +78 -2
- package/build-module/color-picker/picker.js.map +1 -1
- package/build-module/color-picker/styles.js +8 -8
- package/build-module/color-picker/styles.js.map +1 -1
- package/build-module/color-picker/types.js.map +1 -1
- package/build-module/composite/v2.js +15 -0
- package/build-module/composite/v2.js.map +1 -0
- package/build-module/confirm-dialog/component.js +72 -7
- package/build-module/confirm-dialog/component.js.map +1 -1
- package/build-module/confirm-dialog/types.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js +13 -4
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build-module/font-size-picker/utils.js +1 -1
- package/build-module/font-size-picker/utils.js.map +1 -1
- package/build-module/modal/index.js +47 -18
- package/build-module/modal/index.js.map +1 -1
- package/build-module/palette-edit/index.js +4 -0
- package/build-module/palette-edit/index.js.map +1 -1
- package/build-module/popover/index.js +34 -6
- package/build-module/popover/index.js.map +1 -1
- package/build-module/private-apis.js +9 -1
- package/build-module/private-apis.js.map +1 -1
- package/build-module/progress-bar/styles.js +5 -5
- package/build-module/progress-bar/styles.js.map +1 -1
- package/build-module/sandbox/index.js +1 -1
- package/build-module/sandbox/index.js.map +1 -1
- package/build-module/sandbox/index.native.js +1 -1
- package/build-module/sandbox/index.native.js.map +1 -1
- package/build-module/tabs/context.js +12 -0
- package/build-module/tabs/context.js.map +1 -0
- package/build-module/tabs/index.js +142 -0
- package/build-module/tabs/index.js.map +1 -0
- package/build-module/tabs/styles.js +36 -0
- package/build-module/tabs/styles.js.map +1 -0
- package/build-module/tabs/tab.js +43 -0
- package/build-module/tabs/tab.js.map +1 -0
- package/build-module/tabs/tablist.js +41 -0
- package/build-module/tabs/tablist.js.map +1 -0
- package/build-module/tabs/tabpanel.js +43 -0
- package/build-module/tabs/tabpanel.js.map +1 -0
- package/build-module/tabs/types.js +2 -0
- package/build-module/tabs/types.js.map +1 -0
- package/build-module/text/component.js +6 -6
- package/build-module/text/component.js.map +1 -1
- package/build-module/text/hook.js +11 -19
- package/build-module/text/hook.js.map +1 -1
- package/build-module/text/index.js.map +1 -1
- package/build-module/text/styles.js +7 -7
- package/build-module/text/styles.js.map +1 -1
- package/build-module/text/types.js.map +1 -1
- package/build-module/text/utils.js +17 -10
- package/build-module/text/utils.js.map +1 -1
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js +1 -0
- package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
- package/build-module/toolbar/toolbar/index.js +18 -11
- package/build-module/toolbar/toolbar/index.js.map +1 -1
- package/build-module/toolbar/toolbar/types.js.map +1 -1
- package/build-module/tools-panel/tools-panel-item/hook.js +2 -2
- package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
- package/build-module/tools-panel/types.js.map +1 -1
- package/build-module/unit-control/utils.js +108 -0
- package/build-module/unit-control/utils.js.map +1 -1
- package/build-module/utils/unit-values.js +1 -1
- package/build-module/utils/unit-values.js.map +1 -1
- package/build-style/style-rtl.css +16 -4
- package/build-style/style.css +16 -4
- package/build-types/alignment-matrix-control/cell.d.ts +1 -1
- package/build-types/alignment-matrix-control/cell.d.ts.map +1 -1
- package/build-types/alignment-matrix-control/index.d.ts.map +1 -1
- package/build-types/alignment-matrix-control/stories/index.story.d.ts.map +1 -1
- package/build-types/alignment-matrix-control/utils.d.ts +9 -9
- package/build-types/alignment-matrix-control/utils.d.ts.map +1 -1
- package/build-types/circular-option-picker/circular-option-picker-option.d.ts.map +1 -1
- package/build-types/circular-option-picker/circular-option-picker.d.ts.map +1 -1
- package/build-types/circular-option-picker/types.d.ts +4 -6
- package/build-types/circular-option-picker/types.d.ts.map +1 -1
- package/build-types/color-palette/index.d.ts.map +1 -1
- package/build-types/color-picker/component.d.ts.map +1 -1
- package/build-types/color-picker/picker.d.ts +1 -1
- package/build-types/color-picker/picker.d.ts.map +1 -1
- package/build-types/color-picker/styles.d.ts.map +1 -1
- package/build-types/color-picker/types.d.ts +3 -0
- package/build-types/color-picker/types.d.ts.map +1 -1
- package/build-types/composite/v2.d.ts +12 -0
- package/build-types/composite/v2.d.ts.map +1 -0
- package/build-types/confirm-dialog/component.d.ts +70 -29
- package/build-types/confirm-dialog/component.d.ts.map +1 -1
- package/build-types/confirm-dialog/stories/index.story.d.ts +11 -0
- package/build-types/confirm-dialog/stories/index.story.d.ts.map +1 -0
- package/build-types/confirm-dialog/test/index.d.ts +2 -0
- package/build-types/confirm-dialog/test/index.d.ts.map +1 -0
- package/build-types/confirm-dialog/types.d.ts +32 -10
- package/build-types/confirm-dialog/types.d.ts.map +1 -1
- package/build-types/custom-gradient-picker/gradient-bar/control-points.d.ts.map +1 -1
- package/build-types/font-size-picker/utils.d.ts.map +1 -1
- package/build-types/heading/stories/index.story.d.ts.map +1 -1
- package/build-types/modal/index.d.ts.map +1 -1
- package/build-types/palette-edit/index.d.ts.map +1 -1
- package/build-types/popover/index.d.ts +1 -1
- package/build-types/popover/index.d.ts.map +1 -1
- package/build-types/popover/stories/e2e/index.story.d.ts +1 -1
- package/build-types/private-apis.d.ts.map +1 -1
- package/build-types/progress-bar/styles.d.ts.map +1 -1
- package/build-types/sandbox/index.d.ts.map +1 -1
- package/build-types/tabs/context.d.ts +8 -0
- package/build-types/tabs/context.d.ts.map +1 -0
- package/build-types/tabs/index.d.ts +13 -0
- package/build-types/tabs/index.d.ts.map +1 -0
- package/build-types/tabs/stories/index.story.d.ts +20 -0
- package/build-types/tabs/stories/index.story.d.ts.map +1 -0
- package/build-types/tabs/styles.d.ts +17 -0
- package/build-types/tabs/styles.d.ts.map +1 -0
- package/build-types/tabs/tab.d.ts +10 -0
- package/build-types/tabs/tab.d.ts.map +1 -0
- package/build-types/tabs/tablist.d.ts +7 -0
- package/build-types/tabs/tablist.d.ts.map +1 -0
- package/build-types/tabs/tabpanel.d.ts +7 -0
- package/build-types/tabs/tabpanel.d.ts.map +1 -0
- package/build-types/tabs/test/index.d.ts +2 -0
- package/build-types/tabs/test/index.d.ts.map +1 -0
- package/build-types/tabs/types.d.ts +134 -0
- package/build-types/tabs/types.d.ts.map +1 -0
- package/build-types/text/component.d.ts +4 -2
- package/build-types/text/component.d.ts.map +1 -1
- package/build-types/text/hook.d.ts +171 -165
- package/build-types/text/hook.d.ts.map +1 -1
- package/build-types/text/index.d.ts +2 -2
- package/build-types/text/index.d.ts.map +1 -1
- package/build-types/text/stories/index.story.d.ts +21 -0
- package/build-types/text/stories/index.story.d.ts.map +1 -0
- package/build-types/text/styles.d.ts +7 -7
- package/build-types/text/styles.d.ts.map +1 -1
- package/build-types/text/types.d.ts +1 -1
- package/build-types/text/types.d.ts.map +1 -1
- package/build-types/text/utils.d.ts +56 -61
- package/build-types/text/utils.d.ts.map +1 -1
- package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
- package/build-types/toolbar/stories/index.story.d.ts +5 -0
- package/build-types/toolbar/stories/index.story.d.ts.map +1 -1
- package/build-types/toolbar/toolbar/index.d.ts.map +1 -1
- package/build-types/toolbar/toolbar/types.d.ts +10 -0
- package/build-types/toolbar/toolbar/types.d.ts.map +1 -1
- package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
- package/build-types/tools-panel/types.d.ts +2 -0
- package/build-types/tools-panel/types.d.ts.map +1 -1
- package/build-types/unit-control/utils.d.ts.map +1 -1
- package/package.json +19 -19
- package/src/alignment-matrix-control/cell.tsx +6 -2
- package/src/alignment-matrix-control/index.tsx +31 -54
- package/src/alignment-matrix-control/stories/index.story.tsx +3 -7
- package/src/alignment-matrix-control/test/index.tsx +117 -18
- package/src/alignment-matrix-control/utils.tsx +33 -9
- package/src/button/style.scss +1 -2
- package/src/circular-option-picker/circular-option-picker-option.tsx +24 -38
- package/src/circular-option-picker/circular-option-picker.tsx +11 -28
- package/src/circular-option-picker/types.ts +6 -5
- package/src/color-palette/index.tsx +6 -1
- package/src/color-picker/component.tsx +25 -3
- package/src/color-picker/picker.tsx +96 -2
- package/src/color-picker/styles.ts +0 -1
- package/src/color-picker/types.ts +3 -0
- package/src/composite/v2.ts +22 -0
- package/src/confirm-dialog/README.md +1 -1
- package/src/confirm-dialog/component.tsx +79 -13
- package/src/confirm-dialog/stories/{index.story.js → index.story.tsx} +26 -24
- package/src/confirm-dialog/test/{index.js → index.tsx} +3 -3
- package/src/confirm-dialog/types.ts +32 -12
- package/src/custom-gradient-picker/gradient-bar/control-points.tsx +32 -25
- package/src/font-size-picker/utils.ts +2 -1
- package/src/heading/stories/index.story.tsx +2 -4
- package/src/modal/index.tsx +58 -22
- package/src/modal/test/index.tsx +29 -0
- package/src/notice/style.scss +0 -1
- package/src/palette-edit/index.tsx +4 -0
- package/src/popover/index.tsx +99 -57
- package/src/popover/style.scss +9 -0
- package/src/private-apis.ts +15 -1
- package/src/progress-bar/styles.ts +19 -4
- package/src/sandbox/index.native.js +1 -1
- package/src/sandbox/index.tsx +3 -1
- package/src/tabs/README.md +242 -0
- package/src/tabs/context.ts +13 -0
- package/src/tabs/index.tsx +167 -0
- package/src/tabs/stories/index.story.tsx +352 -0
- package/src/tabs/styles.ts +103 -0
- package/src/tabs/tab.tsx +39 -0
- package/src/tabs/tablist.tsx +40 -0
- package/src/tabs/tabpanel.tsx +42 -0
- package/src/tabs/test/index.tsx +1124 -0
- package/src/tabs/types.ts +142 -0
- package/src/text/README.md +2 -2
- package/src/text/{component.js → component.tsx} +10 -6
- package/src/text/{hook.js → hook.ts} +12 -15
- package/src/text/stories/index.story.tsx +80 -0
- package/src/text/types.ts +1 -6
- package/src/text/{utils.js → utils.ts} +40 -14
- package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +8 -0
- package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +1 -0
- package/src/toolbar/stories/index.story.tsx +15 -0
- package/src/toolbar/test/index.tsx +8 -0
- package/src/toolbar/toolbar/README.md +9 -0
- package/src/toolbar/toolbar/index.tsx +21 -12
- package/src/toolbar/toolbar/style.scss +9 -0
- package/src/toolbar/toolbar/types.ts +10 -0
- package/src/tools-panel/tools-panel/README.md +3 -0
- package/src/tools-panel/tools-panel-item/hook.ts +4 -6
- package/src/tools-panel/types.ts +2 -0
- package/src/unit-control/utils.ts +124 -0
- package/src/utils/unit-values.ts +1 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/src/text/stories/index.story.js +0 -53
- /package/src/text/{index.js → index.ts} +0 -0
- /package/src/text/{styles.js → styles.ts} +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_reactNativeWebview","_element","_compose","_style","_interopRequireDefault","observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","forwardRef","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","viewportProps","onLoadEnd","testID","ref","colorScheme","usePreferredColorScheme","height","setHeight","useState","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","useRef","key","Platform","select","android","ios","addViewportProps","trim","replace","htmlDoc","_react","createElement","name","content","dangerouslySetInnerHTML","__html","map","rules","i","className","src","renderToString","getInjectedJavaScript","useCallback","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","useEffect","dimensionsChangeSubscription","addEventListener","remove","current","WebView","sandboxStyles","injectedJavaScript","source","baseUrl","originWhitelist","isAndroid","workaroundStyles","webView","scrollEnabled","setBuiltInZoomControls","showsHorizontalScrollIndicator","showsVerticalScrollIndicator","mediaPlaybackRequiresUserAction","StyleSheet","create","opacity","_default","memo","exports","default"],"sources":["@wordpress/components/src/sandbox/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vmin|vmax|vh|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\n\t/**\n\t * Add responsiveness to embeds with aspect ratios.\n\t *\n\t * These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t */\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 * 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t\tviewportProps = '',\n\t\tonLoadEnd = () => {},\n\t\ttestID,\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\n\t\t// Avoid comma issues with props.viewportProps.\n\t\tconst addViewportProps = viewportProps\n\t\t\t.trim()\n\t\t\t.replace( /(^[^,])/, ', $1' );\n\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent={ `width=device-width, initial-scale=1${ addViewportProps }` }\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS || observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '*' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t\tonLoadEnd={ onLoadEnd }\n\t\t\ttestID={ testID }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/**\n\t\t * The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"],"mappings":";;;;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,mBAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAF,OAAA;AAUA,IAAAG,QAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAC,sBAAA,CAAAL,OAAA;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;;AAGA,MAAMM,kBAAkB,GAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,KAAK,GAAI;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,WAAW,GAAG,EAAE;AAEtB,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAE,SAASD,OAAOA,CAC3C;EACCE,cAAc;EACdC,QAAQ;EACRC,IAAI,GAAG,EAAE;EACTC,IAAI,GAAG,IAAI;EACXC,WAAW,GAAG,EAAE;EAChBC,OAAO,GAAGR,WAAW;EACrBS,MAAM,GAAGT,WAAW;EACpBU,KAAK,GAAG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"}
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_reactNativeWebview","_element","_compose","_style","_interopRequireDefault","observeAndResizeJS","style","EMPTY_ARRAY","Sandbox","forwardRef","containerStyle","customJS","html","lang","providerUrl","scripts","styles","title","type","url","onWindowEvents","viewportProps","onLoadEnd","testID","ref","colorScheme","usePreferredColorScheme","height","setHeight","useState","contentHtml","setContentHtml","getHtmlDoc","windowSize","Dimensions","get","isLandscape","setIsLandscape","width","wasLandscape","useRef","key","Platform","select","android","ios","addViewportProps","trim","replace","htmlDoc","_react","createElement","name","content","dangerouslySetInnerHTML","__html","map","rules","i","className","src","renderToString","getInjectedJavaScript","useCallback","injectedJS","Object","keys","forEach","eventType","updateContentHtml","forceRerender","newContentHtml","setImmediate","getSizeStyle","contentHeight","Math","ceil","aspectRatio","onChangeDimensions","dimensions","window","onMessage","message","data","nativeEvent","JSON","parse","e","action","console","warn","useEffect","dimensionsChangeSubscription","addEventListener","remove","current","WebView","sandboxStyles","injectedJavaScript","source","baseUrl","originWhitelist","isAndroid","workaroundStyles","webView","scrollEnabled","setBuiltInZoomControls","showsHorizontalScrollIndicator","showsVerticalScrollIndicator","mediaPlaybackRequiresUserAction","StyleSheet","create","opacity","_default","memo","exports","default"],"sources":["@wordpress/components/src/sandbox/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Dimensions, StyleSheet } from 'react-native';\nimport { WebView } from 'react-native-webview';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tPlatform,\n\trenderToString,\n\tmemo,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n\tforwardRef,\n\tuseCallback,\n} from '@wordpress/element';\nimport { usePreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport sandboxStyles from './style.scss';\n\nconst observeAndResizeJS = `\n\t(function() {\n\t\tconst { MutationObserver } = window;\n\n\t\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\t\treturn;\n\t\t}\n\n\t\tfunction sendResize() {\n\t\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\t\t// The function postMessage is exposed by the react-native-webview library\n\t\t\t// to communicate between React Native and the WebView, in this case,\n\t\t\t// we use it for notifying resize changes.\n\t\t\twindow.ReactNativeWebView.postMessage(\n\t\t\t\tJSON.stringify( {\n\t\t\t\t\taction: 'resize',\n\t\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\t\theight: clientBoundingRect.height,\n\t\t\t\t} )\n\t\t\t);\n\t\t}\n\n\t\tconst observer = new MutationObserver( sendResize );\n\t\tobserver.observe( document.body, {\n\t\t\tattributes: true,\n\t\t\tattributeOldValue: false,\n\t\t\tcharacterData: true,\n\t\t\tcharacterDataOldValue: false,\n\t\t\tchildList: true,\n\t\t\tsubtree: true,\n\t\t} );\n\n\t\twindow.addEventListener( 'load', sendResize, true );\n\n\t\t// Hack: Remove viewport unit styles, as these are relative\n\t\t// the iframe root and interfere with our mechanism for\n\t\t// determining the unconstrained page bounds.\n\t\tfunction removeViewportStyles( ruleOrNode ) {\n\t\t\tif ( ruleOrNode.style ) {\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\t\tstyle\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\t/^\\\\d+(vw|vh|svw|lvw|dvw|svh|lvh|dvh|vi|svi|lvi|dvi|vb|svb|lvb|dvb|vmin|svmin|lvmin|dvmin|vmax|svmax|lvmax|dvmax)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t\t) {\n\t\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t}\n\t\t}\n\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.querySelectorAll( '[style]' ),\n\t\t\tremoveViewportStyles\n\t\t);\n\t\tArray.prototype.forEach.call(\n\t\t\tdocument.styleSheets,\n\t\t\tfunction ( stylesheet ) {\n\t\t\t\tArray.prototype.forEach.call(\n\t\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\t\tremoveViewportStyles\n\t\t\t\t);\n\t\t\t}\n\t\t);\n\n\t\tdocument.body.style.position = 'absolute';\n\t\tdocument.body.style.width = '100%';\n\t\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\t\tsendResize();\n\n\t\t// Resize events can change the width of elements with 100% width, but we don't\n\t\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\t\twindow.addEventListener( 'resize', sendResize, true );\n\t\twindow.addEventListener( 'orientationchange', sendResize, true );\n\t})();\n`;\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div,\n\tbody > div iframe {\n\t\twidth: 100%;\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n\n\t.wp-block-embed__wrapper {\n\t\tposition: relative;\n\t}\n\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\n\t/**\n\t * Add responsiveness to embeds with aspect ratios.\n\t *\n\t * These styles have been copied from the web version (https://github.com/WordPress/gutenberg/blob/7901895ca20cf61e402925e31571d659dab64721/packages/block-library/src/embed/style.scss#L42-L89) and\n\t * adapted for the native version.\n\t */\n\t.wp-has-aspect-ratio.wp-block-embed__wrapper::before {\n\t\tcontent: \"\";\n\t\tdisplay: block;\n\t\tpadding-top: 50%; // Default to 2:1 aspect ratio.\n\t}\n\t.wp-has-aspect-ratio iframe {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\t.wp-embed-aspect-21-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 42.85%; // 9 / 21 * 100\n\t}\n\t.wp-embed-aspect-18-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 50%; // 9 / 18 * 100\n\t}\n\t.wp-embed-aspect-16-9.wp-block-embed__wrapper::before {\n\t\tpadding-top: 56.25%; // 9 / 16 * 100\n\t}\n\t.wp-embed-aspect-4-3.wp-block-embed__wrapper::before {\n\t\tpadding-top: 75%; // 3 / 4 * 100\n\t}\n\t.wp-embed-aspect-1-1.wp-block-embed__wrapper::before {\n\t\tpadding-top: 100%; // 1 / 1 * 100\n\t}\n\t.wp-embed-aspect-9-16.wp-block-embed__wrapper::before {\n\t\tpadding-top: 177.77%; // 16 / 9 * 100\n\t}\n\t.wp-embed-aspect-1-2.wp-block-embed__wrapper::before {\n\t\tpadding-top: 200%; // 2 / 1 * 100\n\t}\n`;\n\nconst EMPTY_ARRAY = [];\n\nconst Sandbox = forwardRef( function Sandbox(\n\t{\n\t\tcontainerStyle,\n\t\tcustomJS,\n\t\thtml = '',\n\t\tlang = 'en',\n\t\tproviderUrl = '',\n\t\tscripts = EMPTY_ARRAY,\n\t\tstyles = EMPTY_ARRAY,\n\t\ttitle = '',\n\t\ttype,\n\t\turl,\n\t\tonWindowEvents = {},\n\t\tviewportProps = '',\n\t\tonLoadEnd = () => {},\n\t\ttestID,\n\t},\n\tref\n) {\n\tconst colorScheme = usePreferredColorScheme();\n\tconst [ height, setHeight ] = useState( 0 );\n\tconst [ contentHtml, setContentHtml ] = useState( getHtmlDoc() );\n\n\tconst windowSize = Dimensions.get( 'window' );\n\tconst [ isLandscape, setIsLandscape ] = useState(\n\t\twindowSize.width >= windowSize.height\n\t);\n\tconst wasLandscape = useRef( isLandscape );\n\t// On Android, we need to recreate the WebView on any of the following actions, otherwise it disappears:\n\t// - Device rotation\n\t// - Light/dark mode changes\n\t// For this purpose, the key prop used in the WebView will be updated with the value of the actions.\n\tconst key = Platform.select( {\n\t\tandroid: `${ url }-${\n\t\t\tisLandscape ? 'landscape' : 'portrait'\n\t\t}-${ colorScheme }`,\n\t\tios: url,\n\t} );\n\n\tfunction getHtmlDoc() {\n\t\t// Put the html snippet into a html document, and update the state to refresh the WebView,\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\n\t\t// Avoid comma issues with props.viewportProps.\n\t\tconst addViewportProps = viewportProps\n\t\t\t.trim()\n\t\t\t.replace( /(^[^,])/, ', $1' );\n\n\t\tconst htmlDoc = (\n\t\t\t<html lang={ lang }>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<meta\n\t\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\t\tcontent={ `width=device-width, initial-scale=1${ addViewportProps }` }\n\t\t\t\t\t></meta>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\t\treturn '<!DOCTYPE html>' + renderToString( htmlDoc );\n\t}\n\n\tconst getInjectedJavaScript = useCallback( () => {\n\t\t// Allow parent to override the resize observers with prop.customJS (legacy support)\n\t\tlet injectedJS = customJS || observeAndResizeJS;\n\n\t\t// Add any event listeners that were passed in.\n\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\tinjectedJS += `\n\t\t\t\twindow.addEventListener( '${ eventType }', function( event ) {\n\t\t\t\t\twindow.ReactNativeWebView.postMessage( JSON.stringify( { type: '${ eventType }', ...event.data } ) );\n\t\t\t\t});`;\n\t\t} );\n\n\t\treturn injectedJS;\n\t}, [ customJS, onWindowEvents ] );\n\n\tfunction updateContentHtml( forceRerender = false ) {\n\t\tconst newContentHtml = getHtmlDoc();\n\n\t\tif ( forceRerender && contentHtml === newContentHtml ) {\n\t\t\t// The re-render is forced by updating the state with empty HTML,\n\t\t\t// waiting for the JS code to be executed with \"setImmediate\" and then\n\t\t\t// setting the content HTML again.\n\t\t\tsetContentHtml( '' );\n\t\t\tsetImmediate( () => setContentHtml( newContentHtml ) );\n\t\t} else {\n\t\t\tsetContentHtml( newContentHtml );\n\t\t}\n\t}\n\n\tfunction getSizeStyle() {\n\t\tconst contentHeight = Math.ceil( height );\n\n\t\treturn contentHeight ? { height: contentHeight } : { aspectRatio: 1 };\n\t}\n\n\tfunction onChangeDimensions( dimensions ) {\n\t\tsetIsLandscape( dimensions.window.width >= dimensions.window.height );\n\t}\n\n\tconst onMessage = useCallback(\n\t\t( message ) => {\n\t\t\tlet data = message?.nativeEvent?.data;\n\n\t\t\ttry {\n\t\t\t\tdata = JSON.parse( data );\n\t\t\t} catch ( e ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// check for resize event\n\t\t\tif ( 'resize' === data?.action ) {\n\t\t\t\tsetHeight( data.height );\n\t\t\t}\n\n\t\t\t// Forward the event to parent event listeners\n\t\t\tObject.keys( onWindowEvents ).forEach( ( eventType ) => {\n\t\t\t\tif ( data?.type === eventType ) {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonWindowEvents[ eventType ]( data );\n\t\t\t\t\t} catch ( e ) {\n\t\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t\t`Error handling event ${ eventType }`,\n\t\t\t\t\t\t\te\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t},\n\t\t[ onWindowEvents ]\n\t);\n\n\tuseEffect( () => {\n\t\tconst dimensionsChangeSubscription = Dimensions.addEventListener(\n\t\t\t'change',\n\t\t\tonChangeDimensions\n\t\t);\n\t\treturn () => {\n\t\t\tdimensionsChangeSubscription.remove();\n\t\t};\n\t}, [] );\n\n\tuseEffect( () => {\n\t\tupdateContentHtml();\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, title, type, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\t// When device orientation changes we have to recalculate the size,\n\t\t// for this purpose we reset the current size value.\n\t\tif ( wasLandscape.current !== isLandscape ) {\n\t\t\tsetHeight( 0 );\n\t\t}\n\t\twasLandscape.current = isLandscape;\n\t}, [ isLandscape ] );\n\n\treturn (\n\t\t<WebView\n\t\t\tcontainerStyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__container' ],\n\t\t\t\tcontainerStyle,\n\t\t\t] }\n\t\t\tinjectedJavaScript={ getInjectedJavaScript() }\n\t\t\tkey={ key }\n\t\t\tref={ ref }\n\t\t\tsource={ { baseUrl: providerUrl, html: contentHtml } }\n\t\t\t// Wildcard value is required for static HTML\n\t\t\t// Reference: https://github.com/react-native-webview/react-native-webview/blob/master/docs/Reference.md#source\n\t\t\toriginWhitelist={ [ '*' ] }\n\t\t\tstyle={ [\n\t\t\t\tsandboxStyles[ 'sandbox-webview__content' ],\n\t\t\t\tgetSizeStyle(),\n\t\t\t\tPlatform.isAndroid && workaroundStyles.webView,\n\t\t\t] }\n\t\t\tonMessage={ onMessage }\n\t\t\tscrollEnabled={ false }\n\t\t\tsetBuiltInZoomControls={ false }\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tshowsVerticalScrollIndicator={ false }\n\t\t\tmediaPlaybackRequiresUserAction={ false }\n\t\t\tonLoadEnd={ onLoadEnd }\n\t\t\ttestID={ testID }\n\t\t/>\n\t);\n} );\n\nconst workaroundStyles = StyleSheet.create( {\n\twebView: {\n\t\t/**\n\t\t * The slight opacity below is a workaround for an Android crash caused from combining Android\n\t\t * 12's new scroll overflow behavior and webviews.\n\t\t * https://github.com/react-native-webview/react-native-webview/issues/1915#issuecomment-808869253\n\t\t */\n\t\topacity: 0.99,\n\t},\n} );\n\nexport default memo( Sandbox );\n"],"mappings":";;;;;;;;AAGA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,mBAAA,GAAAD,OAAA;AAKA,IAAAE,QAAA,GAAAF,OAAA;AAUA,IAAAG,QAAA,GAAAH,OAAA;AAKA,IAAAI,MAAA,GAAAC,sBAAA,CAAAL,OAAA;AAxBA;AACA;AACA;;AAIA;AACA;AACA;;AAaA;AACA;AACA;;AAGA,MAAMM,kBAAkB,GAAI;AAC5B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,KAAK,GAAI;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMC,WAAW,GAAG,EAAE;AAEtB,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAE,SAASD,OAAOA,CAC3C;EACCE,cAAc;EACdC,QAAQ;EACRC,IAAI,GAAG,EAAE;EACTC,IAAI,GAAG,IAAI;EACXC,WAAW,GAAG,EAAE;EAChBC,OAAO,GAAGR,WAAW;EACrBS,MAAM,GAAGT,WAAW;EACpBU,KAAK,GAAG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"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useTabsContext = exports.TabsContext = void 0;
|
|
7
|
+
var _element = require("@wordpress/element");
|
|
8
|
+
/**
|
|
9
|
+
* WordPress dependencies
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
const TabsContext = (0, _element.createContext)(undefined);
|
|
13
|
+
exports.TabsContext = TabsContext;
|
|
14
|
+
const useTabsContext = () => (0, _element.useContext)(TabsContext);
|
|
15
|
+
exports.useTabsContext = useTabsContext;
|
|
16
|
+
//# sourceMappingURL=context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_element","require","TabsContext","createContext","undefined","exports","useTabsContext","useContext"],"sources":["@wordpress/components/src/tabs/context.ts"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabsContextProps } from './types';\n\nexport const TabsContext = createContext< TabsContextProps >( undefined );\n\nexport const useTabsContext = () => useContext( TabsContext );\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAQO,MAAMC,WAAW,GAAG,IAAAC,sBAAa,EAAsBC,SAAU,CAAC;AAACC,OAAA,CAAAH,WAAA,GAAAA,WAAA;AAEnE,MAAMI,cAAc,GAAGA,CAAA,KAAM,IAAAC,mBAAU,EAAEL,WAAY,CAAC;AAACG,OAAA,CAAAC,cAAA,GAAAA,cAAA"}
|
|
@@ -0,0 +1,147 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
|
|
9
|
+
var _compose = require("@wordpress/compose");
|
|
10
|
+
var _element = require("@wordpress/element");
|
|
11
|
+
var _context = require("./context");
|
|
12
|
+
var _tab = require("./tab");
|
|
13
|
+
var _tablist = require("./tablist");
|
|
14
|
+
var _tabpanel = require("./tabpanel");
|
|
15
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
/**
|
|
18
|
+
* External dependencies
|
|
19
|
+
*/
|
|
20
|
+
// eslint-disable-next-line no-restricted-imports
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* WordPress dependencies
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
function Tabs({
|
|
27
|
+
selectOnMove = true,
|
|
28
|
+
initialTabId,
|
|
29
|
+
orientation = 'horizontal',
|
|
30
|
+
onSelect,
|
|
31
|
+
children,
|
|
32
|
+
selectedTabId
|
|
33
|
+
}) {
|
|
34
|
+
const instanceId = (0, _compose.useInstanceId)(Tabs, 'tabs');
|
|
35
|
+
const store = Ariakit.useTabStore({
|
|
36
|
+
selectOnMove,
|
|
37
|
+
orientation,
|
|
38
|
+
defaultSelectedId: initialTabId && `${instanceId}-${initialTabId}`,
|
|
39
|
+
setSelectedId: selectedId => {
|
|
40
|
+
const strippedDownId = typeof selectedId === 'string' ? selectedId.replace(`${instanceId}-`, '') : selectedId;
|
|
41
|
+
onSelect?.(strippedDownId);
|
|
42
|
+
},
|
|
43
|
+
selectedId: selectedTabId && `${instanceId}-${selectedTabId}`
|
|
44
|
+
});
|
|
45
|
+
const isControlled = selectedTabId !== undefined;
|
|
46
|
+
const {
|
|
47
|
+
items,
|
|
48
|
+
selectedId
|
|
49
|
+
} = store.useState();
|
|
50
|
+
const {
|
|
51
|
+
setSelectedId
|
|
52
|
+
} = store;
|
|
53
|
+
|
|
54
|
+
// Keep track of whether tabs have been populated. This is used to prevent
|
|
55
|
+
// certain effects from firing too early while tab data and relevant
|
|
56
|
+
// variables are undefined during the initial render.
|
|
57
|
+
const tabsHavePopulated = (0, _element.useRef)(false);
|
|
58
|
+
if (items.length > 0) {
|
|
59
|
+
tabsHavePopulated.current = true;
|
|
60
|
+
}
|
|
61
|
+
const selectedTab = items.find(item => item.id === selectedId);
|
|
62
|
+
const firstEnabledTab = items.find(item => {
|
|
63
|
+
// Ariakit internally refers to disabled tabs as `dimmed`.
|
|
64
|
+
return !item.dimmed;
|
|
65
|
+
});
|
|
66
|
+
const initialTab = items.find(item => item.id === `${instanceId}-${initialTabId}`);
|
|
67
|
+
|
|
68
|
+
// Handle selecting the initial tab.
|
|
69
|
+
(0, _element.useLayoutEffect)(() => {
|
|
70
|
+
if (isControlled) {
|
|
71
|
+
return;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
// Wait for the denoted initial tab to be declared before making a
|
|
75
|
+
// selection. This ensures that if a tab is declared lazily it can
|
|
76
|
+
// still receive initial selection, as well as ensuring no tab is
|
|
77
|
+
// selected if an invalid `initialTabId` is provided.
|
|
78
|
+
if (initialTabId && !initialTab) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
// If the currently selected tab is missing (i.e. removed from the DOM),
|
|
83
|
+
// fall back to the initial tab or the first enabled tab if there is
|
|
84
|
+
// one. Otherwise, no tab should be selected.
|
|
85
|
+
if (!items.find(item => item.id === selectedId)) {
|
|
86
|
+
if (initialTab && !initialTab.dimmed) {
|
|
87
|
+
setSelectedId(initialTab?.id);
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
if (firstEnabledTab) {
|
|
91
|
+
setSelectedId(firstEnabledTab.id);
|
|
92
|
+
} else if (tabsHavePopulated.current) {
|
|
93
|
+
setSelectedId(null);
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}, [firstEnabledTab, initialTab, initialTabId, isControlled, items, selectedId, setSelectedId]);
|
|
97
|
+
|
|
98
|
+
// Handle the currently selected tab becoming disabled.
|
|
99
|
+
(0, _element.useEffect)(() => {
|
|
100
|
+
if (!selectedTab?.dimmed) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// In controlled mode, we trust that disabling tabs is done
|
|
105
|
+
// intentionally, and don't select a new tab automatically.
|
|
106
|
+
if (isControlled) {
|
|
107
|
+
setSelectedId(null);
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
// If the currently selected tab becomes disabled, fall back to the
|
|
112
|
+
// `initialTabId` if possible. Otherwise select the first
|
|
113
|
+
// enabled tab (if there is one).
|
|
114
|
+
if (initialTab && !initialTab.dimmed) {
|
|
115
|
+
setSelectedId(initialTab.id);
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
if (firstEnabledTab) {
|
|
119
|
+
setSelectedId(firstEnabledTab.id);
|
|
120
|
+
}
|
|
121
|
+
}, [firstEnabledTab, initialTab, isControlled, selectedTab?.dimmed, setSelectedId]);
|
|
122
|
+
|
|
123
|
+
// Clear `selectedId` if the active tab is removed from the DOM in controlled mode.
|
|
124
|
+
(0, _element.useEffect)(() => {
|
|
125
|
+
if (!isControlled) {
|
|
126
|
+
return;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
// Once the tabs have populated, if the `selectedTabId` still can't be
|
|
130
|
+
// found, clear the selection.
|
|
131
|
+
if (tabsHavePopulated.current && !!selectedTabId && !selectedTab) {
|
|
132
|
+
setSelectedId(null);
|
|
133
|
+
}
|
|
134
|
+
}, [isControlled, selectedId, selectedTab, selectedTabId, setSelectedId]);
|
|
135
|
+
return (0, _react.createElement)(_context.TabsContext.Provider, {
|
|
136
|
+
value: {
|
|
137
|
+
store,
|
|
138
|
+
instanceId
|
|
139
|
+
}
|
|
140
|
+
}, children);
|
|
141
|
+
}
|
|
142
|
+
Tabs.TabList = _tablist.TabList;
|
|
143
|
+
Tabs.Tab = _tab.Tab;
|
|
144
|
+
Tabs.TabPanel = _tabpanel.TabPanel;
|
|
145
|
+
var _default = Tabs;
|
|
146
|
+
exports.default = _default;
|
|
147
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_compose","_element","_context","_tab","_tablist","_tabpanel","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","Tabs","selectOnMove","initialTabId","orientation","onSelect","children","selectedTabId","instanceId","useInstanceId","store","useTabStore","defaultSelectedId","setSelectedId","selectedId","strippedDownId","replace","isControlled","undefined","items","useState","tabsHavePopulated","useRef","length","current","selectedTab","find","item","id","firstEnabledTab","dimmed","initialTab","useLayoutEffect","useEffect","_react","createElement","TabsContext","Provider","value","TabList","Tab","TabPanel","_default","exports"],"sources":["@wordpress/components/src/tabs/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabsProps } from './types';\nimport { TabsContext } from './context';\nimport { Tab } from './tab';\nimport { TabList } from './tablist';\nimport { TabPanel } from './tabpanel';\n\nfunction Tabs( {\n\tselectOnMove = true,\n\tinitialTabId,\n\torientation = 'horizontal',\n\tonSelect,\n\tchildren,\n\tselectedTabId,\n}: TabsProps ) {\n\tconst instanceId = useInstanceId( Tabs, 'tabs' );\n\tconst store = Ariakit.useTabStore( {\n\t\tselectOnMove,\n\t\torientation,\n\t\tdefaultSelectedId: initialTabId && `${ instanceId }-${ initialTabId }`,\n\t\tsetSelectedId: ( selectedId ) => {\n\t\t\tconst strippedDownId =\n\t\t\t\ttypeof selectedId === 'string'\n\t\t\t\t\t? selectedId.replace( `${ instanceId }-`, '' )\n\t\t\t\t\t: selectedId;\n\t\t\tonSelect?.( strippedDownId );\n\t\t},\n\t\tselectedId: selectedTabId && `${ instanceId }-${ selectedTabId }`,\n\t} );\n\n\tconst isControlled = selectedTabId !== undefined;\n\n\tconst { items, selectedId } = store.useState();\n\tconst { setSelectedId } = store;\n\n\t// Keep track of whether tabs have been populated. This is used to prevent\n\t// certain effects from firing too early while tab data and relevant\n\t// variables are undefined during the initial render.\n\tconst tabsHavePopulated = useRef( false );\n\tif ( items.length > 0 ) {\n\t\ttabsHavePopulated.current = true;\n\t}\n\n\tconst selectedTab = items.find( ( item ) => item.id === selectedId );\n\tconst firstEnabledTab = items.find( ( item ) => {\n\t\t// Ariakit internally refers to disabled tabs as `dimmed`.\n\t\treturn ! item.dimmed;\n\t} );\n\tconst initialTab = items.find(\n\t\t( item ) => item.id === `${ instanceId }-${ initialTabId }`\n\t);\n\n\t// Handle selecting the initial tab.\n\tuseLayoutEffect( () => {\n\t\tif ( isControlled ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Wait for the denoted initial tab to be declared before making a\n\t\t// selection. This ensures that if a tab is declared lazily it can\n\t\t// still receive initial selection, as well as ensuring no tab is\n\t\t// selected if an invalid `initialTabId` is provided.\n\t\tif ( initialTabId && ! initialTab ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If the currently selected tab is missing (i.e. removed from the DOM),\n\t\t// fall back to the initial tab or the first enabled tab if there is\n\t\t// one. Otherwise, no tab should be selected.\n\t\tif ( ! items.find( ( item ) => item.id === selectedId ) ) {\n\t\t\tif ( initialTab && ! initialTab.dimmed ) {\n\t\t\t\tsetSelectedId( initialTab?.id );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( firstEnabledTab ) {\n\t\t\t\tsetSelectedId( firstEnabledTab.id );\n\t\t\t} else if ( tabsHavePopulated.current ) {\n\t\t\t\tsetSelectedId( null );\n\t\t\t}\n\t\t}\n\t}, [\n\t\tfirstEnabledTab,\n\t\tinitialTab,\n\t\tinitialTabId,\n\t\tisControlled,\n\t\titems,\n\t\tselectedId,\n\t\tsetSelectedId,\n\t] );\n\n\t// Handle the currently selected tab becoming disabled.\n\tuseEffect( () => {\n\t\tif ( ! selectedTab?.dimmed ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// In controlled mode, we trust that disabling tabs is done\n\t\t// intentionally, and don't select a new tab automatically.\n\t\tif ( isControlled ) {\n\t\t\tsetSelectedId( null );\n\t\t\treturn;\n\t\t}\n\n\t\t// If the currently selected tab becomes disabled, fall back to the\n\t\t// `initialTabId` if possible. Otherwise select the first\n\t\t// enabled tab (if there is one).\n\t\tif ( initialTab && ! initialTab.dimmed ) {\n\t\t\tsetSelectedId( initialTab.id );\n\t\t\treturn;\n\t\t}\n\n\t\tif ( firstEnabledTab ) {\n\t\t\tsetSelectedId( firstEnabledTab.id );\n\t\t}\n\t}, [\n\t\tfirstEnabledTab,\n\t\tinitialTab,\n\t\tisControlled,\n\t\tselectedTab?.dimmed,\n\t\tsetSelectedId,\n\t] );\n\n\t// Clear `selectedId` if the active tab is removed from the DOM in controlled mode.\n\tuseEffect( () => {\n\t\tif ( ! isControlled ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Once the tabs have populated, if the `selectedTabId` still can't be\n\t\t// found, clear the selection.\n\t\tif ( tabsHavePopulated.current && !! selectedTabId && ! selectedTab ) {\n\t\t\tsetSelectedId( null );\n\t\t}\n\t}, [\n\t\tisControlled,\n\t\tselectedId,\n\t\tselectedTab,\n\t\tselectedTabId,\n\t\tsetSelectedId,\n\t] );\n\n\treturn (\n\t\t<TabsContext.Provider value={ { store, instanceId } }>\n\t\t\t{ children }\n\t\t</TabsContext.Provider>\n\t);\n}\n\nTabs.TabList = TabList;\nTabs.Tab = Tab;\nTabs.TabPanel = TabPanel;\nexport default Tabs;\n"],"mappings":"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"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.TabListWrapper = exports.Tab = void 0;
|
|
8
|
+
var _base = _interopRequireDefault(require("@emotion/styled/base"));
|
|
9
|
+
var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
|
|
10
|
+
var _utils = require("../utils");
|
|
11
|
+
var _space = require("../utils/space");
|
|
12
|
+
var _reduceMotion = require("../utils/reduce-motion");
|
|
13
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
16
|
+
const TabListWrapper = (0, _base.default)("div", process.env.NODE_ENV === "production" ? {
|
|
17
|
+
target: "enfox0g1"
|
|
18
|
+
} : {
|
|
19
|
+
target: "enfox0g1",
|
|
20
|
+
label: "TabListWrapper"
|
|
21
|
+
})(process.env.NODE_ENV === "production" ? {
|
|
22
|
+
name: "xbm4q1",
|
|
23
|
+
styles: "display:flex;align-items:stretch;flex-direction:row;&[aria-orientation='vertical']{flex-direction:column;}"
|
|
24
|
+
} : {
|
|
25
|
+
name: "xbm4q1",
|
|
26
|
+
styles: "display:flex;align-items:stretch;flex-direction:row;&[aria-orientation='vertical']{flex-direction:column;}",
|
|
27
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGFicy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBY3dDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGFicy9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgbm8tcmVzdHJpY3RlZC1pbXBvcnRzXG5pbXBvcnQgKiBhcyBBcmlha2l0IGZyb20gJ0Bhcmlha2l0L3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91dGlscy9zcGFjZSc7XG5pbXBvcnQgeyByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi91dGlscy9yZWR1Y2UtbW90aW9uJztcblxuZXhwb3J0IGNvbnN0IFRhYkxpc3RXcmFwcGVyID0gc3R5bGVkLmRpdmBcblx0ZGlzcGxheTogZmxleDtcblx0YWxpZ24taXRlbXM6IHN0cmV0Y2g7XG5cdGZsZXgtZGlyZWN0aW9uOiByb3c7XG5cdCZbYXJpYS1vcmllbnRhdGlvbj0ndmVydGljYWwnXSB7XG5cdFx0ZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IFRhYiA9IHN0eWxlZCggQXJpYWtpdC5UYWIgKWBcblx0JiYge1xuXHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRib3JkZXItcmFkaXVzOiAwO1xuXHRcdGhlaWdodDogJHsgc3BhY2UoIDEyICkgfTtcblx0XHRiYWNrZ3JvdW5kOiB0cmFuc3BhcmVudDtcblx0XHRib3JkZXI6IG5vbmU7XG5cdFx0Ym94LXNoYWRvdzogbm9uZTtcblx0XHRjdXJzb3I6IHBvaW50ZXI7XG5cdFx0cGFkZGluZzogM3B4ICR7IHNwYWNlKCA0ICkgfTsgLy8gVXNlIHBhZGRpbmcgdG8gb2Zmc2V0IHRoZSBbYXJpYS1zZWxlY3RlZD1cInRydWVcIl0gYm9yZGVyLCB0aGlzIGJlbmVmaXRzIFdpbmRvd3MgSGlnaCBDb250cmFzdCBtb2RlXG5cdFx0bWFyZ2luLWxlZnQ6IDA7XG5cdFx0Zm9udC13ZWlnaHQ6IDUwMDtcblxuXHRcdCZbYXJpYS1kaXNhYmxlZD0ndHJ1ZSddIHtcblx0XHRcdGN1cnNvcjogZGVmYXVsdDtcblx0XHRcdG9wYWNpdHk6IDAuMztcblx0XHR9XG5cblx0XHQmOmZvY3VzOm5vdCggOmRpc2FibGVkICkge1xuXHRcdFx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRcdFx0Ym94LXNoYWRvdzogbm9uZTtcblx0XHRcdG91dGxpbmU6IG5vbmU7XG5cdFx0fVxuXG5cdFx0Ly8gVGFiIGluZGljYXRvclxuXHRcdCY6OmFmdGVyIHtcblx0XHRcdGNvbnRlbnQ6ICcnO1xuXHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0cmlnaHQ6IDA7XG5cdFx0XHRib3R0b206IDA7XG5cdFx0XHRsZWZ0OiAwO1xuXHRcdFx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cblx0XHRcdC8vIERyYXcgdGhlIGluZGljYXRvci5cblx0XHRcdGJhY2tncm91bmQ6ICR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblx0XHRcdGhlaWdodDogY2FsYyggMCAqIHZhciggLS13cC1hZG1pbi1ib3JkZXItd2lkdGgtZm9jdXMgKSApO1xuXHRcdFx0Ym9yZGVyLXJhZGl1czogMDtcblxuXHRcdFx0Ly8gQW5pbWF0aW9uXG5cdFx0XHR0cmFuc2l0aW9uOiBhbGwgMC4xcyBsaW5lYXI7XG5cdFx0XHQkeyByZWR1Y2VNb3Rpb24oICd0cmFuc2l0aW9uJyApIH07XG5cdFx0fVxuXG5cdFx0Ly8gQWN0aXZlLlxuXHRcdCZbYXJpYS1zZWxlY3RlZD0ndHJ1ZSddOjphZnRlciB7XG5cdFx0XHRoZWlnaHQ6IGNhbGMoIDEgKiB2YXIoIC0td3AtYWRtaW4tYm9yZGVyLXdpZHRoLWZvY3VzICkgKTtcblxuXHRcdFx0Ly8gV2luZG93cyBoaWdoIGNvbnRyYXN0IG1vZGUuXG5cdFx0XHRvdXRsaW5lOiAycHggc29saWQgdHJhbnNwYXJlbnQ7XG5cdFx0XHRvdXRsaW5lLW9mZnNldDogLTFweDtcblx0XHR9XG5cblx0XHQvLyBGb2N1cy5cblx0XHQmOjpiZWZvcmUge1xuXHRcdFx0Y29udGVudDogJyc7XG5cdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHR0b3A6ICR7IHNwYWNlKCAzICkgfTtcblx0XHRcdHJpZ2h0OiAkeyBzcGFjZSggMyApIH07XG5cdFx0XHRib3R0b206ICR7IHNwYWNlKCAzICkgfTtcblx0XHRcdGxlZnQ6ICR7IHNwYWNlKCAzICkgfTtcblx0XHRcdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXG5cdFx0XHQvLyBEcmF3IHRoZSBpbmRpY2F0b3IuXG5cdFx0XHRib3gtc2hhZG93OiAwIDAgMCAwIHRyYW5zcGFyZW50O1xuXHRcdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXG5cdFx0XHQvLyBBbmltYXRpb25cblx0XHRcdHRyYW5zaXRpb246IGFsbCAwLjFzIGxpbmVhcjtcblx0XHRcdCR7IHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nICkgfTtcblx0XHR9XG5cblx0XHQmOmZvY3VzLXZpc2libGU6OmJlZm9yZSB7XG5cdFx0XHRib3gtc2hhZG93OiAwIDAgMCB2YXIoIC0td3AtYWRtaW4tYm9yZGVyLXdpZHRoLWZvY3VzIClcblx0XHRcdFx0JHsgQ09MT1JTLnRoZW1lLmFjY2VudCB9O1xuXG5cdFx0XHQvLyBXaW5kb3dzIGhpZ2ggY29udHJhc3QgbW9kZS5cblx0XHRcdG91dGxpbmU6IDJweCBzb2xpZCB0cmFuc3BhcmVudDtcblx0XHR9XG5cdH1cbmA7XG4iXX0= */",
|
|
28
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
29
|
+
});
|
|
30
|
+
exports.TabListWrapper = TabListWrapper;
|
|
31
|
+
const Tab = ( /*#__PURE__*/0, _base.default)(Ariakit.Tab, process.env.NODE_ENV === "production" ? {
|
|
32
|
+
target: "enfox0g0"
|
|
33
|
+
} : {
|
|
34
|
+
target: "enfox0g0",
|
|
35
|
+
label: "Tab"
|
|
36
|
+
})("&&{position:relative;border-radius:0;height:", (0, _space.space)(12), ";background:transparent;border:none;box-shadow:none;cursor:pointer;padding:3px ", (0, _space.space)(4), ";margin-left:0;font-weight:500;&[aria-disabled='true']{cursor:default;opacity:0.3;}&:focus:not( :disabled ){position:relative;box-shadow:none;outline:none;}&::after{content:'';position:absolute;right:0;bottom:0;left:0;pointer-events:none;background:", _utils.COLORS.theme.accent, ";height:calc( 0 * var( --wp-admin-border-width-focus ) );border-radius:0;transition:all 0.1s linear;", (0, _reduceMotion.reduceMotion)('transition'), ";}&[aria-selected='true']::after{height:calc( 1 * var( --wp-admin-border-width-focus ) );outline:2px solid transparent;outline-offset:-1px;}&::before{content:'';position:absolute;top:", (0, _space.space)(3), ";right:", (0, _space.space)(3), ";bottom:", (0, _space.space)(3), ";left:", (0, _space.space)(3), ";pointer-events:none;box-shadow:0 0 0 0 transparent;border-radius:2px;transition:all 0.1s linear;", (0, _reduceMotion.reduceMotion)('transition'), ";}&:focus-visible::before{box-shadow:0 0 0 var( --wp-admin-border-width-focus ) ", _utils.COLORS.theme.accent, ";outline:2px solid transparent;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGFicy9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJ3QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RhYnMvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLXJlc3RyaWN0ZWQtaW1wb3J0c1xuaW1wb3J0ICogYXMgQXJpYWtpdCBmcm9tICdAYXJpYWtpdC9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcmVkdWNlTW90aW9uIH0gZnJvbSAnLi4vdXRpbHMvcmVkdWNlLW1vdGlvbic7XG5cbmV4cG9ydCBjb25zdCBUYWJMaXN0V3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGRpc3BsYXk6IGZsZXg7XG5cdGFsaWduLWl0ZW1zOiBzdHJldGNoO1xuXHRmbGV4LWRpcmVjdGlvbjogcm93O1xuXHQmW2FyaWEtb3JpZW50YXRpb249J3ZlcnRpY2FsJ10ge1xuXHRcdGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBUYWIgPSBzdHlsZWQoIEFyaWFraXQuVGFiIClgXG5cdCYmIHtcblx0XHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdFx0Ym9yZGVyLXJhZGl1czogMDtcblx0XHRoZWlnaHQ6ICR7IHNwYWNlKCAxMiApIH07XG5cdFx0YmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7XG5cdFx0Ym9yZGVyOiBub25lO1xuXHRcdGJveC1zaGFkb3c6IG5vbmU7XG5cdFx0Y3Vyc29yOiBwb2ludGVyO1xuXHRcdHBhZGRpbmc6IDNweCAkeyBzcGFjZSggNCApIH07IC8vIFVzZSBwYWRkaW5nIHRvIG9mZnNldCB0aGUgW2FyaWEtc2VsZWN0ZWQ9XCJ0cnVlXCJdIGJvcmRlciwgdGhpcyBiZW5lZml0cyBXaW5kb3dzIEhpZ2ggQ29udHJhc3QgbW9kZVxuXHRcdG1hcmdpbi1sZWZ0OiAwO1xuXHRcdGZvbnQtd2VpZ2h0OiA1MDA7XG5cblx0XHQmW2FyaWEtZGlzYWJsZWQ9J3RydWUnXSB7XG5cdFx0XHRjdXJzb3I6IGRlZmF1bHQ7XG5cdFx0XHRvcGFjaXR5OiAwLjM7XG5cdFx0fVxuXG5cdFx0Jjpmb2N1czpub3QoIDpkaXNhYmxlZCApIHtcblx0XHRcdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0XHRcdGJveC1zaGFkb3c6IG5vbmU7XG5cdFx0XHRvdXRsaW5lOiBub25lO1xuXHRcdH1cblxuXHRcdC8vIFRhYiBpbmRpY2F0b3Jcblx0XHQmOjphZnRlciB7XG5cdFx0XHRjb250ZW50OiAnJztcblx0XHRcdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0XHRcdHJpZ2h0OiAwO1xuXHRcdFx0Ym90dG9tOiAwO1xuXHRcdFx0bGVmdDogMDtcblx0XHRcdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXG5cdFx0XHQvLyBEcmF3IHRoZSBpbmRpY2F0b3IuXG5cdFx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMudGhlbWUuYWNjZW50IH07XG5cdFx0XHRoZWlnaHQ6IGNhbGMoIDAgKiB2YXIoIC0td3AtYWRtaW4tYm9yZGVyLXdpZHRoLWZvY3VzICkgKTtcblx0XHRcdGJvcmRlci1yYWRpdXM6IDA7XG5cblx0XHRcdC8vIEFuaW1hdGlvblxuXHRcdFx0dHJhbnNpdGlvbjogYWxsIDAuMXMgbGluZWFyO1xuXHRcdFx0JHsgcmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKSB9O1xuXHRcdH1cblxuXHRcdC8vIEFjdGl2ZS5cblx0XHQmW2FyaWEtc2VsZWN0ZWQ9J3RydWUnXTo6YWZ0ZXIge1xuXHRcdFx0aGVpZ2h0OiBjYWxjKCAxICogdmFyKCAtLXdwLWFkbWluLWJvcmRlci13aWR0aC1mb2N1cyApICk7XG5cblx0XHRcdC8vIFdpbmRvd3MgaGlnaCBjb250cmFzdCBtb2RlLlxuXHRcdFx0b3V0bGluZTogMnB4IHNvbGlkIHRyYW5zcGFyZW50O1xuXHRcdFx0b3V0bGluZS1vZmZzZXQ6IC0xcHg7XG5cdFx0fVxuXG5cdFx0Ly8gRm9jdXMuXG5cdFx0Jjo6YmVmb3JlIHtcblx0XHRcdGNvbnRlbnQ6ICcnO1xuXHRcdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdFx0dG9wOiAkeyBzcGFjZSggMyApIH07XG5cdFx0XHRyaWdodDogJHsgc3BhY2UoIDMgKSB9O1xuXHRcdFx0Ym90dG9tOiAkeyBzcGFjZSggMyApIH07XG5cdFx0XHRsZWZ0OiAkeyBzcGFjZSggMyApIH07XG5cdFx0XHRwb2ludGVyLWV2ZW50czogbm9uZTtcblxuXHRcdFx0Ly8gRHJhdyB0aGUgaW5kaWNhdG9yLlxuXHRcdFx0Ym94LXNoYWRvdzogMCAwIDAgMCB0cmFuc3BhcmVudDtcblx0XHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblxuXHRcdFx0Ly8gQW5pbWF0aW9uXG5cdFx0XHR0cmFuc2l0aW9uOiBhbGwgMC4xcyBsaW5lYXI7XG5cdFx0XHQkeyByZWR1Y2VNb3Rpb24oICd0cmFuc2l0aW9uJyApIH07XG5cdFx0fVxuXG5cdFx0Jjpmb2N1cy12aXNpYmxlOjpiZWZvcmUge1xuXHRcdFx0Ym94LXNoYWRvdzogMCAwIDAgdmFyKCAtLXdwLWFkbWluLWJvcmRlci13aWR0aC1mb2N1cyApXG5cdFx0XHRcdCR7IENPTE9SUy50aGVtZS5hY2NlbnQgfTtcblxuXHRcdFx0Ly8gV2luZG93cyBoaWdoIGNvbnRyYXN0IG1vZGUuXG5cdFx0XHRvdXRsaW5lOiAycHggc29saWQgdHJhbnNwYXJlbnQ7XG5cdFx0fVxuXHR9XG5gO1xuIl19 */"));
|
|
37
|
+
exports.Tab = Tab;
|
|
38
|
+
//# sourceMappingURL=styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_utils","_space","_reduceMotion","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_EMOTION_STRINGIFIED_CSS_ERROR__","TabListWrapper","_base","process","env","NODE_ENV","target","label","name","styles","map","toString","exports","Tab","space","COLORS","theme","accent","reduceMotion"],"sources":["@wordpress/components/src/tabs/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS } from '../utils';\nimport { space } from '../utils/space';\nimport { reduceMotion } from '../utils/reduce-motion';\n\nexport const TabListWrapper = styled.div`\n\tdisplay: flex;\n\talign-items: stretch;\n\tflex-direction: row;\n\t&[aria-orientation='vertical'] {\n\t\tflex-direction: column;\n\t}\n`;\n\nexport const Tab = styled( Ariakit.Tab )`\n\t&& {\n\t\tposition: relative;\n\t\tborder-radius: 0;\n\t\theight: ${ space( 12 ) };\n\t\tbackground: transparent;\n\t\tborder: none;\n\t\tbox-shadow: none;\n\t\tcursor: pointer;\n\t\tpadding: 3px ${ space( 4 ) }; // Use padding to offset the [aria-selected=\"true\"] border, this benefits Windows High Contrast mode\n\t\tmargin-left: 0;\n\t\tfont-weight: 500;\n\n\t\t&[aria-disabled='true'] {\n\t\t\tcursor: default;\n\t\t\topacity: 0.3;\n\t\t}\n\n\t\t&:focus:not( :disabled ) {\n\t\t\tposition: relative;\n\t\t\tbox-shadow: none;\n\t\t\toutline: none;\n\t\t}\n\n\t\t// Tab indicator\n\t\t&::after {\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\tright: 0;\n\t\t\tbottom: 0;\n\t\t\tleft: 0;\n\t\t\tpointer-events: none;\n\n\t\t\t// Draw the indicator.\n\t\t\tbackground: ${ COLORS.theme.accent };\n\t\t\theight: calc( 0 * var( --wp-admin-border-width-focus ) );\n\t\t\tborder-radius: 0;\n\n\t\t\t// Animation\n\t\t\ttransition: all 0.1s linear;\n\t\t\t${ reduceMotion( 'transition' ) };\n\t\t}\n\n\t\t// Active.\n\t\t&[aria-selected='true']::after {\n\t\t\theight: calc( 1 * var( --wp-admin-border-width-focus ) );\n\n\t\t\t// Windows high contrast mode.\n\t\t\toutline: 2px solid transparent;\n\t\t\toutline-offset: -1px;\n\t\t}\n\n\t\t// Focus.\n\t\t&::before {\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\ttop: ${ space( 3 ) };\n\t\t\tright: ${ space( 3 ) };\n\t\t\tbottom: ${ space( 3 ) };\n\t\t\tleft: ${ space( 3 ) };\n\t\t\tpointer-events: none;\n\n\t\t\t// Draw the indicator.\n\t\t\tbox-shadow: 0 0 0 0 transparent;\n\t\t\tborder-radius: 2px;\n\n\t\t\t// Animation\n\t\t\ttransition: all 0.1s linear;\n\t\t\t${ reduceMotion( 'transition' ) };\n\t\t}\n\n\t\t&:focus-visible::before {\n\t\t\tbox-shadow: 0 0 0 var( --wp-admin-border-width-focus )\n\t\t\t\t${ COLORS.theme.accent };\n\n\t\t\t// Windows high contrast mode.\n\t\t\toutline: 2px solid transparent;\n\t\t}\n\t}\n`;\n"],"mappings":";;;;;;;;AAKA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAKA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;AAAsD,SAAAI,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAN,wBAAAU,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAAA,SAAAW,iCAAA;AAE/C,MAAMC,cAAc,OAAAC,KAAA,CAAAjB,OAAA,SAAAkB,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAX;AAAA,EAO1B;AAACY,OAAA,CAAAX,cAAA,GAAAA,cAAA;AAEK,MAAMY,GAAG,GAAG,kBAAAX,KAAA,CAAAjB,OAAA,EAAQb,OAAO,CAACyC,GAAG,EAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,iDAI3B,IAAAO,YAAK,EAAE,EAAG,CAAC,qFAKN,IAAAA,YAAK,EAAE,CAAE,CAAC,+PAyBVC,aAAM,CAACC,KAAK,CAACC,MAAM,0GAM/B,IAAAC,0BAAY,EAAE,YAAa,CAAC,6LAgBvB,IAAAJ,YAAK,EAAE,CAAE,CAAC,aACR,IAAAA,YAAK,EAAE,CAAE,CAAC,cACT,IAAAA,YAAK,EAAE,CAAE,CAAC,YACZ,IAAAA,YAAK,EAAE,CAAE,CAAC,uGAShB,IAAAI,0BAAY,EAAE,YAAa,CAAC,sFAK3BH,aAAM,CAACC,KAAK,CAACC,MAAM,yCAAAd,OAAA,CAAAC,GAAA,CAAAC,QAAA,wiHAMzB;AAACO,OAAA,CAAAC,GAAA,GAAAA,GAAA"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.Tab = void 0;
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var _element = require("@wordpress/element");
|
|
10
|
+
var _warning = _interopRequireDefault(require("@wordpress/warning"));
|
|
11
|
+
var _context = require("./context");
|
|
12
|
+
var _styles = require("./styles");
|
|
13
|
+
/**
|
|
14
|
+
* WordPress dependencies
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
const Tab = (0, _element.forwardRef)(function Tab({
|
|
18
|
+
children,
|
|
19
|
+
id,
|
|
20
|
+
className,
|
|
21
|
+
disabled,
|
|
22
|
+
render,
|
|
23
|
+
style
|
|
24
|
+
}, ref) {
|
|
25
|
+
const context = (0, _element.useContext)(_context.TabsContext);
|
|
26
|
+
if (!context) {
|
|
27
|
+
typeof SCRIPT_DEBUG !== "undefined" && SCRIPT_DEBUG === true ? (0, _warning.default)('`Tabs.TabList` must be wrapped in a `Tabs` component.') : void 0;
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
30
|
+
const {
|
|
31
|
+
store,
|
|
32
|
+
instanceId
|
|
33
|
+
} = context;
|
|
34
|
+
const instancedTabId = `${instanceId}-${id}`;
|
|
35
|
+
return (0, _react.createElement)(_styles.Tab, {
|
|
36
|
+
ref: ref,
|
|
37
|
+
store: store,
|
|
38
|
+
id: instancedTabId,
|
|
39
|
+
className: className,
|
|
40
|
+
style: style,
|
|
41
|
+
disabled: disabled,
|
|
42
|
+
render: render
|
|
43
|
+
}, children);
|
|
44
|
+
});
|
|
45
|
+
exports.Tab = Tab;
|
|
46
|
+
//# sourceMappingURL=tab.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_element","require","_warning","_interopRequireDefault","_context","_styles","Tab","forwardRef","children","id","className","disabled","render","style","ref","context","useContext","TabsContext","SCRIPT_DEBUG","warning","store","instanceId","instancedTabId","_react","createElement","exports"],"sources":["@wordpress/components/src/tabs/tab.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\n\nimport { useContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabProps } from './types';\nimport warning from '@wordpress/warning';\nimport { TabsContext } from './context';\nimport { Tab as StyledTab } from './styles';\n\nexport const Tab = forwardRef< HTMLButtonElement, TabProps >( function Tab(\n\t{ children, id, className, disabled, render, style },\n\tref\n) {\n\tconst context = useContext( TabsContext );\n\tif ( ! context ) {\n\t\twarning( '`Tabs.TabList` must be wrapped in a `Tabs` component.' );\n\t\treturn null;\n\t}\n\tconst { store, instanceId } = context;\n\tconst instancedTabId = `${ instanceId }-${ id }`;\n\treturn (\n\t\t<StyledTab\n\t\t\tref={ ref }\n\t\t\tstore={ store }\n\t\t\tid={ instancedTabId }\n\t\t\tclassName={ className }\n\t\t\tstyle={ style }\n\t\t\tdisabled={ disabled }\n\t\t\trender={ render }\n\t\t>\n\t\t\t{ children }\n\t\t</StyledTab>\n\t);\n} );\n"],"mappings":";;;;;;;;AAIA,IAAAA,QAAA,GAAAC,OAAA;AAMA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAZA;AACA;AACA;;AAYO,MAAMK,GAAG,GAAG,IAAAC,mBAAU,EAAiC,SAASD,GAAGA,CACzE;EAAEE,QAAQ;EAAEC,EAAE;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,MAAM;EAAEC;AAAM,CAAC,EACpDC,GAAG,EACF;EACD,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAEC,oBAAY,CAAC;EACzC,IAAK,CAAEF,OAAO,EAAG;IAChB,OAAAG,YAAA,oBAAAA,YAAA,gBAAAC,gBAAO,EAAE,uDAAwD,CAAC;IAClE,OAAO,IAAI;EACZ;EACA,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,GAAGN,OAAO;EACrC,MAAMO,cAAc,GAAI,GAAGD,UAAY,IAAIZ,EAAI,EAAC;EAChD,OACC,IAAAc,MAAA,CAAAC,aAAA,EAACnB,OAAA,CAAAC,GAAS;IACTQ,GAAG,EAAGA,GAAK;IACXM,KAAK,EAAGA,KAAO;IACfX,EAAE,EAAGa,cAAgB;IACrBZ,SAAS,EAAGA,SAAW;IACvBG,KAAK,EAAGA,KAAO;IACfF,QAAQ,EAAGA,QAAU;IACrBC,MAAM,EAAGA;EAAQ,GAEfJ,QACQ,CAAC;AAEd,CAAE,CAAC;AAACiB,OAAA,CAAAnB,GAAA,GAAAA,GAAA"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.TabList = void 0;
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
|
|
10
|
+
var _warning = _interopRequireDefault(require("@wordpress/warning"));
|
|
11
|
+
var _element = require("@wordpress/element");
|
|
12
|
+
var _context = require("./context");
|
|
13
|
+
var _styles = require("./styles");
|
|
14
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
16
|
+
/**
|
|
17
|
+
* External dependencies
|
|
18
|
+
*/
|
|
19
|
+
// eslint-disable-next-line no-restricted-imports
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* WordPress dependencies
|
|
23
|
+
*/
|
|
24
|
+
|
|
25
|
+
const TabList = (0, _element.forwardRef)(function TabList({
|
|
26
|
+
children,
|
|
27
|
+
className,
|
|
28
|
+
style
|
|
29
|
+
}, ref) {
|
|
30
|
+
const context = (0, _context.useTabsContext)();
|
|
31
|
+
if (!context) {
|
|
32
|
+
typeof SCRIPT_DEBUG !== "undefined" && SCRIPT_DEBUG === true ? (0, _warning.default)('`Tabs.TabList` must be wrapped in a `Tabs` component.') : void 0;
|
|
33
|
+
return null;
|
|
34
|
+
}
|
|
35
|
+
const {
|
|
36
|
+
store
|
|
37
|
+
} = context;
|
|
38
|
+
return (0, _react.createElement)(Ariakit.TabList, {
|
|
39
|
+
ref: ref,
|
|
40
|
+
style: style,
|
|
41
|
+
store: store,
|
|
42
|
+
className: className,
|
|
43
|
+
render: (0, _react.createElement)(_styles.TabListWrapper, null)
|
|
44
|
+
}, children);
|
|
45
|
+
});
|
|
46
|
+
exports.TabList = TabList;
|
|
47
|
+
//# sourceMappingURL=tablist.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_warning","_interopRequireDefault","_element","_context","_styles","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","TabList","forwardRef","children","className","style","ref","context","useTabsContext","SCRIPT_DEBUG","warning","store","_react","createElement","render","TabListWrapper","exports"],"sources":["@wordpress/components/src/tabs/tablist.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport warning from '@wordpress/warning';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabListProps } from './types';\nimport { useTabsContext } from './context';\nimport { TabListWrapper } from './styles';\n\nexport const TabList = forwardRef< HTMLDivElement, TabListProps >(\n\tfunction TabList( { children, className, style }, ref ) {\n\t\tconst context = useTabsContext();\n\t\tif ( ! context ) {\n\t\t\twarning( '`Tabs.TabList` must be wrapped in a `Tabs` component.' );\n\t\t\treturn null;\n\t\t}\n\t\tconst { store } = context;\n\t\treturn (\n\t\t\t<Ariakit.TabList\n\t\t\t\tref={ ref }\n\t\t\t\tstyle={ style }\n\t\t\t\tstore={ store }\n\t\t\t\tclassName={ className }\n\t\t\t\trender={ <TabListWrapper /> }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Ariakit.TabList>\n\t\t);\n\t}\n);\n"],"mappings":";;;;;;;;AAIA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AAMA,IAAAI,QAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AAA0C,SAAAM,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAR,wBAAAY,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAjB1C;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAWO,MAAMW,OAAO,GAAG,IAAAC,mBAAU,EAChC,SAASD,OAAOA,CAAE;EAAEE,QAAQ;EAAEC,SAAS;EAAEC;AAAM,CAAC,EAAEC,GAAG,EAAG;EACvD,MAAMC,OAAO,GAAG,IAAAC,uBAAc,EAAC,CAAC;EAChC,IAAK,CAAED,OAAO,EAAG;IAChB,OAAAE,YAAA,oBAAAA,YAAA,gBAAAC,gBAAO,EAAE,uDAAwD,CAAC;IAClE,OAAO,IAAI;EACZ;EACA,MAAM;IAAEC;EAAM,CAAC,GAAGJ,OAAO;EACzB,OACC,IAAAK,MAAA,CAAAC,aAAA,EAAC1C,OAAO,CAAC8B,OAAO;IACfK,GAAG,EAAGA,GAAK;IACXD,KAAK,EAAGA,KAAO;IACfM,KAAK,EAAGA,KAAO;IACfP,SAAS,EAAGA,SAAW;IACvBU,MAAM,EAAG,IAAAF,MAAA,CAAAC,aAAA,EAACnC,OAAA,CAAAqC,cAAc,MAAE;EAAG,GAE3BZ,QACc,CAAC;AAEpB,CACD,CAAC;AAACa,OAAA,CAAAf,OAAA,GAAAA,OAAA"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.TabPanel = void 0;
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
var Ariakit = _interopRequireWildcard(require("@ariakit/react"));
|
|
10
|
+
var _element = require("@wordpress/element");
|
|
11
|
+
var _warning = _interopRequireDefault(require("@wordpress/warning"));
|
|
12
|
+
var _context = require("./context");
|
|
13
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
14
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
15
|
+
/**
|
|
16
|
+
* External dependencies
|
|
17
|
+
*/
|
|
18
|
+
// eslint-disable-next-line no-restricted-imports
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* WordPress dependencies
|
|
22
|
+
*/
|
|
23
|
+
|
|
24
|
+
const TabPanel = (0, _element.forwardRef)(function TabPanel({
|
|
25
|
+
children,
|
|
26
|
+
id,
|
|
27
|
+
className,
|
|
28
|
+
style
|
|
29
|
+
}, ref) {
|
|
30
|
+
const context = (0, _element.useContext)(_context.TabsContext);
|
|
31
|
+
if (!context) {
|
|
32
|
+
typeof SCRIPT_DEBUG !== "undefined" && SCRIPT_DEBUG === true ? (0, _warning.default)('`Tabs.TabPanel` must be wrapped in a `Tabs` component.') : void 0;
|
|
33
|
+
return null;
|
|
34
|
+
}
|
|
35
|
+
const {
|
|
36
|
+
store,
|
|
37
|
+
instanceId
|
|
38
|
+
} = context;
|
|
39
|
+
return (0, _react.createElement)(Ariakit.TabPanel, {
|
|
40
|
+
ref: ref,
|
|
41
|
+
style: style,
|
|
42
|
+
store: store,
|
|
43
|
+
id: `${instanceId}-${id}-view`,
|
|
44
|
+
className: className
|
|
45
|
+
}, children);
|
|
46
|
+
});
|
|
47
|
+
exports.TabPanel = TabPanel;
|
|
48
|
+
//# sourceMappingURL=tabpanel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Ariakit","_interopRequireWildcard","require","_element","_warning","_interopRequireDefault","_context","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","TabPanel","forwardRef","children","id","className","style","ref","context","useContext","TabsContext","SCRIPT_DEBUG","warning","store","instanceId","_react","createElement","exports"],"sources":["@wordpress/components/src/tabs/tabpanel.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\n\nimport { forwardRef, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { TabPanelProps } from './types';\n\nimport warning from '@wordpress/warning';\nimport { TabsContext } from './context';\n\nexport const TabPanel = forwardRef< HTMLDivElement, TabPanelProps >(\n\tfunction TabPanel( { children, id, className, style }, ref ) {\n\t\tconst context = useContext( TabsContext );\n\t\tif ( ! context ) {\n\t\t\twarning( '`Tabs.TabPanel` must be wrapped in a `Tabs` component.' );\n\t\t\treturn null;\n\t\t}\n\t\tconst { store, instanceId } = context;\n\n\t\treturn (\n\t\t\t<Ariakit.TabPanel\n\t\t\t\tref={ ref }\n\t\t\t\tstyle={ style }\n\t\t\t\tstore={ store }\n\t\t\t\tid={ `${ instanceId }-${ id }-view` }\n\t\t\t\tclassName={ className }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</Ariakit.TabPanel>\n\t\t);\n\t}\n);\n"],"mappings":";;;;;;;;AAIA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAMA,IAAAC,QAAA,GAAAD,OAAA;AAOA,IAAAE,QAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,QAAA,GAAAJ,OAAA;AAAwC,SAAAK,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAP,wBAAAW,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAlBxC;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAYO,MAAMW,QAAQ,GAAG,IAAAC,mBAAU,EACjC,SAASD,QAAQA,CAAE;EAAEE,QAAQ;EAAEC,EAAE;EAAEC,SAAS;EAAEC;AAAM,CAAC,EAAEC,GAAG,EAAG;EAC5D,MAAMC,OAAO,GAAG,IAAAC,mBAAU,EAAEC,oBAAY,CAAC;EACzC,IAAK,CAAEF,OAAO,EAAG;IAChB,OAAAG,YAAA,oBAAAA,YAAA,gBAAAC,gBAAO,EAAE,wDAAyD,CAAC;IACnE,OAAO,IAAI;EACZ;EACA,MAAM;IAAEC,KAAK;IAAEC;EAAW,CAAC,GAAGN,OAAO;EAErC,OACC,IAAAO,MAAA,CAAAC,aAAA,EAAC5C,OAAO,CAAC6B,QAAQ;IAChBM,GAAG,EAAGA,GAAK;IACXD,KAAK,EAAGA,KAAO;IACfO,KAAK,EAAGA,KAAO;IACfT,EAAE,EAAI,GAAGU,UAAY,IAAIV,EAAI,OAAQ;IACrCC,SAAS,EAAGA;EAAW,GAErBF,QACe,CAAC;AAErB,CACD,CAAC;AAACc,OAAA,CAAAhB,QAAA,GAAAA,QAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["@wordpress/components/src/tabs/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type * as Ariakit from '@ariakit/react';\n\n/**\n * Internal dependencies\n */\nimport type { IconType } from '../icon';\n\nexport type TabsContextProps =\n\t| {\n\t\t\t/**\n\t\t\t * The tabStore object returned by Ariakit's `useTabStore` hook.\n\t\t\t */\n\t\t\tstore: Ariakit.TabStore;\n\t\t\t/**\n\t\t\t * The unique id string for this instance of the Tabs component.\n\t\t\t */\n\t\t\tinstanceId: string;\n\t }\n\t| undefined;\n\nexport type TabsProps = {\n\t/**\n\t * The children elements, which should be at least a\n\t * `Tabs.Tablist` component and a series of `Tabs.TabPanel`\n\t * components.\n\t */\n\tchildren: React.ReactNode;\n\t/**\n\t * When `true`, the tab will be selected when receiving focus (automatic tab\n\t * activation). When `false`, the tab will be selected only when clicked\n\t * (manual tab activation). See the official W3C docs for more info.\n\t *\n\t * @default true\n\t *\n\t * @see https://www.w3.org/WAI/ARIA/apg/patterns/tabpanel/\n\t */\n\tselectOnMove?: boolean;\n\t/**\n\t * The id of the tab to be selected upon mounting of component.\n\t * If this prop is not set, the first tab will be selected by default.\n\t * The id provided will be internally prefixed with the\n\t * `TabsContextProps.instanceId`.\n\t *\n\t * Note: this prop will be overridden by the `selectedTabId` prop if it is\n\t * provided. (Controlled Mode)\n\t */\n\tinitialTabId?: string;\n\t/**\n\t * The function called when a tab has been selected.\n\t * It is passed the id of the newly selected tab as an argument.\n\t */\n\tonSelect?: ( selectedId: string | null | undefined ) => void;\n\n\t/**\n\t * The orientation of the tablist.\n\t *\n\t * @default `horizontal`\n\t */\n\torientation?: 'horizontal' | 'vertical';\n\t/**\n\t * The Id of the tab to display. This id is prepended with the `Tabs`\n\t * instanceId internally.\n\t *\n\t * If left `undefined`, the component assumes it is being used in\n\t * uncontrolled mode. Consequently, any value different than `undefined`\n\t * will set the component in `controlled` mode.\n\t * When in controlled mode, the `null` value will result in no tab being selected.\n\t */\n\tselectedTabId?: string | null;\n};\n\nexport type TabListProps = {\n\t/**\n\t * The children elements, which should be a series of `Tabs.TabPanel` components.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * The class name to apply to the tablist.\n\t */\n\tclassName?: string;\n\t/**\n\t * Custom CSS styles for the rendered tablist.\n\t */\n\tstyle?: React.CSSProperties;\n};\n\nexport type TabProps = {\n\t/**\n\t * The id of the tab, which is prepended with the `Tabs` instanceId.\n\t */\n\tid: string;\n\t/**\n\t * Custom CSS styles for the tab.\n\t */\n\tstyle?: React.CSSProperties;\n\t/**\n\t * The children elements, generally the text to display on the tab.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * The class name to apply to the tab button.\n\t */\n\tclassName?: string;\n\t/**\n\t * The icon used for the tab button.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Determines if the tab button should be disabled.\n\t *\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * The type of component to render the tab button as. If this prop is not\n\t * provided, the tab button will be rendered as a `button` element.\n\t */\n\trender?: React.ReactElement;\n};\n\nexport type TabPanelProps = {\n\t/**\n\t * The children elements, generally the content to display on the tabpanel.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * A unique identifier for the TabPanel, which is used to generate a unique `id` for the underlying element.\n\t */\n\tid: string;\n\t/**\n\t * The class name to apply to the tabpanel.\n\t */\n\tclassName?: string;\n\t/**\n\t * Custom CSS styles for the rendered `TabPanel` component.\n\t */\n\tstyle?: React.CSSProperties;\n};\n"],"mappings":""}
|
package/build/text/component.js
CHANGED
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.default = void 0;
|
|
7
|
+
exports.default = exports.Text = void 0;
|
|
8
8
|
var _react = require("react");
|
|
9
9
|
var _context = require("../context");
|
|
10
10
|
var _view = require("../view");
|
|
@@ -14,10 +14,10 @@ var _hook = _interopRequireDefault(require("./hook"));
|
|
|
14
14
|
*/
|
|
15
15
|
|
|
16
16
|
/**
|
|
17
|
-
* @param
|
|
18
|
-
* @param
|
|
17
|
+
* @param props
|
|
18
|
+
* @param forwardedRef
|
|
19
19
|
*/
|
|
20
|
-
function
|
|
20
|
+
function UnconnectedText(props, forwardedRef) {
|
|
21
21
|
const textProps = (0, _hook.default)(props);
|
|
22
22
|
return (0, _react.createElement)(_view.View, {
|
|
23
23
|
as: "span",
|
|
@@ -42,7 +42,8 @@ function Text(props, forwardedRef) {
|
|
|
42
42
|
* }
|
|
43
43
|
* ```
|
|
44
44
|
*/
|
|
45
|
-
const
|
|
46
|
-
|
|
45
|
+
const Text = (0, _context.contextConnect)(UnconnectedText, 'Text');
|
|
46
|
+
exports.Text = Text;
|
|
47
|
+
var _default = Text;
|
|
47
48
|
exports.default = _default;
|
|
48
49
|
//# sourceMappingURL=component.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_context","require","_view","_hook","_interopRequireDefault","
|
|
1
|
+
{"version":3,"names":["_context","require","_view","_hook","_interopRequireDefault","UnconnectedText","props","forwardedRef","textProps","useText","_react","createElement","View","as","ref","Text","contextConnect","exports","_default","default"],"sources":["@wordpress/components/src/text/component.tsx"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { contextConnect } from '../context';\nimport { View } from '../view';\nimport useText from './hook';\nimport type { Props } from './types';\n\n/**\n * @param props\n * @param forwardedRef\n */\nfunction UnconnectedText(\n\tprops: WordPressComponentProps< Props, 'span' >,\n\tforwardedRef: React.ForwardedRef< any >\n) {\n\tconst textProps = useText( props );\n\n\treturn <View as=\"span\" { ...textProps } ref={ forwardedRef } />;\n}\n\n/**\n * `Text` is a core component that renders text in the library, using the\n * library's typography system.\n *\n * `Text` can be used to render any text-content, like an HTML `p` or `span`.\n *\n * @example\n *\n * ```jsx\n * import { __experimentalText as Text } from `@wordpress/components`;\n *\n * function Example() {\n * \treturn <Text>Code is Poetry</Text>;\n * }\n * ```\n */\nexport const Text = contextConnect( UnconnectedText, 'Text' );\nexport default Text;\n"],"mappings":";;;;;;;;AAIA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAC,sBAAA,CAAAH,OAAA;AANA;AACA;AACA;;AAOA;AACA;AACA;AACA;AACA,SAASI,eAAeA,CACvBC,KAA+C,EAC/CC,YAAuC,EACtC;EACD,MAAMC,SAAS,GAAG,IAAAC,aAAO,EAAEH,KAAM,CAAC;EAElC,OAAO,IAAAI,MAAA,CAAAC,aAAA,EAACT,KAAA,CAAAU,IAAI;IAACC,EAAE,EAAC,MAAM;IAAA,GAAML,SAAS;IAAGM,GAAG,EAAGP;EAAc,CAAE,CAAC;AAChE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMQ,IAAI,GAAG,IAAAC,uBAAc,EAAEX,eAAe,EAAE,MAAO,CAAC;AAACY,OAAA,CAAAF,IAAA,GAAAA,IAAA;AAAA,IAAAG,QAAA,GAC/CH,IAAI;AAAAE,OAAA,CAAAE,OAAA,GAAAD,QAAA"}
|