itmar-block-packages 1.6.2 → 1.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "itmar-block-packages",
-  "version": "1.6.2",
+  "version": "1.7.0",
   "description": "We have put together a package of common React components used for WordPress custom blocks.",
   "main": "build/index.js",
   "scripts": {

package/src/AnimationBlock.js

@@ -29,11 +29,11 @@ export default function AnimationBlock(props) {
   return (
     <>
       <PanelBody
-        title={__("Animation Setting", "itmar-block-packages")}
+        title={__("Animation Setting", "block-collections")}
         initialOpen={true}
       >
         <ToggleControl
-          label={__("Is Animation", "itmar-block-packages")}
+          label={__("Is Animation", "block-collections")}
           checked={is_anime}
           onChange={(newVal) => {
             props.onChange({ is_anime: newVal });
@@ -43,7 +43,7 @@ export default function AnimationBlock(props) {
           <>
             <div className="itmar_link_type">
               <RadioControl
-                label={__("Animation Pattern", "itmar-block-packages")}
+                label={__("Animation Pattern", "block-collections")}
                 selected={anime_prm.pattern}
                 options={[
                   { label: "flipDown", value: "flipDown" },
@@ -61,7 +61,7 @@ export default function AnimationBlock(props) {
 
             <RangeControl
               value={anime_prm.duration}
-              label={__("Animation duration time", "itmar-block-packages")}
+              label={__("Animation duration time", "block-collections")}
               max={5}
               min={0}
               onChange={(val) => {
@@ -73,7 +73,7 @@ export default function AnimationBlock(props) {
 
             <RangeControl
               value={anime_prm.delay}
-              label={__("Animation delay time", "itmar-block-packages")}
+              label={__("Animation delay time", "block-collections")}
               max={3}
               min={0}
               onChange={(val) => {
@@ -85,15 +85,15 @@ export default function AnimationBlock(props) {
 
             <div className="itmar_link_type">
               <RadioControl
-                label={__("Animation Trigger", "itmar-block-packages")}
+                label={__("Animation Trigger", "block-collections")}
                 selected={anime_prm.trigger}
                 options={[
                   {
-                    label: __("Page Opend", "itmar-block-packages"),
+                    label: __("Page Opend", "block-collections"),
                     value: "opend",
                   },
                   {
-                    label: __("Enter Visible", "itmar-block-packages"),
+                    label: __("Enter Visible", "block-collections"),
                     value: "visible",
                   },
                 ]}

package/src/BlockPlace.js

@@ -66,20 +66,20 @@ export default function BlockPlace(props) {
   //ツールチップの選択
   const start_tip =
     sel_pos.direction === "vertical"
-      ? __("upper alignment", "itmar-block-packages")
-      : __("left alignment", "itmar-block-packages");
+      ? __("upper alignment", "block-collections")
+      : __("left alignment", "block-collections");
   const end_tip =
     sel_pos.direction === "vertical"
-      ? __("lower alignment", "itmar-block-packages")
-      : __("right alignment", "itmar-block-packages");
+      ? __("lower alignment", "block-collections")
+      : __("right alignment", "block-collections");
   const cross_start_tip =
     sel_pos.direction === "vertical"
-      ? __("left alignment", "itmar-block-packages")
-      : __("upper alignment", "itmar-block-packages");
+      ? __("left alignment", "block-collections")
+      : __("upper alignment", "block-collections");
   const cross_end_tip =
     sel_pos.direction === "vertical"
-      ? __("right alignment", "itmar-block-packages")
-      : __("lower alignment", "itmar-block-packages");
+      ? __("right alignment", "block-collections")
+      : __("lower alignment", "block-collections");
 
   const [isContainer, setIsContainer] = useState(false);
   const [direction, setDirection] = useState("row");
@@ -123,14 +123,14 @@ export default function BlockPlace(props) {
   // 翻訳が必要な文字列を直接指定
   const blockMaxWidthMobile = __(
     "Block Max Width(Mobile)",
-    "itmar-block-packages"
+    "block-collections"
   );
-  const blockWidthMobile = __("Block Width(Mobile)", "itmar-block-packages");
+  const blockWidthMobile = __("Block Width(Mobile)", "block-collections");
   const blockMaxWidthDesktop = __(
     "Block Max Width(DeskTop)",
-    "itmar-block-packages"
+    "block-collections"
   );
-  const blockWidthDesktop = __("Block Width(DeskTop)", "itmar-block-packages");
+  const blockWidthDesktop = __("Block Width(DeskTop)", "block-collections");
 
   // 条件に応じて選択
   const blockWidthLabel = isMobile
@@ -144,14 +144,14 @@ export default function BlockPlace(props) {
   return (
     <>
       <PanelBody
-        title={__("Block placement", "itmar-block-packages")}
+        title={__("Block placement", "block-collections")}
         initialOpen={false}
         className="itmar_group_direction"
       >
         {isMobile ? (
-          <p>{__("InnerBlock direction(Mobile)", "itmar-block-packages")}</p>
+          <p>{__("InnerBlock direction(Mobile)", "block-collections")}</p>
         ) : (
-          <p>{__("InnerBlock direction(DeskTop)", "itmar-block-packages")}</p>
+          <p>{__("InnerBlock direction(DeskTop)", "block-collections")}</p>
         )}
 
         <ToolbarGroup>
@@ -162,7 +162,7 @@ export default function BlockPlace(props) {
                 isPressed={sel_pos.direction === "block"}
                 onClick={() => props.onDirectionChange("block")}
                 icon={group}
-                label={__("block", "itmar-block-packages")}
+                label={__("block", "block-collections")}
               />
             )}
           </ToolbarItem>
@@ -173,7 +173,7 @@ export default function BlockPlace(props) {
                 isPressed={sel_pos.direction === "vertical"}
                 onClick={() => props.onDirectionChange("vertical")}
                 icon={stack}
-                label={__("virtical", "itmar-block-packages")}
+                label={__("virtical", "block-collections")}
               />
             )}
           </ToolbarItem>
@@ -184,7 +184,7 @@ export default function BlockPlace(props) {
                 isPressed={sel_pos.direction === "horizen"}
                 onClick={() => props.onDirectionChange("horizen")}
                 icon={flex}
-                label={__("horizen", "itmar-block-packages")}
+                label={__("horizen", "block-collections")}
               />
             )}
           </ToolbarItem>
@@ -195,7 +195,7 @@ export default function BlockPlace(props) {
                 isPressed={sel_pos.direction === "grid"}
                 onClick={() => props.onDirectionChange("grid")}
                 icon={layout}
-                label={__("grid", "itmar-block-packages")}
+                label={__("grid", "block-collections")}
               />
             )}
           </ToolbarItem>
@@ -203,12 +203,12 @@ export default function BlockPlace(props) {
             sel_pos.direction === "vertical") && (
             <PanelRow className="position_row">
               <ToggleControl
-                label={__("reverse", "itmar-block-packages")}
+                label={__("reverse", "block-collections")}
                 checked={sel_pos.reverse}
                 onChange={(checked) => props.onReverseChange(checked)}
               />
               <ToggleControl
-                label={__("wrap", "itmar-block-packages")}
+                label={__("wrap", "block-collections")}
                 checked={sel_pos.wrap}
                 onChange={(checked) => props.onWrapChange(checked)}
               />
@@ -219,13 +219,9 @@ export default function BlockPlace(props) {
         {sel_pos.direction !== "block" && sel_pos.direction !== "grid" && (
           <>
             {isMobile ? (
-              <p>
-                {__("InnerBlock Main Axis(Mobile)", "itmar-block-packages")}
-              </p>
+              <p>{__("InnerBlock Main Axis(Mobile)", "block-collections")}</p>
             ) : (
-              <p>
-                {__("InnerBlock Main Axis(DeskTop)", "itmar-block-packages")}
-              </p>
+              <p>{__("InnerBlock Main Axis(DeskTop)", "block-collections")}</p>
             )}
             <ToolbarGroup>
               <ToolbarItem>
@@ -248,7 +244,7 @@ export default function BlockPlace(props) {
                     isPressed={sel_pos.inner_align === "center"}
                     onClick={() => props.onFlexChange("center", "inner_align")} //親コンポーネントに通知
                     icon={center_icon}
-                    label={__("center alignment", "itmar-block-packages")}
+                    label={__("center alignment", "block-collections")}
                   />
                 )}
               </ToolbarItem>
@@ -274,7 +270,7 @@ export default function BlockPlace(props) {
                       props.onFlexChange("space-between", "inner_align")
                     } //親コンポーネントに通知
                     icon={between_icon}
-                    label={__("beteen stretch", "itmar-block-packages")}
+                    label={__("beteen stretch", "block-collections")}
                   />
                 )}
               </ToolbarItem>
@@ -287,7 +283,7 @@ export default function BlockPlace(props) {
                       props.onFlexChange("space-around", "inner_align")
                     } //親コンポーネントに通知
                     icon={around_icon}
-                    label={__("around stretch", "itmar-block-packages")}
+                    label={__("around stretch", "block-collections")}
                   />
                 )}
               </ToolbarItem>
@@ -297,11 +293,9 @@ export default function BlockPlace(props) {
 
         {!isSubmenu &&
           (isMobile ? (
-            <p>{__("InnerBlock Cross Axis(Mobile)", "itmar-block-packages")}</p>
+            <p>{__("InnerBlock Cross Axis(Mobile)", "block-collections")}</p>
           ) : (
-            <p>
-              {__("InnerBlock Cross Axis(DeskTop)", "itmar-block-packages")}
-            </p>
+            <p>{__("InnerBlock Cross Axis(DeskTop)", "block-collections")}</p>
           ))}
 
         {!isSubmenu && (
@@ -326,7 +320,7 @@ export default function BlockPlace(props) {
                   isPressed={sel_pos.inner_items === "center"}
                   onClick={() => props.onFlexChange("center", "inner_items")} //親コンポーネントに通知
                   icon={center_cross}
-                  label={__("center alignment", "itmar-block-packages")}
+                  label={__("center alignment", "block-collections")}
                 />
               )}
             </ToolbarItem>
@@ -346,12 +340,10 @@ export default function BlockPlace(props) {
         {isContainer && (
           <>
             {isMobile ? (
-              <p>
-                {__("Alignment in container(Mobile)", "itmar-block-packages")}
-              </p>
+              <p>{__("Alignment in container(Mobile)", "block-collections")}</p>
             ) : (
               <p>
-                {__("Alignment in container(DeskTop)", "itmar-block-packages")}
+                {__("Alignment in container(DeskTop)", "block-collections")}
               </p>
             )}
 
@@ -373,8 +365,8 @@ export default function BlockPlace(props) {
                     icon={direction === "row" ? upper : justifyLeft}
                     label={
                       direction === "row"
-                        ? __("upper alignment", "itmar-block-packages")
-                        : __("left alignment", "itmar-block-packages")
+                        ? __("upper alignment", "block-collections")
+                        : __("left alignment", "block-collections")
                     }
                   />
                 )}
@@ -394,7 +386,7 @@ export default function BlockPlace(props) {
                         : () => props.onAlignChange("center")
                     }
                     icon={direction === "row" ? middle : justifyCenter}
-                    label={__("center alignment", "itmar-block-packages")}
+                    label={__("center alignment", "block-collections")}
                   />
                 )}
               </ToolbarItem>
@@ -415,8 +407,8 @@ export default function BlockPlace(props) {
                     icon={direction === "row" ? lower : justifyRight}
                     label={
                       direction === "row"
-                        ? __("lower alignment", "itmar-block-packages")
-                        : __("right alignment", "itmar-block-packages")
+                        ? __("lower alignment", "block-collections")
+                        : __("right alignment", "block-collections")
                     }
                   />
                 )}
@@ -445,12 +437,12 @@ export default function BlockPlace(props) {
         {sel_pos.direction === "grid" && (
           <>
             {isMobile ? (
-              <p>{__("Grid Info settings(Mobile)", "itmar-block-packages")}</p>
+              <p>{__("Grid Info settings(Mobile)", "block-collections")}</p>
             ) : (
-              <p>{__("Grid Info settings(DeskTop)", "itmar-block-packages")}</p>
+              <p>{__("Grid Info settings(DeskTop)", "block-collections")}</p>
             )}
             <Button variant="primary" onClick={openGridModal}>
-              {__("Open Setting Modal", "itmar-block-packages")}
+              {__("Open Setting Modal", "block-collections")}
             </Button>
             {isGridModalOpen && (
               <Modal title="Grid Info settings" onRequestClose={closeGridModal}>
@@ -467,20 +459,20 @@ export default function BlockPlace(props) {
         )}
         <div className="itmar_title_type">
           <RadioControl
-            label={__("Position Type", "itmar-block-packages")}
+            label={__("Position Type", "block-collections")}
             selected={positionType}
             options={[
-              { label: __("Static", "itmar-block-packages"), value: "staic" },
+              { label: __("Static", "block-collections"), value: "staic" },
               {
-                label: __("Relative", "itmar-block-packages"),
+                label: __("Relative", "block-collections"),
                 value: "relative",
               },
               {
-                label: __("Absolute", "itmar-block-packages"),
+                label: __("Absolute", "block-collections"),
                 value: "absolute",
               },
-              { label: __("Fix", "itmar-block-packages"), value: "fixed" },
-              { label: __("Sticky", "itmar-block-packages"), value: "sticky" },
+              { label: __("Fix", "block-collections"), value: "fixed" },
+              { label: __("Sticky", "block-collections"), value: "sticky" },
             ]}
             onChange={(newVal) => {
               props.onPositionChange(newVal);
@@ -491,7 +483,7 @@ export default function BlockPlace(props) {
           <ToggleControl
             label={__(
               "Center Vertically and Horizontally",
-              "itmar-block-packages"
+              "block-collections"
             )}
             checked={isPosCenter}
             onChange={(newVal) => {
@@ -504,12 +496,12 @@ export default function BlockPlace(props) {
           positionType === "sticky") && (
           <>
             {isMobile ? (
-              <p>{__("Block Position(Mobile)", "itmar-block-packages")}</p>
+              <p>{__("Block Position(Mobile)", "block-collections")}</p>
             ) : (
-              <p>{__("Block Position(DeskTop)", "itmar-block-packages")}</p>
+              <p>{__("Block Position(DeskTop)", "block-collections")}</p>
             )}
             <PanelBody
-              title={__("Vertical", "itmar-block-packages")}
+              title={__("Vertical", "block-collections")}
               initialOpen={true}
             >
               {!sel_pos.posValue?.isVertCenter && (
@@ -543,7 +535,7 @@ export default function BlockPlace(props) {
               )}
               {!isParallax && (
                 <ToggleControl
-                  label={__("Is Center", "itmar-block-packages")}
+                  label={__("Is Center", "block-collections")}
                   checked={sel_pos.posValue?.isVertCenter}
                   onChange={(newValue) => {
                     const newValObj = {
@@ -557,7 +549,7 @@ export default function BlockPlace(props) {
             </PanelBody>
 
             <PanelBody
-              title={__("Horizon", "itmar-block-packages")}
+              title={__("Horizon", "block-collections")}
               initialOpen={true}
             >
               {!sel_pos.posValue?.isHorCenter && (
@@ -591,7 +583,7 @@ export default function BlockPlace(props) {
               )}
               {!isParallax && (
                 <ToggleControl
-                  label={__("Is Center", "itmar-block-packages")}
+                  label={__("Is Center", "block-collections")}
                   checked={sel_pos.posValue?.isHorCenter}
                   onChange={(newValue) => {
                     const newValObj = {
@@ -620,14 +612,14 @@ export function BlockWidth(props) {
   // 翻訳が必要な文字列を直接指定
   const blockMaxWidthMobile = __(
     "Block Max Width(Mobile)",
-    "itmar-block-packages"
+    "block-collections"
   );
-  const blockWidthMobile = __("Block Width(Mobile)", "itmar-block-packages");
+  const blockWidthMobile = __("Block Width(Mobile)", "block-collections");
   const blockMaxWidthDesktop = __(
     "Block Max Width(DeskTop)",
-    "itmar-block-packages"
+    "block-collections"
   );
-  const blockWidthDesktop = __("Block Width(DeskTop)", "itmar-block-packages");
+  const blockWidthDesktop = __("Block Width(DeskTop)", "block-collections");
 
   // ラベル
   const widthLabel = isMobile ? blockWidthMobile : blockWidthDesktop;
@@ -663,7 +655,7 @@ export function BlockWidth(props) {
               isPressed={sel_pos.width_val === "wideSize"}
               onClick={() => props.onWidthChange("width_val", "wideSize")}
               icon={stretchWide}
-              label={__("Wide Size", "itmar-block-packages")}
+              label={__("Wide Size", "block-collections")}
             />
           )}
         </ToolbarItem>
@@ -674,7 +666,7 @@ export function BlockWidth(props) {
               isPressed={sel_pos.width_val === "contentSize"}
               onClick={() => props.onWidthChange("width_val", "contentSize")}
               icon={positionCenter}
-              label={__("Content Size", "itmar-block-packages")}
+              label={__("Content Size", "block-collections")}
             />
           )}
         </ToolbarItem>
@@ -728,7 +720,7 @@ export function BlockWidth(props) {
               isPressed={sel_pos.max_width === "wideSize"}
               onClick={() => props.onWidthChange("max_width", "wideSize")}
               icon={stretchWide}
-              label={__("Wide Size", "itmar-block-packages")}
+              label={__("Wide Size", "block-collections")}
             />
           )}
         </ToolbarItem>
@@ -739,7 +731,7 @@ export function BlockWidth(props) {
               isPressed={sel_pos.max_width === "contentSize"}
               onClick={() => props.onWidthChange("max_width", "contentSize")}
               icon={positionCenter}
-              label={__("Content Size", "itmar-block-packages")}
+              label={__("Content Size", "block-collections")}
             />
           )}
         </ToolbarItem>
@@ -778,9 +770,9 @@ export function BlockHeight(props) {
   return (
     <>
       {isMobile ? (
-        <p>{__("Block Height(Mobile)", "itmar-block-packages")}</p>
+        <p>{__("Block Height(Mobile)", "block-collections")}</p>
       ) : (
-        <p>{__("Block Height(DeskTop)", "itmar-block-packages")}</p>
+        <p>{__("Block Height(DeskTop)", "block-collections")}</p>
       )}
       <ToolbarGroup>
         <ToolbarItem>

package/src/DateElm.js

@@ -88,14 +88,14 @@ export const PeriodCtrl = ({
 }) => {
   return (
     <PanelBody
-      title={__("Period Setting", "itmar-block-packages")}
+      title={__("Period Setting", "block-collections")}
       initialOpen={true}
       className="form_setteing_ctrl"
     >
-      <label>{__("Start of period", "itmar-block-packages")}</label>
+      <label>{__("Start of period", "block-collections")}</label>
       <PanelRow className="itmar_date_span">
         <NumberControl
-          label={__("Year", "itmar-block-packages")}
+          label={__("Year", "block-collections")}
           labelPosition="side"
           max={endYear}
           min={startYear}
@@ -112,7 +112,7 @@ export const PeriodCtrl = ({
         />
         {isMonth && (
           <NumberControl
-            label={__("Month", "itmar-block-packages")}
+            label={__("Month", "block-collections")}
             labelPosition="side"
             max={12}
             min={1}
@@ -129,10 +129,10 @@ export const PeriodCtrl = ({
           />
         )}
       </PanelRow>
-      <label>{__("End of period", "itmar-block-packages")}</label>
+      <label>{__("End of period", "block-collections")}</label>
       <PanelRow className="itmar_date_span">
         <NumberControl
-          label={__("Year", "itmar-block-packages")}
+          label={__("Year", "block-collections")}
           labelPosition="side"
           max={endYear}
           min={startYear}
@@ -148,7 +148,7 @@ export const PeriodCtrl = ({
           value={dateSpan.endYear}
         />
         <NumberControl
-          label={__("Month", "itmar-block-packages")}
+          label={__("Month", "block-collections")}
           labelPosition="side"
           max={12}
           min={1}

package/src/DraggableBox.js

@@ -115,26 +115,26 @@ export default function DraggableBox(props) {
   return (
     <>
       <PanelBody
-        title={__("Position Setting", "itmar-block-packages")}
+        title={__("Position Setting", "block-collections")}
         initialOpen={true}
       >
         <PanelRow className="distance_row">
           <UnitControl
             dragDirection="e"
             onChange={(value) => chagePosition(value, "x")}
-            label={__("Vertical", "itmar-block-packages")}
+            label={__("Vertical", "block-collections")}
             value={position?.x || 0}
           />
           <UnitControl
             dragDirection="e"
             onChange={(value) => chagePosition(value, "y")}
-            label={__("Horizen", "itmar-block-packages")}
+            label={__("Horizen", "block-collections")}
             value={position?.y || 0}
           />
         </PanelRow>
         <PanelRow className="reset_row">
           <Button variant="secondary" onClick={() => resetPos()}>
-            {__("Reset", "itmar-block-packages")}
+            {__("Reset", "block-collections")}
           </Button>
         </PanelRow>
       </PanelBody>