@redneckz/wildless-cms-uni-blocks 0.14.310 → 0.14.311

package/mobile/src/components/OfficesAtmsMap/renderAtmCard.tsx

@@ -50,7 +50,9 @@ export const renderAtmCard = (
             </div>
           ) : null}
         </div>
-        <Badge color="green">{capitalizedFirstLetter(workTime)}</Badge>
+        <div className="whitespace-nowrap">
+          <Badge color="green">{capitalizedFirstLetter(workTime)}</Badge>
+        </div>
       </div>
       <div className="hidden sm:block">
         <CardRow className="flex-wrap">{additionalInfo?.map(renderInfo)}</CardRow>

package/mobile/src/components/OfficesAtmsMap/renderFiltrationForm.tsx

@@ -28,8 +28,10 @@ const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb
 export const renderFiltrationForm = (
   filters: string[],
   { field, reset }: { field: FormFieldRegisterer<any>; reset: () => void },
-  visibleFiltersNum = 3,
+  onlyOffice?: boolean,
 ) => {
+  const visibleFiltersNum = onlyOffice ? 3 : 4;
+
   const filtersCheckbox = (filters || []).map((key) => (
     <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
   ));
@@ -43,21 +45,17 @@ export const renderFiltrationForm = (
     <div>
       {filters?.length ? (
         <div>
-          {hiddenFilters.length > 0 ? (
-            <Foldable
-              renderFoldableSection={({ isUnfolded }) => (
-                <div>
-                  <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
-                  <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
-                    {hiddenFilters}
-                  </FoldableSection>
-                </div>
-              )}
-              renderFoldButton={renderFoldButton(reset)}
-            />
-          ) : (
-            <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
-          )}
+          <Foldable
+            renderFoldableSection={({ isUnfolded }) => (
+              <div>
+                <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+                <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
+                  {hiddenFilters}
+                </FoldableSection>
+              </div>
+            )}
+            renderFoldButton={renderFoldButton(reset, onlyOffice)}
+          />
         </div>
       ) : null}
     </div>
@@ -65,20 +63,22 @@ export const renderFiltrationForm = (
 };
 
 export const renderFoldButton =
-  (reset: () => void) =>
+  (reset: () => void, onlyOffice?: boolean) =>
   ({ isUnfolded, onToggle }: FoldablePartProps) => {
     const labels = ['Больше фильтров', 'Меньше фильтров'];
     const icons: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
 
     return (
-      <div className="flex">
-        <LinkButton
-          version="transparent"
-          className="text-secondary-text [&>*]:p-0 mr-lg"
-          appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
-          text={labels[Number(isUnfolded)]}
-          onClick={onToggle}
-        />
+      <div className="flex space-x-lg">
+        {onlyOffice ? (
+          <LinkButton
+            version="transparent"
+            className="text-secondary-text [&>*]:p-0"
+            appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
+            text={labels[Number(isUnfolded)]}
+            onClick={onToggle}
+          />
+        ) : null}
         <LinkButton
           version="transparent"
           className="text-secondary-text [&>*]:p-0"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redneckz/wildless-cms-uni-blocks",
-  "version": "0.14.310",
+  "version": "0.14.311",
   "private": false,
   "license": "MIT",
   "author": "ЦК",

package/src/components/OfficesAtmsMap/Badge.tsx

@@ -19,7 +19,7 @@ export interface BadgeProps {
 export const Badge = JSX<BadgeProps>(({ className, children, color = 'gray' }) => (
   <div
     className={style(
-      'sm:p-s sm:border sm:border-gray rounded-md flex items-center',
+      'sm:p-s sm:border sm:border-green rounded-md flex items-center',
       colorStyle[color].border,
       className,
     )}

package/src/components/OfficesAtmsMap/OfficesAtmsMap.example.json

@@ -1,6 +1,26 @@
-{
-  "content": {
-    "version": "primary",
-    "padding": ""
-  }
-}
+[
+  [
+    "Офисы",
+    {
+      "content": {
+        "version": "primary",
+        "padding": "",
+        "data": {
+          "dataType": "offices"
+        }
+      }
+    }
+  ],
+  [
+    "Банкоматы",
+    {
+      "content": {
+        "version": "primary",
+        "padding": "",
+        "data": {
+          "dataType": "atms"
+        }
+      }
+    }
+  ]
+]

package/src/components/OfficesAtmsMap/OfficesAtmsMapLayout.tsx

@@ -45,6 +45,8 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
     descriptionData,
     title,
   }) => {
+    const onlyOffice = title?.includes('Офис');
+
     const [filtrationState, { field, reset }] = useForm(initFilterState);
 
     const [filteredItems, points, lengthItems] = useMemo(() => {
@@ -73,9 +75,9 @@ export const OfficesAtmsMapLayout = JSX<OfficesAtmsMapLayoutProps<Branch | Atm>>
               ) : null}
             </div>
             {descriptionData ? renderDescriptionBlock(descriptionData) : null}
-            {renderButtonsGroup(data, activeButton, setActiveButton)}
+            {onlyOffice && renderButtonsGroup(data, activeButton, setActiveButton)}
             <div className={style('pb-2xl', filtersVisibleStyles(activeButton))}>
-              {renderFiltrationForm(Object.keys(initFilterState), { field, reset })}
+              {renderFiltrationForm(Object.keys(initFilterState), { field, reset }, onlyOffice)}
             </div>
           </div>
           <div className="h-[600px]">

package/src/components/OfficesAtmsMap/renderAtmCard.tsx

@@ -50,7 +50,9 @@ export const renderAtmCard = (
             </div>
           ) : null}
         </div>
-        <Badge color="green">{capitalizedFirstLetter(workTime)}</Badge>
+        <div className="whitespace-nowrap">
+          <Badge color="green">{capitalizedFirstLetter(workTime)}</Badge>
+        </div>
       </div>
       <div className="hidden sm:block">
         <CardRow className="flex-wrap">{additionalInfo?.map(renderInfo)}</CardRow>

package/src/components/OfficesAtmsMap/renderFiltrationForm.tsx

@@ -28,8 +28,10 @@ const COMMON_FILTERS_STYLES = 'flex flex-col sm:flex-row sm:flex-wrap gap-3xl pb
 export const renderFiltrationForm = (
   filters: string[],
   { field, reset }: { field: FormFieldRegisterer<any>; reset: () => void },
-  visibleFiltersNum = 3,
+  onlyOffice?: boolean,
 ) => {
+  const visibleFiltersNum = onlyOffice ? 3 : 4;
+
   const filtersCheckbox = (filters || []).map((key) => (
     <Checkbox key={key} text={FILTRATION_LABELS[key]} {...field(key)} />
   ));
@@ -43,21 +45,17 @@ export const renderFiltrationForm = (
     <div>
       {filters?.length ? (
         <div>
-          {hiddenFilters.length > 0 ? (
-            <Foldable
-              renderFoldableSection={({ isUnfolded }) => (
-                <div>
-                  <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
-                  <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
-                    {hiddenFilters}
-                  </FoldableSection>
-                </div>
-              )}
-              renderFoldButton={renderFoldButton(reset)}
-            />
-          ) : (
-            <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
-          )}
+          <Foldable
+            renderFoldableSection={({ isUnfolded }) => (
+              <div>
+                <div className={COMMON_FILTERS_STYLES}>{visibleFilters}</div>
+                <FoldableSection className={COMMON_FILTERS_STYLES} isUnfolded={isUnfolded}>
+                  {hiddenFilters}
+                </FoldableSection>
+              </div>
+            )}
+            renderFoldButton={renderFoldButton(reset, onlyOffice)}
+          />
         </div>
       ) : null}
     </div>
@@ -65,20 +63,22 @@ export const renderFiltrationForm = (
 };
 
 export const renderFoldButton =
-  (reset: () => void) =>
+  (reset: () => void, onlyOffice?: boolean) =>
   ({ isUnfolded, onToggle }: FoldablePartProps) => {
     const labels = ['Больше фильтров', 'Меньше фильтров'];
     const icons: IconName[] = ['ArrowDownIcon', 'ArrowUpIcon'];
 
     return (
-      <div className="flex">
-        <LinkButton
-          version="transparent"
-          className="text-secondary-text [&>*]:p-0 mr-lg"
-          appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
-          text={labels[Number(isUnfolded)]}
-          onClick={onToggle}
-        />
+      <div className="flex space-x-lg">
+        {onlyOffice ? (
+          <LinkButton
+            version="transparent"
+            className="text-secondary-text [&>*]:p-0"
+            appendRight={<Icon name={icons[Number(isUnfolded)]} width="16" height="16" />}
+            text={labels[Number(isUnfolded)]}
+            onClick={onToggle}
+          />
+        ) : null}
         <LinkButton
           version="transparent"
           className="text-secondary-text [&>*]:p-0"