Michael Ochmann
3 weeks ago
commit
51d6a5057a
41 changed files with 21413 additions and 0 deletions
@ -0,0 +1,17 @@ |
||||
.idea |
||||
.vscode |
||||
.DS_Store |
||||
|
||||
build/Release |
||||
node_modules |
||||
|
||||
logs |
||||
*.log |
||||
npm-debug.log* |
||||
yarn-debug.log* |
||||
yarn-error.log* |
||||
|
||||
*.zip |
||||
*.tgz |
||||
.env |
||||
.eslintcache |
||||
@ -0,0 +1,45 @@ |
||||
:root { |
||||
--wpsi-accent-color: orange; |
||||
} |
||||
|
||||
.wpsi-icons { |
||||
display: grid; |
||||
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); |
||||
gap: 3rem; |
||||
padding: 3rem; |
||||
} |
||||
.wpsi-icons .icon { |
||||
text-align: center; |
||||
border: solid 3px #aaa; |
||||
border-radius: 12px; |
||||
padding: 2rem; |
||||
color: #888; |
||||
transition: all 0.2s ease-in-out; |
||||
background: rgba(255,255,255,0.8); |
||||
} |
||||
.wpsi-icons .wpsi { |
||||
font-size: 3rem; |
||||
display: block; |
||||
} |
||||
.wpsi-icons .name { |
||||
margin: 1rem 0; |
||||
font-size: 1.2rem; |
||||
display: block; |
||||
} |
||||
.wpsi-icons input { |
||||
display: block; |
||||
width: 100%; |
||||
border: solid 1px #ddd !important; |
||||
box-shadow: none !important; |
||||
border-radius: 0; |
||||
outline: 0 !important; |
||||
} |
||||
.wpsi-icons input:focus { |
||||
border: solid 1px var(--wpsi-accent-color) !important; |
||||
} |
||||
.wpsi-icons .icon:has(input:not(:placeholder-shown)) { |
||||
border-color: var(--wpsi-accent-color); |
||||
} |
||||
.wpsi-icons .icon:has(input:not(:placeholder-shown)) .wpsi { |
||||
color: var(--wpsi-accent-color); |
||||
} |
||||
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
@ -0,0 +1,89 @@ |
||||
@font-face { |
||||
font-family: 'WP-Social-Icons'; |
||||
src: |
||||
url('fonts/WP-Social-Icons.ttf?iiiiaj') format('truetype'), |
||||
url('fonts/WP-Social-Icons.woff?iiiiaj') format('woff'), |
||||
url('fonts/WP-Social-Icons.svg?iiiiaj#WP-Social-Icons') format('svg'); |
||||
font-weight: normal; |
||||
font-style: normal; |
||||
font-display: block; |
||||
} |
||||
|
||||
[class^="wpsi-"], [class*=" wpsi-"] { |
||||
/* use !important to prevent issues with browser extensions that change fonts */ |
||||
font-family: 'WP-Social-Icons' !important; |
||||
speak: never; |
||||
font-style: normal; |
||||
font-weight: normal; |
||||
font-variant: normal; |
||||
text-transform: none; |
||||
line-height: 1; |
||||
|
||||
/* Better Font Rendering =========== */ |
||||
-webkit-font-smoothing: antialiased; |
||||
-moz-osx-font-smoothing: grayscale; |
||||
} |
||||
|
||||
.wpsi-wechat:before { |
||||
content: "\e900"; |
||||
} |
||||
.wpsi-snapchat:before { |
||||
content: "\e901"; |
||||
} |
||||
.wpsi-baidu:before { |
||||
content: "\e902"; |
||||
} |
||||
.wpsi-medium:before { |
||||
content: "\e903"; |
||||
} |
||||
.wpsi-discord:before { |
||||
content: "\e904"; |
||||
} |
||||
.wpsi-teams:before { |
||||
content: "\e905"; |
||||
} |
||||
.wpsi-x:before { |
||||
content: "\e906"; |
||||
} |
||||
.wpsi-mastodon:before { |
||||
content: "\e907"; |
||||
} |
||||
.wpsi-tiktok:before { |
||||
content: "\e908"; |
||||
} |
||||
.wpsi-whatsapp:before { |
||||
content: "\e909"; |
||||
} |
||||
.wpsi-wordpress:before { |
||||
content: "\e90a"; |
||||
} |
||||
.wpsi-tumblr:before { |
||||
content: "\e90b"; |
||||
} |
||||
.wpsi-twitch:before { |
||||
content: "\e90c"; |
||||
} |
||||
.wpsi-reddit:before { |
||||
content: "\e90d"; |
||||
} |
||||
.wpsi-spotify:before { |
||||
content: "\e90e"; |
||||
} |
||||
.wpsi-telegram:before { |
||||
content: "\e90f"; |
||||
} |
||||
.wpsi-pinterest:before { |
||||
content: "\e910"; |
||||
} |
||||
.wpsi-youtube:before { |
||||
content: "\e911"; |
||||
} |
||||
.wpsi-xing:before { |
||||
content: "\e912"; |
||||
} |
||||
.wpsi-instagram:before { |
||||
content: "\e913"; |
||||
} |
||||
.wpsi-facebook:before { |
||||
content: "\e914"; |
||||
} |
||||
@ -0,0 +1,42 @@ |
||||
{ |
||||
"$schema": "https://schemas.wp.org/trunk/block.json", |
||||
"apiVersion": 3, |
||||
"name": "massivedynamic/wpsi-menu", |
||||
"version": "0.0.1", |
||||
"title": "WP Social Icons Menu", |
||||
"category": "widgets", |
||||
"icon": "networking", |
||||
"description": "WP Social Icons Menu Block for Gutenberg", |
||||
"example": {}, |
||||
"supports": { |
||||
"html": false |
||||
}, |
||||
"attributes": { |
||||
"orientation": { |
||||
"type": "string", |
||||
"enum": [ |
||||
"horizontal", |
||||
"vertical" |
||||
], |
||||
"default": "horizontal" |
||||
}, |
||||
"alignment": { |
||||
"type": "string", |
||||
"enum": [ |
||||
"left", |
||||
"center", |
||||
"right" |
||||
], |
||||
"default": "center" |
||||
}, |
||||
"exclude": { |
||||
"type": "array", |
||||
"default": [] |
||||
} |
||||
}, |
||||
"textdomain": "wpsi-menu", |
||||
"editorScript": "file:./index.js", |
||||
"editorStyle": "file:./index.css", |
||||
"style": "file:./style-index.css", |
||||
"render": "file:./render.php" |
||||
} |
||||
@ -0,0 +1,31 @@ |
||||
/*!****************************************************************************************************************************************************************************************************************************************!*\ |
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***! |
||||
\****************************************************************************************************************************************************************************************************************************************/ |
||||
.wpsi-menu { |
||||
padding: 2rem 0; |
||||
} |
||||
.wpsi-menu a { |
||||
text-decoration: none; |
||||
} |
||||
.wpsi-menu.align-left { |
||||
text-align: right; |
||||
} |
||||
.wpsi-menu.align-center { |
||||
text-align: center; |
||||
} |
||||
.wpsi-menu.align-right { |
||||
text-align: left; |
||||
} |
||||
.wpsi-menu.horizontal a:not(:last-of-type) { |
||||
margin-left: 2rem; |
||||
} |
||||
.wpsi-menu.vertical a { |
||||
display: block; |
||||
} |
||||
.wpsi-menu.vertical a:not(:last-of-type) { |
||||
margin-bottom: 2rem; |
||||
} |
||||
.wpsi-menu .wpsi { |
||||
font-size: 2rem; |
||||
color: #333; |
||||
} |
||||
@ -0,0 +1 @@ |
||||
<?php return array('dependencies' => array('react-jsx-runtime', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '0f8272dc7fc5d65bc4e2'); |
||||
@ -0,0 +1,33 @@ |
||||
/*!****************************************************************************************************************************************************************************************************************************************!*\ |
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***! |
||||
\****************************************************************************************************************************************************************************************************************************************/ |
||||
.wpsi-menu { |
||||
padding: 2rem 0; |
||||
} |
||||
.wpsi-menu a { |
||||
text-decoration: none; |
||||
} |
||||
.wpsi-menu.align-left { |
||||
text-align: left; |
||||
} |
||||
.wpsi-menu.align-center { |
||||
text-align: center; |
||||
} |
||||
.wpsi-menu.align-right { |
||||
text-align: right; |
||||
} |
||||
.wpsi-menu.horizontal a:not(:last-of-type) { |
||||
margin-right: 2rem; |
||||
} |
||||
.wpsi-menu.vertical a { |
||||
display: block; |
||||
} |
||||
.wpsi-menu.vertical a:not(:last-of-type) { |
||||
margin-bottom: 2rem; |
||||
} |
||||
.wpsi-menu .wpsi { |
||||
font-size: 2rem; |
||||
color: #333; |
||||
} |
||||
|
||||
/*# sourceMappingURL=index.css.map*/ |
||||
@ -0,0 +1 @@ |
||||
{"version":3,"file":"index.css","mappings":";;;AAAA;EACC;AACD;AACC;EACC;AACF;AAEC;EACC;AAAF;AAEC;EACC;AAAF;AAEC;EACC;AAAF;AAKG;EACC;AAHJ;AASE;EACC;AAPH;AASG;EACC;AAPJ;AAYC;EACC;EACA;AAVF,C","sources":["webpack://wpsi-menu/./src/editor.scss"],"sourcesContent":[".wpsi-menu {\n\tpadding: 2rem 0;\n\n\ta {\n\t\ttext-decoration: none;\n\t}\n\n\t&.align-left {\n\t\ttext-align: left;\n\t}\n\t&.align-center {\n\t\ttext-align: center;\n\t}\n\t&.align-right {\n\t\ttext-align: right;\n\t}\n\n\t&.horizontal {\n\t\ta {\n\t\t\t&:not(:last-of-type) {\n\t\t\t\tmargin-right: 2rem;\n\t\t\t}\n\t\t}\n\t}\n\n\t&.vertical {\n\t\ta {\n\t\t\tdisplay: block;\n\t\t\t\n\t\t\t&:not(:last-of-type) {\n\t\t\t\tmargin-bottom: 2rem;\n\t\t\t}\n\t\t}\n\t}\n\n\t.wpsi {\n\t\tfont-size: 2rem;\n\t\tcolor: #333;\n\t}\n}"],"names":[],"sourceRoot":""} |
||||
@ -0,0 +1,616 @@ |
||||
/******/ (() => { // webpackBootstrap
|
||||
/******/ "use strict"; |
||||
/******/ var __webpack_modules__ = ({ |
||||
|
||||
/***/ "./node_modules/@wordpress/icons/build-module/library/align-center.js": |
||||
/*!****************************************************************************!*\ |
||||
!*** ./node_modules/@wordpress/icons/build-module/library/align-center.js ***! |
||||
\****************************************************************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives"); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__); |
||||
/** |
||||
* WordPress dependencies |
||||
*/ |
||||
|
||||
|
||||
const alignCenter = /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.SVG, { |
||||
xmlns: "http://www.w3.org/2000/svg", |
||||
viewBox: "0 0 24 24", |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.Path, { |
||||
d: "M7.5 5.5h9V4h-9v1.5Zm-3.5 7h16V11H4v1.5Zm3.5 7h9V18h-9v1.5Z" |
||||
}) |
||||
}); |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (alignCenter); |
||||
//# sourceMappingURL=align-center.js.map
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./node_modules/@wordpress/icons/build-module/library/align-left.js": |
||||
/*!**************************************************************************!*\ |
||||
!*** ./node_modules/@wordpress/icons/build-module/library/align-left.js ***! |
||||
\**************************************************************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives"); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__); |
||||
/** |
||||
* WordPress dependencies |
||||
*/ |
||||
|
||||
|
||||
const alignLeft = /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.SVG, { |
||||
xmlns: "http://www.w3.org/2000/svg", |
||||
viewBox: "0 0 24 24", |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.Path, { |
||||
d: "M13 5.5H4V4h9v1.5Zm7 7H4V11h16v1.5Zm-7 7H4V18h9v1.5Z" |
||||
}) |
||||
}); |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (alignLeft); |
||||
//# sourceMappingURL=align-left.js.map
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./node_modules/@wordpress/icons/build-module/library/align-right.js": |
||||
/*!***************************************************************************!*\ |
||||
!*** ./node_modules/@wordpress/icons/build-module/library/align-right.js ***! |
||||
\***************************************************************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives"); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__); |
||||
/** |
||||
* WordPress dependencies |
||||
*/ |
||||
|
||||
|
||||
const alignRight = /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.SVG, { |
||||
xmlns: "http://www.w3.org/2000/svg", |
||||
viewBox: "0 0 24 24", |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.Path, { |
||||
d: "M11.111 5.5H20V4h-8.889v1.5ZM4 12.5h16V11H4v1.5Zm7.111 7H20V18h-8.889v1.5Z" |
||||
}) |
||||
}); |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (alignRight); |
||||
//# sourceMappingURL=align-right.js.map
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./node_modules/@wordpress/icons/build-module/library/justify-center-vertical.js": |
||||
/*!***************************************************************************************!*\ |
||||
!*** ./node_modules/@wordpress/icons/build-module/library/justify-center-vertical.js ***! |
||||
\***************************************************************************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives"); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__); |
||||
/** |
||||
* WordPress dependencies |
||||
*/ |
||||
|
||||
|
||||
const justifyCenterVertical = /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.SVG, { |
||||
xmlns: "http://www.w3.org/2000/svg", |
||||
viewBox: "0 0 24 24", |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.Path, { |
||||
d: "M20 11h-5V4H9v7H4v1.5h5V20h6v-7.5h5z" |
||||
}) |
||||
}); |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (justifyCenterVertical); |
||||
//# sourceMappingURL=justify-center-vertical.js.map
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./node_modules/@wordpress/icons/build-module/library/justify-center.js": |
||||
/*!******************************************************************************!*\ |
||||
!*** ./node_modules/@wordpress/icons/build-module/library/justify-center.js ***! |
||||
\******************************************************************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/primitives */ "@wordpress/primitives"); |
||||
/* harmony import */ var _wordpress_primitives__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__); |
||||
/** |
||||
* WordPress dependencies |
||||
*/ |
||||
|
||||
|
||||
const justifyCenter = /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.SVG, { |
||||
xmlns: "http://www.w3.org/2000/svg", |
||||
viewBox: "0 0 24 24", |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_0__.Path, { |
||||
d: "M12.5 15v5H11v-5H4V9h7V4h1.5v5h7v6h-7Z" |
||||
}) |
||||
}); |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (justifyCenter); |
||||
//# sourceMappingURL=justify-center.js.map
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./src/block.json": |
||||
/*!************************!*\ |
||||
!*** ./src/block.json ***! |
||||
\************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = /*#__PURE__*/JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"massivedynamic/wpsi-menu","version":"0.0.1","title":"WP Social Icons Menu","category":"widgets","icon":"networking","description":"WP Social Icons Menu Block for Gutenberg","example":{},"supports":{"html":false},"attributes":{"orientation":{"type":"string","enum":["horizontal","vertical"],"default":"horizontal"},"alignment":{"type":"string","enum":["left","center","right"],"default":"center"},"exclude":{"type":"array","default":[]}},"textdomain":"wpsi-menu","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css","render":"file:./render.php"}'); |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./src/edit.js": |
||||
/*!*********************!*\ |
||||
!*** ./src/edit.js ***! |
||||
\*********************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, { |
||||
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) |
||||
/* harmony export */ }); |
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n"); |
||||
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor"); |
||||
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__); |
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element"); |
||||
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__); |
||||
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/api-fetch */ "@wordpress/api-fetch"); |
||||
/* harmony import */ var _wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3__); |
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components"); |
||||
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__); |
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/justify-center.js"); |
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/justify-center-vertical.js"); |
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/align-left.js"); |
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/align-center.js"); |
||||
/* harmony import */ var _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @wordpress/icons */ "./node_modules/@wordpress/icons/build-module/library/align-right.js"); |
||||
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react/jsx-runtime */ "react/jsx-runtime"); |
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__); |
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const Edit = ({ |
||||
attributes, |
||||
setAttributes |
||||
}) => { |
||||
const [items, setItems] = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)([]); |
||||
const { |
||||
alignment, |
||||
orientation, |
||||
exclude |
||||
} = attributes; |
||||
const iterator = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useMemo)(() => { |
||||
const out = []; |
||||
for (const [key, value] of Object.entries(items)) out.push({ |
||||
key, |
||||
value |
||||
}); |
||||
return out; |
||||
}, [items]); |
||||
const activeItems = (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useMemo)(() => { |
||||
return iterator.filter(item => !exclude.includes(item.key)); |
||||
}, [iterator, exclude]); |
||||
const excludeService = service => { |
||||
setAttributes({ |
||||
exclude: exclude.includes(service) ? exclude.filter(item => item !== service) : [...exclude, service] |
||||
}); |
||||
}; |
||||
(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useEffect)(() => { |
||||
_wordpress_api_fetch__WEBPACK_IMPORTED_MODULE_3___default()({ |
||||
path: "/wp-social-icons/items" |
||||
}).then(response => { |
||||
setItems(response); |
||||
}).catch(error => console.error("ERR", error)); |
||||
}, []); |
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)("section", { |
||||
...(0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps)(), |
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.InspectorControls, { |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelBody, { |
||||
title: "Active Services", |
||||
initialOpen: true, |
||||
children: iterator.map(item => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.PanelRow, { |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToggleControl, { |
||||
label: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.Fragment, { |
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", { |
||||
className: `wpsi-${item.key}`, |
||||
style: { |
||||
fontSize: "1.2rem", |
||||
verticalAlign: "middle", |
||||
marginRight: "0.5rem" |
||||
} |
||||
}), " ", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", { |
||||
style: { |
||||
verticalAlign: "middle" |
||||
}, |
||||
children: item.key |
||||
})] |
||||
}), |
||||
checked: !exclude.includes(item.key), |
||||
onChange: () => excludeService(item.key) |
||||
}) |
||||
})) |
||||
}) |
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.BlockControls, { |
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, { |
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { |
||||
isActive: orientation === "horizontal", |
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_7__["default"], |
||||
onClick: () => setAttributes({ |
||||
orientation: "horizontal" |
||||
}) |
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { |
||||
isActive: orientation === "vertical", |
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_8__["default"], |
||||
title: "wdwdwd", |
||||
onClick: () => setAttributes({ |
||||
orientation: "vertical" |
||||
}) |
||||
})] |
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsxs)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarGroup, { |
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { |
||||
isActive: alignment === "left", |
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_9__["default"], |
||||
title: "align left", |
||||
onClick: () => setAttributes({ |
||||
alignment: "left" |
||||
}) |
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { |
||||
isActive: alignment === "center", |
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_10__["default"], |
||||
title: "align center", |
||||
onClick: () => setAttributes({ |
||||
alignment: "center" |
||||
}) |
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_4__.ToolbarButton, { |
||||
isActive: alignment === "right", |
||||
icon: _wordpress_icons__WEBPACK_IMPORTED_MODULE_11__["default"], |
||||
title: "align right", |
||||
onClick: () => setAttributes({ |
||||
alignment: "right" |
||||
}) |
||||
})] |
||||
})] |
||||
}), activeItems.length < 1 ? /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("section", { |
||||
children: "No elements" |
||||
}) : /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("nav", { |
||||
className: `wpsi-menu ${orientation} align-${alignment}`, |
||||
children: activeItems.map(item => /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("a", { |
||||
href: item.value, |
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_6__.jsx)("span", { |
||||
className: `wpsi wpsi-${item.key}` |
||||
}) |
||||
})) |
||||
})] |
||||
}); |
||||
}; |
||||
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Edit); |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./src/editor.scss": |
||||
/*!*************************!*\ |
||||
!*** ./src/editor.scss ***! |
||||
\*************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
// extracted by mini-css-extract-plugin
|
||||
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./src/index.js": |
||||
/*!**********************!*\ |
||||
!*** ./src/index.js ***! |
||||
\**********************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks"); |
||||
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__); |
||||
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./edit */ "./src/edit.js"); |
||||
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./block.json */ "./src/block.json"); |
||||
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss"); |
||||
|
||||
|
||||
|
||||
|
||||
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_2__.name, { |
||||
edit: _edit__WEBPACK_IMPORTED_MODULE_1__["default"] |
||||
}); |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "./src/style.scss": |
||||
/*!************************!*\ |
||||
!*** ./src/style.scss ***! |
||||
\************************/ |
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { |
||||
|
||||
__webpack_require__.r(__webpack_exports__); |
||||
// extracted by mini-css-extract-plugin
|
||||
|
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/api-fetch": |
||||
/*!**********************************!*\ |
||||
!*** external ["wp","apiFetch"] ***! |
||||
\**********************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["apiFetch"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/block-editor": |
||||
/*!*************************************!*\ |
||||
!*** external ["wp","blockEditor"] ***! |
||||
\*************************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["blockEditor"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/blocks": |
||||
/*!********************************!*\ |
||||
!*** external ["wp","blocks"] ***! |
||||
\********************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["blocks"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/components": |
||||
/*!************************************!*\ |
||||
!*** external ["wp","components"] ***! |
||||
\************************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["components"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/element": |
||||
/*!*********************************!*\ |
||||
!*** external ["wp","element"] ***! |
||||
\*********************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["element"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/i18n": |
||||
/*!******************************!*\ |
||||
!*** external ["wp","i18n"] ***! |
||||
\******************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["i18n"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "@wordpress/primitives": |
||||
/*!************************************!*\ |
||||
!*** external ["wp","primitives"] ***! |
||||
\************************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["wp"]["primitives"]; |
||||
|
||||
/***/ }), |
||||
|
||||
/***/ "react/jsx-runtime": |
||||
/*!**********************************!*\ |
||||
!*** external "ReactJSXRuntime" ***! |
||||
\**********************************/ |
||||
/***/ ((module) => { |
||||
|
||||
module.exports = window["ReactJSXRuntime"]; |
||||
|
||||
/***/ }) |
||||
|
||||
/******/ }); |
||||
/************************************************************************/ |
||||
/******/ // The module cache
|
||||
/******/ var __webpack_module_cache__ = {}; |
||||
/******/
|
||||
/******/ // The require function
|
||||
/******/ function __webpack_require__(moduleId) { |
||||
/******/ // Check if module is in cache
|
||||
/******/ var cachedModule = __webpack_module_cache__[moduleId]; |
||||
/******/ if (cachedModule !== undefined) { |
||||
/******/ return cachedModule.exports; |
||||
/******/ } |
||||
/******/ // Create a new module (and put it into the cache)
|
||||
/******/ var module = __webpack_module_cache__[moduleId] = { |
||||
/******/ // no module.id needed
|
||||
/******/ // no module.loaded needed
|
||||
/******/ exports: {} |
||||
/******/ }; |
||||
/******/
|
||||
/******/ // Execute the module function
|
||||
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); |
||||
/******/
|
||||
/******/ // Return the exports of the module
|
||||
/******/ return module.exports; |
||||
/******/ } |
||||
/******/
|
||||
/******/ // expose the modules object (__webpack_modules__)
|
||||
/******/ __webpack_require__.m = __webpack_modules__; |
||||
/******/
|
||||
/************************************************************************/ |
||||
/******/ /* webpack/runtime/chunk loaded */ |
||||
/******/ (() => { |
||||
/******/ var deferred = []; |
||||
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => { |
||||
/******/ if(chunkIds) { |
||||
/******/ priority = priority || 0; |
||||
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1]; |
||||
/******/ deferred[i] = [chunkIds, fn, priority]; |
||||
/******/ return; |
||||
/******/ } |
||||
/******/ var notFulfilled = Infinity; |
||||
/******/ for (var i = 0; i < deferred.length; i++) { |
||||
/******/ var [chunkIds, fn, priority] = deferred[i]; |
||||
/******/ var fulfilled = true; |
||||
/******/ for (var j = 0; j < chunkIds.length; j++) { |
||||
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) { |
||||
/******/ chunkIds.splice(j--, 1); |
||||
/******/ } else { |
||||
/******/ fulfilled = false; |
||||
/******/ if(priority < notFulfilled) notFulfilled = priority; |
||||
/******/ } |
||||
/******/ } |
||||
/******/ if(fulfilled) { |
||||
/******/ deferred.splice(i--, 1) |
||||
/******/ var r = fn(); |
||||
/******/ if (r !== undefined) result = r; |
||||
/******/ } |
||||
/******/ } |
||||
/******/ return result; |
||||
/******/ }; |
||||
/******/ })(); |
||||
/******/
|
||||
/******/ /* webpack/runtime/compat get default export */ |
||||
/******/ (() => { |
||||
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
||||
/******/ __webpack_require__.n = (module) => { |
||||
/******/ var getter = module && module.__esModule ? |
||||
/******/ () => (module['default']) : |
||||
/******/ () => (module); |
||||
/******/ __webpack_require__.d(getter, { a: getter }); |
||||
/******/ return getter; |
||||
/******/ }; |
||||
/******/ })(); |
||||
/******/
|
||||
/******/ /* webpack/runtime/define property getters */ |
||||
/******/ (() => { |
||||
/******/ // define getter functions for harmony exports
|
||||
/******/ __webpack_require__.d = (exports, definition) => { |
||||
/******/ for(var key in definition) { |
||||
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { |
||||
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); |
||||
/******/ } |
||||
/******/ } |
||||
/******/ }; |
||||
/******/ })(); |
||||
/******/
|
||||
/******/ /* webpack/runtime/hasOwnProperty shorthand */ |
||||
/******/ (() => { |
||||
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) |
||||
/******/ })(); |
||||
/******/
|
||||
/******/ /* webpack/runtime/make namespace object */ |
||||
/******/ (() => { |
||||
/******/ // define __esModule on exports
|
||||
/******/ __webpack_require__.r = (exports) => { |
||||
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { |
||||
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); |
||||
/******/ } |
||||
/******/ Object.defineProperty(exports, '__esModule', { value: true }); |
||||
/******/ }; |
||||
/******/ })(); |
||||
/******/
|
||||
/******/ /* webpack/runtime/jsonp chunk loading */ |
||||
/******/ (() => { |
||||
/******/ // no baseURI
|
||||
/******/
|
||||
/******/ // object to store loaded and loading chunks
|
||||
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
|
||||
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
|
||||
/******/ var installedChunks = { |
||||
/******/ "index": 0, |
||||
/******/ "./style-index": 0 |
||||
/******/ }; |
||||
/******/
|
||||
/******/ // no chunk on demand loading
|
||||
/******/
|
||||
/******/ // no prefetching
|
||||
/******/
|
||||
/******/ // no preloaded
|
||||
/******/
|
||||
/******/ // no HMR
|
||||
/******/
|
||||
/******/ // no HMR manifest
|
||||
/******/
|
||||
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0); |
||||
/******/
|
||||
/******/ // install a JSONP callback for chunk loading
|
||||
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => { |
||||
/******/ var [chunkIds, moreModules, runtime] = data; |
||||
/******/ // add "moreModules" to the modules object,
|
||||
/******/ // then flag all "chunkIds" as loaded and fire callback
|
||||
/******/ var moduleId, chunkId, i = 0; |
||||
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) { |
||||
/******/ for(moduleId in moreModules) { |
||||
/******/ if(__webpack_require__.o(moreModules, moduleId)) { |
||||
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId]; |
||||
/******/ } |
||||
/******/ } |
||||
/******/ if(runtime) var result = runtime(__webpack_require__); |
||||
/******/ } |
||||
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data); |
||||
/******/ for(;i < chunkIds.length; i++) { |
||||
/******/ chunkId = chunkIds[i]; |
||||
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) { |
||||
/******/ installedChunks[chunkId][0](); |
||||
/******/ } |
||||
/******/ installedChunks[chunkId] = 0; |
||||
/******/ } |
||||
/******/ return __webpack_require__.O(result); |
||||
/******/ } |
||||
/******/
|
||||
/******/ var chunkLoadingGlobal = globalThis["webpackChunkwpsi_menu"] = globalThis["webpackChunkwpsi_menu"] || []; |
||||
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0)); |
||||
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal)); |
||||
/******/ })(); |
||||
/******/
|
||||
/************************************************************************/ |
||||
/******/
|
||||
/******/ // startup
|
||||
/******/ // Load entry module and return exports
|
||||
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
|
||||
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/index.js"))) |
||||
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__); |
||||
/******/
|
||||
/******/ })() |
||||
; |
||||
//# sourceMappingURL=index.js.map
|
||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,11 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
use wpsocialicons\Settings; |
||||
|
||||
["exclude" => $exclude, "orientation" => $orientation, "alignment" => $alignment] = $attributes ?? []; |
||||
$services = array_filter((array) Settings::Services(), fn ($value, $key) => !in_array($key, $exclude), ARRAY_FILTER_USE_BOTH); |
||||
|
||||
the_wp_social_icons([ |
||||
"exclude" => $exclude, |
||||
"container_class" => "wp-social-icons $orientation align-$alignment", |
||||
]); |
||||
@ -0,0 +1,36 @@ |
||||
/*!***************************************************************************************************************************************************************************************************************************************!*\ |
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***! |
||||
\***************************************************************************************************************************************************************************************************************************************/ |
||||
.wp-block-create-block-wpsi-menu { |
||||
background-color: #21759b; |
||||
color: #fff; |
||||
padding: 2px; |
||||
} |
||||
|
||||
nav.wp-social-icons { |
||||
display: flex; |
||||
padding: 2rem 0; |
||||
gap: 2rem; |
||||
align-items: center; |
||||
} |
||||
nav.wp-social-icons > a .wpsi { |
||||
font-size: 1.8rem; |
||||
} |
||||
nav.wp-social-icons.align-center { |
||||
justify-content: center; |
||||
} |
||||
nav.wp-social-icons.align-left { |
||||
justify-content: flex-start; |
||||
} |
||||
nav.wp-social-icons.align-right { |
||||
justify-content: flex-end; |
||||
} |
||||
nav.wp-social-icons.vertical { |
||||
flex-direction: column; |
||||
} |
||||
nav.wp-social-icons.vertical.align-left { |
||||
align-items: flex-start; |
||||
} |
||||
nav.wp-social-icons.vertical.align-right { |
||||
align-items: flex-end; |
||||
} |
||||
@ -0,0 +1,38 @@ |
||||
/*!***************************************************************************************************************************************************************************************************************************************!*\ |
||||
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***! |
||||
\***************************************************************************************************************************************************************************************************************************************/ |
||||
.wp-block-create-block-wpsi-menu { |
||||
background-color: #21759b; |
||||
color: #fff; |
||||
padding: 2px; |
||||
} |
||||
|
||||
nav.wp-social-icons { |
||||
display: flex; |
||||
padding: 2rem 0; |
||||
gap: 2rem; |
||||
align-items: center; |
||||
} |
||||
nav.wp-social-icons > a .wpsi { |
||||
font-size: 1.8rem; |
||||
} |
||||
nav.wp-social-icons.align-center { |
||||
justify-content: center; |
||||
} |
||||
nav.wp-social-icons.align-left { |
||||
justify-content: flex-start; |
||||
} |
||||
nav.wp-social-icons.align-right { |
||||
justify-content: flex-end; |
||||
} |
||||
nav.wp-social-icons.vertical { |
||||
flex-direction: column; |
||||
} |
||||
nav.wp-social-icons.vertical.align-left { |
||||
align-items: flex-start; |
||||
} |
||||
nav.wp-social-icons.vertical.align-right { |
||||
align-items: flex-end; |
||||
} |
||||
|
||||
/*# sourceMappingURL=style-index.css.map*/ |
||||
@ -0,0 +1 @@ |
||||
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;EACC;EACA;EACA;AACD;;AAEA;EACC;EACA;EACA;EACA;AACD;AAEE;EACC;AAAH;AAIC;EACC;AAFF;AAKC;EACC;AAHF;AAMC;EACC;AAJF;AAOC;EACC;AALF;AAOE;EACC;AALH;AAQE;EACC;AANH,C","sources":["webpack://wpsi-menu/./src/style.scss"],"sourcesContent":[".wp-block-create-block-wpsi-menu {\n\tbackground-color: #21759b;\n\tcolor: #fff;\n\tpadding: 2px;\n}\n\nnav.wp-social-icons {\n\tdisplay: flex;\n\tpadding: 2rem 0;\n\tgap: 2rem;\n\talign-items: center;\n\n\t> a {\n\t\t.wpsi {\n\t\t\tfont-size: 1.8rem;\n\t\t}\n\t}\n\n\t&.align-center {\n\t\tjustify-content: center;\n\t}\n\n\t&.align-left {\n\t\tjustify-content: flex-start;\n\t}\n\n\t&.align-right {\n\t\tjustify-content: flex-end;\n\t}\n\n\t&.vertical {\n\t\tflex-direction: column;\n\n\t\t&.align-left {\n\t\t\talign-items: flex-start;\n\t\t}\n\t\t\n\t\t&.align-right {\n\t\t\talign-items: flex-end;\n\t\t}\n\t}\n}\n"],"names":[],"sourceRoot":""} |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,23 @@ |
||||
{ |
||||
"name": "wpsi-menu", |
||||
"version": "0.0.1", |
||||
"description": "WP Social Icons Menu Block for Gutenberg", |
||||
"author": "Mike Ochmann <miko@massivedynamic.eu>", |
||||
"license": "MIT", |
||||
"main": "build/index.js", |
||||
"scripts": { |
||||
"build": "wp-scripts build", |
||||
"format": "wp-scripts format", |
||||
"lint:css": "wp-scripts lint-style", |
||||
"lint:js": "wp-scripts lint-js", |
||||
"packages-update": "wp-scripts packages-update", |
||||
"plugin-zip": "wp-scripts plugin-zip", |
||||
"start": "wp-scripts start" |
||||
}, |
||||
"devDependencies": { |
||||
"@wordpress/scripts": "^30.19.0" |
||||
}, |
||||
"dependencies": { |
||||
"@wordpress/icons": "^10.26.0" |
||||
} |
||||
} |
||||
@ -0,0 +1,35 @@ |
||||
{ |
||||
"$schema" : "https://schemas.wp.org/trunk/block.json", |
||||
"apiVersion" : 3, |
||||
"name" : "massivedynamic/wpsi-menu", |
||||
"version" : "0.0.1", |
||||
"title" : "WP Social Icons Menu", |
||||
"category" : "widgets", |
||||
"icon" : "networking", |
||||
"description" : "WP Social Icons Menu Block for Gutenberg", |
||||
"example" : {}, |
||||
"supports" : { |
||||
"html": false |
||||
}, |
||||
"attributes" : { |
||||
"orientation" : { |
||||
"type" : "string", |
||||
"enum" : ["horizontal", "vertical"], |
||||
"default" : "horizontal" |
||||
}, |
||||
"alignment" : { |
||||
"type" : "string", |
||||
"enum" : ["left", "center", "right"], |
||||
"default" : "center" |
||||
}, |
||||
"exclude" : { |
||||
"type" : "array", |
||||
"default" : [] |
||||
} |
||||
}, |
||||
"textdomain" : "wpsi-menu", |
||||
"editorScript" : "file:./index.js", |
||||
"editorStyle" : "file:./index.css", |
||||
"style" : "file:./style-index.css", |
||||
"render" : "file:./render.php" |
||||
} |
||||
@ -0,0 +1,94 @@ |
||||
import {__} from "@wordpress/i18n"; |
||||
import {useBlockProps, BlockControls, InspectorControls} from "@wordpress/block-editor"; |
||||
import {useState, useEffect, useMemo} from "@wordpress/element"; |
||||
import apiFetch from "@wordpress/api-fetch"; |
||||
|
||||
import { |
||||
Spinner, |
||||
PanelBody, |
||||
PanelRow, |
||||
RangeControl, |
||||
TextControl, |
||||
ToggleControl, |
||||
ToolbarButton, |
||||
ToolbarGroup, |
||||
Modal, |
||||
Button, |
||||
|
||||
__experimentalToggleGroupControl as ToggleGroupControl, |
||||
__experimentalToggleGroupControlOption as ToggleGroupControlOption, |
||||
__experimentalText as Text, |
||||
__experimentalHStack as HStack |
||||
} from "@wordpress/components"; |
||||
|
||||
import { |
||||
justifyCenter, |
||||
justifyCenterVertical, |
||||
alignLeft, |
||||
alignCenter, |
||||
alignRight |
||||
} from '@wordpress/icons'; |
||||
|
||||
import "./editor.scss"; |
||||
|
||||
const Edit = ({attributes, setAttributes}) => { |
||||
const [items, setItems] = useState([]); |
||||
|
||||
const {alignment, orientation, exclude} = attributes; |
||||
|
||||
const iterator = useMemo(() => { |
||||
const out = []; |
||||
|
||||
for (const [key, value] of Object.entries(items)) |
||||
out.push({key, value}); |
||||
|
||||
return out; |
||||
}, [items]); |
||||
|
||||
const activeItems = useMemo(() => { |
||||
return iterator.filter(item => !exclude.includes(item.key)); |
||||
}, [iterator, exclude]); |
||||
|
||||
const excludeService = service => { |
||||
setAttributes({exclude : exclude.includes(service) ? exclude.filter(item => item !== service) : [...exclude, service]}); |
||||
}; |
||||
|
||||
useEffect(() => { |
||||
apiFetch({path : "/wp-social-icons/items"}).then(response => { |
||||
setItems(response); |
||||
}).catch(error => console.error("ERR", error)); |
||||
}, []); |
||||
|
||||
return ( |
||||
<section {...useBlockProps()}> |
||||
<InspectorControls> |
||||
<PanelBody title="Active Services" initialOpen={true}> |
||||
{iterator.map(item => ( |
||||
<PanelRow> |
||||
<ToggleControl label={<><span className={`wpsi-${item.key}`} style={{fontSize : "1.2rem", verticalAlign : "middle", marginRight : "0.5rem"}}></span> <span style={{verticalAlign : "middle"}}>{item.key}</span></>} checked={!exclude.includes(item.key)} onChange={() => excludeService(item.key)} /> |
||||
</PanelRow> |
||||
))} |
||||
</PanelBody> |
||||
</InspectorControls> |
||||
<BlockControls> |
||||
<ToolbarGroup> |
||||
<ToolbarButton isActive={orientation === "horizontal"} icon={justifyCenter} onClick={() => setAttributes({ orientation : "horizontal"})} /> |
||||
<ToolbarButton isActive={orientation === "vertical"} icon={justifyCenterVertical} title="wdwdwd" onClick={() => setAttributes({orientation : "vertical"})} /> |
||||
</ToolbarGroup> |
||||
<ToolbarGroup> |
||||
<ToolbarButton isActive={alignment === "left"} icon={alignLeft} title="align left" onClick={() => setAttributes({alignment : "left"})} /> |
||||
<ToolbarButton isActive={alignment === "center"} icon={alignCenter} title="align center" onClick={() => setAttributes({alignment : "center"})} /> |
||||
<ToolbarButton isActive={alignment === "right"} icon={alignRight} title="align right" onClick={() => setAttributes({alignment : "right"})} /> |
||||
</ToolbarGroup> |
||||
</BlockControls> |
||||
{activeItems.length < 1 ? |
||||
<section>No elements</section> : |
||||
<nav className={`wpsi-menu ${orientation} align-${alignment}`}> |
||||
{activeItems.map(item => <a href={item.value}><span className={`wpsi wpsi-${item.key}`}></span></a>)} |
||||
</nav> |
||||
} |
||||
</section> |
||||
); |
||||
}; |
||||
|
||||
export default Edit; |
||||
@ -0,0 +1,28 @@ |
||||
.wpsi-menu { |
||||
padding: 2rem 0; |
||||
} |
||||
.wpsi-menu a { |
||||
text-decoration: none; |
||||
} |
||||
.wpsi-menu.align-left { |
||||
text-align: left; |
||||
} |
||||
.wpsi-menu.align-center { |
||||
text-align: center; |
||||
} |
||||
.wpsi-menu.align-right { |
||||
text-align: right; |
||||
} |
||||
.wpsi-menu.horizontal a:not(:last-of-type) { |
||||
margin-right: 2rem; |
||||
} |
||||
.wpsi-menu.vertical a { |
||||
display: block; |
||||
} |
||||
.wpsi-menu.vertical a:not(:last-of-type) { |
||||
margin-bottom: 2rem; |
||||
} |
||||
.wpsi-menu .wpsi { |
||||
font-size: 2rem; |
||||
color: #333; |
||||
}/*# sourceMappingURL=editor.css.map */ |
||||
@ -0,0 +1 @@ |
||||
{"version":3,"sources":["editor.scss","editor.css"],"names":[],"mappings":"AAAA;EACC,eAAA;ACCD;ADCC;EACC,qBAAA;ACCF;ADEC;EACC,gBAAA;ACAF;ADEC;EACC,kBAAA;ACAF;ADEC;EACC,iBAAA;ACAF;ADKG;EACC,kBAAA;ACHJ;ADSE;EACC,cAAA;ACPH;ADSG;EACC,mBAAA;ACPJ;ADYC;EACC,eAAA;EACA,WAAA;ACVF","file":"editor.css"} |
||||
@ -0,0 +1,40 @@ |
||||
.wpsi-menu { |
||||
padding: 2rem 0; |
||||
|
||||
a { |
||||
text-decoration: none; |
||||
} |
||||
|
||||
&.align-left { |
||||
text-align: left; |
||||
} |
||||
&.align-center { |
||||
text-align: center; |
||||
} |
||||
&.align-right { |
||||
text-align: right; |
||||
} |
||||
|
||||
&.horizontal { |
||||
a { |
||||
&:not(:last-of-type) { |
||||
margin-right: 2rem; |
||||
} |
||||
} |
||||
} |
||||
|
||||
&.vertical { |
||||
a { |
||||
display: block; |
||||
|
||||
&:not(:last-of-type) { |
||||
margin-bottom: 2rem; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.wpsi { |
||||
font-size: 2rem; |
||||
color: #333; |
||||
} |
||||
} |
||||
@ -0,0 +1,10 @@ |
||||
import {registerBlockType} from "@wordpress/blocks"; |
||||
|
||||
import Edit from "./edit"; |
||||
import metadata from "./block.json"; |
||||
|
||||
import "./style.scss"; |
||||
|
||||
registerBlockType(metadata.name, { |
||||
edit : Edit |
||||
} ); |
||||
@ -0,0 +1,11 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
use wpsocialicons\Settings; |
||||
|
||||
["exclude" => $exclude, "orientation" => $orientation, "alignment" => $alignment] = $attributes ?? []; |
||||
$services = array_filter((array) Settings::Services(), fn ($value, $key) => !in_array($key, $exclude), ARRAY_FILTER_USE_BOTH); |
||||
|
||||
the_wp_social_icons([ |
||||
"exclude" => $exclude, |
||||
"container_class" => "wp-social-icons $orientation align-$alignment", |
||||
]); |
||||
@ -0,0 +1,33 @@ |
||||
import {useBlockProps} from "@wordpress/block-editor"; |
||||
|
||||
import {useState, useEffect, useMemo} from "@wordpress/element"; |
||||
import apiFetch from "@wordpress/api-fetch"; |
||||
|
||||
export default function save({attributes}) { |
||||
/* |
||||
const [items, setItems] = useState([]); |
||||
|
||||
useEffect(() => { |
||||
apiFetch({path : "/wp-social-icons/items"}).then(response => { |
||||
console.log("RES", response); |
||||
|
||||
setItems(response); |
||||
}).catch(error => console.error("ERR", error)); |
||||
}, []); |
||||
*/ |
||||
const {orientation, alignment} = attributes; |
||||
const props = useBlockProps.save(); |
||||
console.log("SAVE PROPS", attributes); |
||||
|
||||
return ( |
||||
<></> |
||||
); |
||||
|
||||
return ( |
||||
<p> |
||||
<nav className={`wpsi-menu ${orientation} align-${alignment}`}> |
||||
{activeItems.map(item => <a href={item.value}><span className={`wpsi wpsi-${item.key}`}></span></a>)} |
||||
</nav> |
||||
</p> |
||||
); |
||||
} |
||||
@ -0,0 +1,33 @@ |
||||
.wp-block-create-block-wpsi-menu { |
||||
background-color: #21759b; |
||||
color: #fff; |
||||
padding: 2px; |
||||
} |
||||
|
||||
nav.wp-social-icons { |
||||
display: flex; |
||||
padding: 2rem 0; |
||||
gap: 2rem; |
||||
align-items: center; |
||||
} |
||||
nav.wp-social-icons > a .wpsi { |
||||
font-size: 1.8rem; |
||||
} |
||||
nav.wp-social-icons.align-center { |
||||
justify-content: center; |
||||
} |
||||
nav.wp-social-icons.align-left { |
||||
justify-content: flex-start; |
||||
} |
||||
nav.wp-social-icons.align-right { |
||||
justify-content: flex-end; |
||||
} |
||||
nav.wp-social-icons.vertical { |
||||
flex-direction: column; |
||||
} |
||||
nav.wp-social-icons.vertical.align-left { |
||||
align-items: flex-start; |
||||
} |
||||
nav.wp-social-icons.vertical.align-right { |
||||
align-items: flex-end; |
||||
}/*# sourceMappingURL=style.css.map */ |
||||
@ -0,0 +1 @@ |
||||
{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"AAAA;EACC,yBAAA;EACA,WAAA;EACA,YAAA;ACCD;;ADEA;EACC,aAAA;EACA,eAAA;EACA,SAAA;EACA,mBAAA;ACCD;ADEE;EACC,iBAAA;ACAH;ADIC;EACC,uBAAA;ACFF;ADKC;EACC,2BAAA;ACHF;ADMC;EACC,yBAAA;ACJF;ADOC;EACC,sBAAA;ACLF;ADOE;EACC,uBAAA;ACLH;ADQE;EACC,qBAAA;ACNH","file":"style.css"} |
||||
@ -0,0 +1,42 @@ |
||||
.wp-block-create-block-wpsi-menu { |
||||
background-color: #21759b; |
||||
color: #fff; |
||||
padding: 2px; |
||||
} |
||||
|
||||
nav.wp-social-icons { |
||||
display: flex; |
||||
padding: 2rem 0; |
||||
gap: 2rem; |
||||
align-items: center; |
||||
|
||||
> a { |
||||
.wpsi { |
||||
font-size: 1.8rem; |
||||
} |
||||
} |
||||
|
||||
&.align-center { |
||||
justify-content: center; |
||||
} |
||||
|
||||
&.align-left { |
||||
justify-content: flex-start; |
||||
} |
||||
|
||||
&.align-right { |
||||
justify-content: flex-end; |
||||
} |
||||
|
||||
&.vertical { |
||||
flex-direction: column; |
||||
|
||||
&.align-left { |
||||
align-items: flex-start; |
||||
} |
||||
|
||||
&.align-right { |
||||
align-items: flex-end; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,42 @@ |
||||
const $ = selector => { |
||||
const elements = document.querySelectorAll(selector); |
||||
|
||||
return elements.length === 1 ? elements[0] : elements; |
||||
}; |
||||
|
||||
const Services = {}; |
||||
|
||||
const SaveServices = () => { |
||||
const body = new FormData(); |
||||
body.append("nonce", wpsi.nonce); |
||||
body.append("action", "wpsi-ajax"); |
||||
body.append("services", JSON.stringify(Services)); |
||||
|
||||
fetch(wpsi.adminURL, { |
||||
method : "POST", |
||||
body |
||||
}).catch(error => console.error(error)); |
||||
}; |
||||
|
||||
document.addEventListener("DOMContentLoaded", () => { |
||||
inputs = $(".wpsi-icon-selector"); |
||||
|
||||
for (const input of inputs) { |
||||
if (!(input instanceof HTMLElement)) |
||||
continue; |
||||
const service = input.getAttribute("data-icon"); |
||||
if (!service || service === "") |
||||
continue;
|
||||
const value = input.value; |
||||
|
||||
if (value && value !== "") |
||||
Services[service] = value; |
||||
if (value === "") |
||||
delete Services[service]; |
||||
|
||||
input.addEventListener("change", event => { |
||||
Services[service] = event.target.value;
|
||||
SaveServices();
|
||||
}); |
||||
} |
||||
}); |
||||
@ -0,0 +1,23 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons; |
||||
|
||||
class Backend { |
||||
public function __construct() { |
||||
add_action("admin_enqueue_scripts", [$this, "loadScripts"]); |
||||
} |
||||
|
||||
public function loadScripts() : void { |
||||
$folder = trim(plugin_dir_url(dirname(__FILE__)), "/"); |
||||
|
||||
wp_enqueue_style("wp-social-icons-font", "$folder/fonts/wp-social-icons/style.css"); |
||||
wp_enqueue_style("wp-social-icons-admin", "$folder/css/wp-social-icons.css"); |
||||
|
||||
wp_enqueue_script("wp-social-icons-admin", "$folder/javascript/wp-social-icons-admin.js", []); |
||||
|
||||
wp_localize_script("wp-social-icons-admin", "wpsi", [ |
||||
"adminURL" => admin_url("admin-ajax.php"), |
||||
"nonce" => wp_create_nonce("wpsi-nonce") |
||||
]); |
||||
} |
||||
} |
||||
@ -0,0 +1,26 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons; |
||||
|
||||
use WP_REST_Request; |
||||
|
||||
class Blocks { |
||||
public function __construct(private Settings $settings) { |
||||
add_action("init", [$this, "registerBlocks"]); |
||||
add_action("rest_api_init", [$this, "registerAPIRoute"]); |
||||
} |
||||
|
||||
public function registerBlocks() : void { |
||||
register_block_type(dirname(__FILE__)."/../javascript/blocks/wpsi-menu/build"); |
||||
} |
||||
|
||||
public function registerAPIRoute() : void { |
||||
register_rest_route("wp-social-icons", "/items", [ |
||||
"methods" => "GET", |
||||
"permission_callback" => "__return_true", |
||||
"callback" => function (WP_REST_Request $_) : ?array { |
||||
return (array) $this->settings->get(); |
||||
} |
||||
]); |
||||
} |
||||
} |
||||
@ -0,0 +1,66 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons { |
||||
|
||||
class Frontend { |
||||
private const DEFAULT_ARGS = [ |
||||
"container_class" => "wp-social-icons", |
||||
"container" => "nav", |
||||
"before" => "", |
||||
"after" => "", |
||||
"icon_before" => "", |
||||
"icon_after" => "", |
||||
"exclude" => [] |
||||
]; |
||||
public function __construct(private Settings $settings) { |
||||
add_action("wp_enqueue_scripts", [$this, "enqueueFont"]); |
||||
} |
||||
|
||||
public function enqueueFont() : void { |
||||
wp_enqueue_style("wp-social-icons", plugin_dir_url(dirname(__FILE__))."/fonts/wp-social-icons/style.css"); |
||||
} |
||||
|
||||
public static function MenuMarkup(array $args = []) : string { |
||||
$args = array_merge(self::DEFAULT_ARGS, $args); |
||||
$container = $args["container"]; |
||||
$containerClass = $args["container_class"]; |
||||
$before = $args["before"]; |
||||
$after = $args["after"]; |
||||
$iconBefore = $args["icon_before"]; |
||||
$iconAfter = $args["icon_after"]; |
||||
$exclude = $args["exclude"]; |
||||
|
||||
$out = "<$container class='$containerClass'>"; |
||||
$services = Settings::Services(); |
||||
|
||||
foreach ($services as $service => $url) { |
||||
if (in_array($service, $exclude)) |
||||
continue; |
||||
|
||||
$out .= sprintf( |
||||
"$before<a href='%s' class='wp-social-icon-link'>$iconBefore<span class='wpsi wpsi-%s'></span>$iconAfter</a>$after\n", |
||||
$url, |
||||
$service |
||||
); |
||||
} |
||||
$out .= "</$container>"; |
||||
|
||||
return $out; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
namespace { |
||||
|
||||
use wpsocialicons\Frontend; |
||||
|
||||
function get_the_wp_social_icons(array $args = []) : string { |
||||
return Frontend::MenuMarkup($args); |
||||
} |
||||
|
||||
function the_wp_social_icons(array $args = []) : void { |
||||
echo get_the_wp_social_icons($args); |
||||
} |
||||
|
||||
} |
||||
@ -0,0 +1,55 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons; |
||||
|
||||
use wpsocialicons\Backend; |
||||
use wpsocialicons\Blocks; |
||||
use wpsocialicons\Frontend; |
||||
use wpsocialicons\Settings; |
||||
|
||||
class Plugin { |
||||
const OPTIONS_KEY = "wpsi-services"; |
||||
|
||||
private Backend $backend; |
||||
private Blocks $blocks; |
||||
private Frontend $frontend; |
||||
private Settings $settings; |
||||
|
||||
public readonly array $available; |
||||
|
||||
public function __construct() { |
||||
spl_autoload_register([$this, "autoload"]); |
||||
$this->loadAvailable(); |
||||
|
||||
$this->settings = new Settings($this); |
||||
$this->backend = new Backend(); |
||||
$this->blocks = new Blocks($this->settings); |
||||
$this->frontend = new Frontend($this->settings); |
||||
} |
||||
|
||||
public function autoload(string $className) : void { |
||||
$className = str_replace("\\", "/", str_replace("wpsocialicons\\", "", $className)); |
||||
$src = dirname(__FILE__)."/$className.php"; |
||||
|
||||
if (file_exists($src)) |
||||
require_once($src); |
||||
} |
||||
|
||||
private function loadAvailable() : void { |
||||
$source = dirname(__FILE__)."/../fonts/wp-social-icons/selection.json"; |
||||
|
||||
if (!file_exists($source)) |
||||
return; |
||||
|
||||
$content = file_get_contents($source); |
||||
|
||||
if (!$content) |
||||
return; |
||||
|
||||
$json = json_decode($content); |
||||
$available = array_map(fn ($item) => $item->properties->name, $json->icons); |
||||
sort($available); |
||||
|
||||
$this->available = $available; |
||||
} |
||||
} |
||||
@ -0,0 +1,82 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons; |
||||
|
||||
class Settings { |
||||
private readonly ?object $currentServices; |
||||
|
||||
public function __construct(private Plugin $root) { |
||||
add_action("admin_menu", [$this, "addMenuPage"]); |
||||
add_action("wp_ajax_wpsi-ajax", [$this, "ajax"]); |
||||
|
||||
$this->currentServices = self::Services(); |
||||
} |
||||
|
||||
public function addMenuPage() : void { |
||||
add_submenu_page( |
||||
"themes.php", |
||||
__("Social Icons", "wpsocialicons"), |
||||
__("Social Icons", "wpsocialicons"), |
||||
"manage_options", |
||||
"wp-social-icons", |
||||
[$this, "renderSettingsPage"] |
||||
); |
||||
} |
||||
|
||||
public function renderSettingsPage() : void { |
||||
global $_wp_admin_css_colors; |
||||
$template = new Template("settings"); |
||||
$icons = ""; |
||||
|
||||
$accentColor = $_wp_admin_css_colors[get_user_option("admin_color")]->colors[2]; |
||||
printf(" |
||||
<style> |
||||
.wpsi-icons { |
||||
--wpsi-accent-color: %s |
||||
} |
||||
</style> |
||||
", $accentColor); |
||||
|
||||
foreach ($this->root->available as $icon) { |
||||
$value = $this->currentServices->$icon ?? ""; |
||||
$icons .= sprintf( |
||||
"<article class=icon> |
||||
<span class='wpsi wpsi-%s'></span> |
||||
<span class=name>%s</span> |
||||
<input class=wpsi-icon-selector data-icon=%s placeholder='https://' type=text name=wpsi-link-%s value='%s' /> |
||||
</article>", |
||||
$icon, |
||||
ucfirst($icon), |
||||
$icon, |
||||
$icon, |
||||
$value |
||||
); |
||||
} |
||||
|
||||
echo $template->render([ |
||||
"icons" => $icons |
||||
]); |
||||
} |
||||
|
||||
public function get() : ?object { |
||||
return $this->currentServices; |
||||
} |
||||
|
||||
public function ajax() : void { |
||||
if (!wp_verify_nonce($_POST["nonce"], "wpsi-nonce") || !current_user_can("manage_options")) |
||||
wp_die("Unauthorized access"); |
||||
|
||||
// NOTE: here we pass the result to a filter before saving, in case |
||||
// someone needs to do something useful with the information |
||||
// submitted. The filter is called |
||||
// "wpsi_save_services" |
||||
$value = json_decode(html_entity_decode(stripslashes($_POST["services"]))); |
||||
$services = json_encode(apply_filters("wpsi_save_services", $value)); |
||||
|
||||
update_option(Plugin::OPTIONS_KEY, $services); |
||||
} |
||||
|
||||
public static function Services() : ?object { |
||||
return json_decode(html_entity_decode(stripslashes(get_option(Plugin::OPTIONS_KEY, "{}")))); |
||||
} |
||||
} |
||||
@ -0,0 +1,23 @@ |
||||
<?php declare(strict_types=1); |
||||
|
||||
namespace wpsocialicons; |
||||
|
||||
class Template { |
||||
private string $template; |
||||
|
||||
public function __construct(string $templateName) { |
||||
$this->template = file_get_contents(dirname(__FILE__)."/../views/$templateName.html"); |
||||
} |
||||
|
||||
public function render(array $context, bool $echo = false) : string { |
||||
$out = $this->template; |
||||
|
||||
foreach ($context as $key => $value) |
||||
$out = str_replace(sprintf("{{%s}}", $key), $value, $out); |
||||
|
||||
if ($echo) |
||||
echo $out; |
||||
|
||||
return $out; |
||||
} |
||||
} |
||||
@ -0,0 +1,44 @@ |
||||
./.DS_Store |
||||
./css/wp-social-icons.css |
||||
./.gitignore |
||||
./javascript/blocks/wpsi-menu/package-lock.json |
||||
./javascript/blocks/wpsi-menu/package.json |
||||
./javascript/blocks/wpsi-menu/build/block.json |
||||
./javascript/blocks/wpsi-menu/build/index.asset.php |
||||
./javascript/blocks/wpsi-menu/build/index.js |
||||
./javascript/blocks/wpsi-menu/build/index.css |
||||
./javascript/blocks/wpsi-menu/build/style-index.css.map |
||||
./javascript/blocks/wpsi-menu/build/index.css.map |
||||
./javascript/blocks/wpsi-menu/build/index.js.map |
||||
./javascript/blocks/wpsi-menu/build/render.php |
||||
./javascript/blocks/wpsi-menu/build/index-rtl.css |
||||
./javascript/blocks/wpsi-menu/build/style-index.css |
||||
./javascript/blocks/wpsi-menu/build/style-index-rtl.css |
||||
./javascript/blocks/wpsi-menu/src/block.json |
||||
./javascript/blocks/wpsi-menu/src/editor.css |
||||
./javascript/blocks/wpsi-menu/src/edit.js |
||||
./javascript/blocks/wpsi-menu/src/style.css.map |
||||
./javascript/blocks/wpsi-menu/src/editor.scss |
||||
./javascript/blocks/wpsi-menu/src/save.js |
||||
./javascript/blocks/wpsi-menu/src/index.js |
||||
./javascript/blocks/wpsi-menu/src/style.scss |
||||
./javascript/blocks/wpsi-menu/src/style.css |
||||
./javascript/blocks/wpsi-menu/src/render.php |
||||
./javascript/blocks/wpsi-menu/src/editor.css.map |
||||
./javascript/wp-social-icons-admin.js |
||||
./fonts/.DS_Store |
||||
./fonts/wp-social-icons/.DS_Store |
||||
./fonts/wp-social-icons/style.css |
||||
./fonts/wp-social-icons/selection.json |
||||
./fonts/wp-social-icons/fonts/.DS_Store |
||||
./fonts/wp-social-icons/fonts/WP-Social-Icons.ttf |
||||
./fonts/wp-social-icons/fonts/WP-Social-Icons.svg |
||||
./fonts/wp-social-icons/fonts/WP-Social-Icons.woff |
||||
./views/settings.html |
||||
./src/Blocks.php |
||||
./src/Settings.php |
||||
./src/Plugin.php |
||||
./src/Backend.php |
||||
./src/Template.php |
||||
./src/Frontend.php |
||||
./wp-social-icons.php |
||||
@ -0,0 +1,10 @@ |
||||
<section class=wrap> |
||||
<h1>WP Social Icons</h1> |
||||
<p> |
||||
Just add the corresponding URL to your social media account to the |
||||
field below the service you want to activate. |
||||
</p> |
||||
<section class="wpsi-icons"> |
||||
{{icons}} |
||||
</section> |
||||
</section> |
||||
@ -0,0 +1,17 @@ |
||||
<?php |
||||
/* |
||||
* Plugin Name: WP Social Icons |
||||
* Description: A plugin for displaying social media links with icons on your WordPress website |
||||
* Author: Mike Ochmann <miko@massivedynamic.eu> |
||||
* Author URI: https://mike-ochmann.de |
||||
* License: MIT |
||||
* Text Domain: wpsocialicons |
||||
* Domain Path: /lang |
||||
* Version: 0.0.1 |
||||
*/ |
||||
|
||||
require_once("src/Plugin.php"); |
||||
|
||||
use wpsocialicons\Plugin; |
||||
|
||||
new Plugin; |
||||
Loading…
Reference in new issue