@npm_leadtech/legal-lib-components 2.6.8 → 2.6.10

package/dist/esm/legal-lib-components.css

@@ -2390,6 +2390,9 @@
   @media (min-width: 720px) {
     .top-bar-wrapper {
       display: block; } }
+  @media (max-width: 575px) {
+    .top-bar-wrapper {
+      display: block; } }
   .top-bar-wrapper .top-bar {
     display: flex;
     background-color: #F8F9FA;
@@ -2400,10 +2403,19 @@
     justify-content: center;
     align-items: flex-end;
     border: 1px solid #DBE1E5; }
+    @media (max-width: 575px) {
+      .top-bar-wrapper .top-bar {
+        align-items: center; } }
     .top-bar-wrapper .top-bar-content {
       margin: 0 1rem 5px; }
-      .top-bar-wrapper .top-bar-content svg {
+      @media (max-width: 575px) {
+        .top-bar-wrapper .top-bar-content {
+          margin: 0; } }
+      .top-bar-wrapper .top-bar-content svg, .top-bar-wrapper .top-bar-content img {
         vertical-align: middle; }
+      .top-bar-wrapper .top-bar-content img {
+        margin-right: 8px;
+        display: inherit; }
 
 .bottom-overlay-menu {
   display: flex;
@@ -2426,6 +2438,38 @@
   .bottom-overlay-menu ul li {
     margin-bottom: 0; }
 
+.top-bar-mobile {
+  background-color: #F3F7FA;
+  display: flex;
+  padding: 8px 16px;
+  justify-content: space-between;
+  align-items: center;
+  border-radius: 4px;
+  box-shadow: 0px 2px 6px 0px rgba(2, 55, 74, 0.25);
+  font-size: 14px;
+  line-height: 18px;
+  letter-spacing: -0.3px;
+  position: fixed;
+  top: 8px;
+  left: 8px;
+  right: 8px; }
+  .top-bar-mobile.fade-In {
+    visibility: visible;
+    opacity: 1;
+    transition: visibility 0s linear 0s, opacity 300ms; }
+  .top-bar-mobile.fade-Out {
+    visibility: hidden;
+    opacity: 0;
+    transition: visibility 0s linear 300ms, opacity 300ms; }
+  .top-bar-mobile > b {
+    display: flex;
+    justify-content: center;
+    align-items: center; }
+    .top-bar-mobile > b a {
+      display: contents; }
+    .top-bar-mobile > b img {
+      margin-right: 8px; }
+
 .article {
   display: flex;
   flex-flow: row wrap;
@@ -3635,4 +3679,4 @@
     font-weight: 400;
     line-height: 42px;
     letter-spacing: -0.3px;
-    margin-bottom: 1rem; }
+    margin: 1rem 0; }

package/dist/esm/src/components/atoms/TopBarMobile/TopBarMobile.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import './TopBarMobile.scss';
+interface TopBarMobileProps {
+    children: React.ReactNode;
+    isVisible: boolean;
+}
+export declare const TopBarMobile: React.FC<TopBarMobileProps>;
+export {};

package/dist/esm/src/components/atoms/TopBarMobile/__stories__/TopBarMobile.stories.d.ts

@@ -0,0 +1,7 @@
+import { type Meta, type StoryObj } from '@storybook/react';
+import { TopBarMobile } from '../TopBarMobile';
+declare const meta: Meta<typeof TopBarMobile>;
+export default meta;
+type Story = StoryObj<typeof TopBarMobile>;
+export declare const Default: Story;
+export declare const Big: Story;

package/dist/esm/src/components/atoms/TopBarMobile/index.d.ts

@@ -0,0 +1 @@
+export { TopBarMobile } from './TopBarMobile';

package/dist/esm/src/components/atoms/index.d.ts

@@ -31,3 +31,4 @@ export * from './Toggle';
 export * from './Tooltip';
 export * from './TopBar';
 export * from './BottomOverlayMenu';
+export * from './TopBarMobile';

package/dist/esm/src/hooks/index.d.ts

@@ -0,0 +1 @@
+export { useIntersectionObserver } from './useIntersectionObserver';

package/dist/esm/src/hooks/useIntersectionObserver.d.ts

@@ -1,2 +1,5 @@
 import { type RefObject } from 'react';
-export declare function useIntersectionObserver(options?: {}): [RefObject<HTMLDivElement>, boolean];
+export declare function useIntersectionObserver({ options, defaultIntersecting }: {
+    options?: {} | undefined;
+    defaultIntersecting?: boolean | undefined;
+}): [RefObject<HTMLDivElement | HTMLHeadElement>, boolean];

package/dist/esm/src/index.d.ts

@@ -2,3 +2,4 @@ export * from './components/atoms';
 export * from './components/molecules';
 export * from './components/organisms';
 export * from './components/sections';
+export * from './hooks';

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import React$1, { FC, Component, ReactNode, MouseEventHandler } from 'react';
+import React$1, { FC, Component, ReactNode, MouseEventHandler, RefObject } from 'react';
 import { IGatsbyImageData } from 'gatsby-plugin-image';
 
 interface AddButtonProps {
@@ -388,6 +388,12 @@ interface BottomOverlayMenuProps {
 
 declare const BottomOverlayMenu: FC<BottomOverlayMenuProps>;
 
+interface TopBarMobileProps {
+    children: React$1.ReactNode;
+    isVisible: boolean;
+}
+declare const TopBarMobile: React$1.FC<TopBarMobileProps>;
+
 interface ArticleProps {
     imageUrl: string;
     title: string;
@@ -708,4 +714,9 @@ interface AsSeeInSectionProps {
 
 declare const AsSeeInSection: FC<AsSeeInSectionProps>;
 
-export { AboutUsContent, AboutUsContentProps, AboutUsSection, AboutUsSectionProps, AddButton, AddButtonProps, Article, ArticleProps, ArticlesList, ArticlesListProps, AsSeeInContent, AsSeeInContentProps, AsSeeInSection, AsSeeInSectionProps, BaseBox, BaseBoxList, BaseBoxListProps, BaseBoxProps, BillCard, BillCardProps, BlogSection, BlogSectionProps, BottomFixedBar, BottomFixedBarProps, BottomOverlay, BottomOverlayMenu, BottomOverlayMenuProps, BottomOverlayProps, BoxForm, BoxFormProps, BreadcrumItem, BreadcrumItemProps, Breadcrumb, BreadcrumbProps, Button, ButtonIcon, ButtonIconProps, ButtonProps, CardPane, CardPaneInfoProps, CardPaneProps, Checkbox, CheckboxProps, ContactBox, ContactBoxProps, DatePickerCustom, DatePickerCustomProps, DialogMenuIcon, DialogMenuIconProps, Disclaimer, DisclaimerProps, Divider, DividerProps, DocumentStatus, DocumentStatusProps, Feedback, FeedbackProps, FormFaq, FormFaqProps, GoogleButton, GoogleButtonProps, GuidelinesContent, GuidelinesContentProps, GuidelinesSection, GuidelinesSectionProps, HowGetYourFormsSection, HowGetYourFormsSectionProps, IconImage, IconImageProps, ImageStructure, InfoBox, InfoBoxProps, ListStepsGetForm, ListStepsGetFormProps, LogoText, LogoTextProps, MenuItemProps, MenuItems, MenuItemsSection, MenuItemsSectionProps, Message, MessageProps, MobileBottomBar, MobileBottomBarProps, NavBarDropDown, NavBarDropDownProps, Pagination, PaginationProps, PaypalButton, PaypalButtonProps, PricingCard, PricingCardProps, ProgressBar, ProgressBarProps, Radio, RadioProps, RemoveButton, RemoveButtonProps, RichTextInner, RichTextInnerProps, SearchSelect, SearchSelectProps, SideMenuTabProps, SidemenuTab, Snackbar, SnackbarProps, Spinner, SpinnerProps, StepGetForm, StepGetFormProps, TextArea, TextAreaProps, TextInput, TextInputProps, Toggle, ToggleProps, Tooltip, TooltipMenu, TooltipMenuProps, TooltipProps, TopBar, TopBarProps, TrustworthyWebsites, TrustworthyWebsitesProps, TryOurFreeLegalBlogsContent, TryOurFreeLegalBlogsContentProps, TryOurFreeLegalBlogsSection, TryOurFreeLegalBlogsSectionProps };
+declare function useIntersectionObserver({ options, defaultIntersecting }: {
+    options?: {} | undefined;
+    defaultIntersecting?: boolean | undefined;
+}): [RefObject<HTMLDivElement | HTMLHeadElement>, boolean];
+
+export { AboutUsContent, AboutUsContentProps, AboutUsSection, AboutUsSectionProps, AddButton, AddButtonProps, Article, ArticleProps, ArticlesList, ArticlesListProps, AsSeeInContent, AsSeeInContentProps, AsSeeInSection, AsSeeInSectionProps, BaseBox, BaseBoxList, BaseBoxListProps, BaseBoxProps, BillCard, BillCardProps, BlogSection, BlogSectionProps, BottomFixedBar, BottomFixedBarProps, BottomOverlay, BottomOverlayMenu, BottomOverlayMenuProps, BottomOverlayProps, BoxForm, BoxFormProps, BreadcrumItem, BreadcrumItemProps, Breadcrumb, BreadcrumbProps, Button, ButtonIcon, ButtonIconProps, ButtonProps, CardPane, CardPaneInfoProps, CardPaneProps, Checkbox, CheckboxProps, ContactBox, ContactBoxProps, DatePickerCustom, DatePickerCustomProps, DialogMenuIcon, DialogMenuIconProps, Disclaimer, DisclaimerProps, Divider, DividerProps, DocumentStatus, DocumentStatusProps, Feedback, FeedbackProps, FormFaq, FormFaqProps, GoogleButton, GoogleButtonProps, GuidelinesContent, GuidelinesContentProps, GuidelinesSection, GuidelinesSectionProps, HowGetYourFormsSection, HowGetYourFormsSectionProps, IconImage, IconImageProps, ImageStructure, InfoBox, InfoBoxProps, ListStepsGetForm, ListStepsGetFormProps, LogoText, LogoTextProps, MenuItemProps, MenuItems, MenuItemsSection, MenuItemsSectionProps, Message, MessageProps, MobileBottomBar, MobileBottomBarProps, NavBarDropDown, NavBarDropDownProps, Pagination, PaginationProps, PaypalButton, PaypalButtonProps, PricingCard, PricingCardProps, ProgressBar, ProgressBarProps, Radio, RadioProps, RemoveButton, RemoveButtonProps, RichTextInner, RichTextInnerProps, SearchSelect, SearchSelectProps, SideMenuTabProps, SidemenuTab, Snackbar, SnackbarProps, Spinner, SpinnerProps, StepGetForm, StepGetFormProps, TextArea, TextAreaProps, TextInput, TextInputProps, Toggle, ToggleProps, Tooltip, TooltipMenu, TooltipMenuProps, TooltipProps, TopBar, TopBarMobile, TopBarProps, TrustworthyWebsites, TrustworthyWebsitesProps, TryOurFreeLegalBlogsContent, TryOurFreeLegalBlogsContentProps, TryOurFreeLegalBlogsSection, TryOurFreeLegalBlogsSectionProps, useIntersectionObserver };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@npm_leadtech/legal-lib-components",
-  "version": "2.6.8",
+  "version": "2.6.10",
   "dependencies": {
     "@testing-library/jest-dom": "^5.16.5",
     "@tippyjs/react": "4.2.6",