@next-degree/pickle-shared-js 0.6.47 → 0.6.50

package/dist/{shared_pickle_output_latest-CxZJXPOS.d.ts → shared_pickle_output_latest-_L9GxVle.d.ts}

@@ -1,6 +1,6 @@
 import { z } from 'zod';
 
-declare const TypeEnum: z.ZodEnum<["MONETARY_AMOUNT"]>;
+declare const TypeEnum: z.ZodEnum<["IMAGE"]>;
 declare const DetailLevelEnum: z.ZodEnum<["COUNTRY", "GEO", "LOCALITY", "POSTAL_CODE", "REGION"]>;
 declare const UnitTextEnum: z.ZodEnum<["DAY", "HOUR", "MONTH", "PER_ACTIVITY", "WEEK", "YEAR"]>;
 declare const CurrencyEnum: z.ZodEnum<["EUR", "GBP", "USD"]>;
@@ -11,22 +11,28 @@ declare const postalAddressSchema: z.ZodObject<{
     addressRegion: z.ZodOptional<z.ZodString>;
     addressLocality: z.ZodOptional<z.ZodString>;
     streetAddress: z.ZodOptional<z.ZodString>;
+    streetNumber: z.ZodOptional<z.ZodString>;
     postalCode: z.ZodOptional<z.ZodString>;
+    description: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     type: string;
     version: "1.0.0";
     addressCountry: string;
+    description?: string | undefined;
     addressRegion?: string | undefined;
     addressLocality?: string | undefined;
     streetAddress?: string | undefined;
+    streetNumber?: string | undefined;
     postalCode?: string | undefined;
 }, {
     type: string;
     addressCountry: string;
     version?: "1.0.0" | undefined;
+    description?: string | undefined;
     addressRegion?: string | undefined;
     addressLocality?: string | undefined;
     streetAddress?: string | undefined;
+    streetNumber?: string | undefined;
     postalCode?: string | undefined;
 }>;
 type PostalAddressModel = z.infer<typeof postalAddressSchema>;
@@ -42,22 +48,28 @@ declare const placeSchema: z.ZodObject<{
         addressRegion: z.ZodOptional<z.ZodString>;
         addressLocality: z.ZodOptional<z.ZodString>;
         streetAddress: z.ZodOptional<z.ZodString>;
+        streetNumber: z.ZodOptional<z.ZodString>;
         postalCode: z.ZodOptional<z.ZodString>;
+        description: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
         type: string;
         version: "1.0.0";
         addressCountry: string;
+        description?: string | undefined;
         addressRegion?: string | undefined;
         addressLocality?: string | undefined;
         streetAddress?: string | undefined;
+        streetNumber?: string | undefined;
         postalCode?: string | undefined;
     }, {
         type: string;
         addressCountry: string;
         version?: "1.0.0" | undefined;
+        description?: string | undefined;
         addressRegion?: string | undefined;
         addressLocality?: string | undefined;
         streetAddress?: string | undefined;
+        streetNumber?: string | undefined;
         postalCode?: string | undefined;
     }>>;
 }, "strip", z.ZodTypeAny, {
@@ -66,9 +78,11 @@ declare const placeSchema: z.ZodObject<{
         type: string;
         version: "1.0.0";
         addressCountry: string;
+        description?: string | undefined;
         addressRegion?: string | undefined;
         addressLocality?: string | undefined;
         streetAddress?: string | undefined;
+        streetNumber?: string | undefined;
         postalCode?: string | undefined;
     } | undefined;
     detailLevel?: "COUNTRY" | "GEO" | "LOCALITY" | "POSTAL_CODE" | "REGION" | undefined;
@@ -79,9 +93,11 @@ declare const placeSchema: z.ZodObject<{
         type: string;
         addressCountry: string;
         version?: "1.0.0" | undefined;
+        description?: string | undefined;
         addressRegion?: string | undefined;
         addressLocality?: string | undefined;
         streetAddress?: string | undefined;
+        streetNumber?: string | undefined;
         postalCode?: string | undefined;
     } | undefined;
     version?: "1.0.0" | undefined;
@@ -99,8 +115,8 @@ declare const quantitativeValueSchema: z.ZodObject<{
     unitText: z.ZodEnum<["DAY", "HOUR", "MONTH", "PER_ACTIVITY", "WEEK", "YEAR"]>;
 }, "strip", z.ZodTypeAny, {
     type: string;
-    unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
     version: "1.0.0";
+    unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
     value?: number | undefined;
     minValue?: number | undefined;
     maxValue?: number | undefined;
@@ -128,8 +144,8 @@ declare const monetaryAmountSchema: z.ZodObject<{
         unitText: z.ZodEnum<["DAY", "HOUR", "MONTH", "PER_ACTIVITY", "WEEK", "YEAR"]>;
     }, "strip", z.ZodTypeAny, {
         type: string;
-        unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
         version: "1.0.0";
+        unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
         value?: number | undefined;
         minValue?: number | undefined;
         maxValue?: number | undefined;
@@ -147,16 +163,16 @@ declare const monetaryAmountSchema: z.ZodObject<{
     version: "1.0.0";
     value?: {
         type: string;
-        unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
         version: "1.0.0";
+        unitText: "DAY" | "HOUR" | "MONTH" | "PER_ACTIVITY" | "WEEK" | "YEAR";
         value?: number | undefined;
         minValue?: number | undefined;
         maxValue?: number | undefined;
     } | undefined;
-    currency?: "EUR" | "GBP" | "USD" | undefined;
     minValue?: number | undefined;
     maxValue?: number | undefined;
     singleValue?: number | undefined;
+    currency?: "EUR" | "GBP" | "USD" | undefined;
 }, {
     type: string;
     value?: {
@@ -167,28 +183,168 @@ declare const monetaryAmountSchema: z.ZodObject<{
         minValue?: number | undefined;
         maxValue?: number | undefined;
     } | undefined;
-    currency?: "EUR" | "GBP" | "USD" | undefined;
     version?: "1.0.0" | undefined;
     minValue?: number | undefined;
     maxValue?: number | undefined;
     singleValue?: number | undefined;
+    currency?: "EUR" | "GBP" | "USD" | undefined;
 }>;
 type MonetaryAmountModel = z.infer<typeof monetaryAmountSchema>;
+declare const imageAssetSchema: z.ZodObject<{
+    version: z.ZodDefault<z.ZodLiteral<"1.0.0">>;
+    altText: z.ZodOptional<z.ZodString>;
+    assetId: z.ZodOptional<z.ZodString>;
+    description: z.ZodOptional<z.ZodString>;
+    extension: z.ZodOptional<z.ZodString>;
+    label: z.ZodOptional<z.ZodString>;
+    mimeType: z.ZodOptional<z.ZodString>;
+    originalFilename: z.ZodOptional<z.ZodString>;
+    path: z.ZodOptional<z.ZodString>;
+    sha1Hash: z.ZodOptional<z.ZodString>;
+    size: z.ZodOptional<z.ZodNumber>;
+    title: z.ZodOptional<z.ZodString>;
+    uploadId: z.ZodOptional<z.ZodString>;
+    url: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    version: "1.0.0";
+    label?: string | undefined;
+    title?: string | undefined;
+    path?: string | undefined;
+    url?: string | undefined;
+    size?: number | undefined;
+    description?: string | undefined;
+    altText?: string | undefined;
+    assetId?: string | undefined;
+    extension?: string | undefined;
+    mimeType?: string | undefined;
+    originalFilename?: string | undefined;
+    sha1Hash?: string | undefined;
+    uploadId?: string | undefined;
+}, {
+    label?: string | undefined;
+    title?: string | undefined;
+    path?: string | undefined;
+    url?: string | undefined;
+    version?: "1.0.0" | undefined;
+    size?: number | undefined;
+    description?: string | undefined;
+    altText?: string | undefined;
+    assetId?: string | undefined;
+    extension?: string | undefined;
+    mimeType?: string | undefined;
+    originalFilename?: string | undefined;
+    sha1Hash?: string | undefined;
+    uploadId?: string | undefined;
+}>;
+type ImageAssetModel = z.infer<typeof imageAssetSchema>;
+declare const imageSchema: z.ZodObject<{
+    version: z.ZodDefault<z.ZodLiteral<"1.0.0">>;
+    type: z.ZodString;
+    asset: z.ZodOptional<z.ZodObject<{
+        version: z.ZodDefault<z.ZodLiteral<"1.0.0">>;
+        altText: z.ZodOptional<z.ZodString>;
+        assetId: z.ZodOptional<z.ZodString>;
+        description: z.ZodOptional<z.ZodString>;
+        extension: z.ZodOptional<z.ZodString>;
+        label: z.ZodOptional<z.ZodString>;
+        mimeType: z.ZodOptional<z.ZodString>;
+        originalFilename: z.ZodOptional<z.ZodString>;
+        path: z.ZodOptional<z.ZodString>;
+        sha1Hash: z.ZodOptional<z.ZodString>;
+        size: z.ZodOptional<z.ZodNumber>;
+        title: z.ZodOptional<z.ZodString>;
+        uploadId: z.ZodOptional<z.ZodString>;
+        url: z.ZodOptional<z.ZodString>;
+    }, "strip", z.ZodTypeAny, {
+        version: "1.0.0";
+        label?: string | undefined;
+        title?: string | undefined;
+        path?: string | undefined;
+        url?: string | undefined;
+        size?: number | undefined;
+        description?: string | undefined;
+        altText?: string | undefined;
+        assetId?: string | undefined;
+        extension?: string | undefined;
+        mimeType?: string | undefined;
+        originalFilename?: string | undefined;
+        sha1Hash?: string | undefined;
+        uploadId?: string | undefined;
+    }, {
+        label?: string | undefined;
+        title?: string | undefined;
+        path?: string | undefined;
+        url?: string | undefined;
+        version?: "1.0.0" | undefined;
+        size?: number | undefined;
+        description?: string | undefined;
+        altText?: string | undefined;
+        assetId?: string | undefined;
+        extension?: string | undefined;
+        mimeType?: string | undefined;
+        originalFilename?: string | undefined;
+        sha1Hash?: string | undefined;
+        uploadId?: string | undefined;
+    }>>;
+}, "strip", z.ZodTypeAny, {
+    type: string;
+    version: "1.0.0";
+    asset?: {
+        version: "1.0.0";
+        label?: string | undefined;
+        title?: string | undefined;
+        path?: string | undefined;
+        url?: string | undefined;
+        size?: number | undefined;
+        description?: string | undefined;
+        altText?: string | undefined;
+        assetId?: string | undefined;
+        extension?: string | undefined;
+        mimeType?: string | undefined;
+        originalFilename?: string | undefined;
+        sha1Hash?: string | undefined;
+        uploadId?: string | undefined;
+    } | undefined;
+}, {
+    type: string;
+    version?: "1.0.0" | undefined;
+    asset?: {
+        label?: string | undefined;
+        title?: string | undefined;
+        path?: string | undefined;
+        url?: string | undefined;
+        version?: "1.0.0" | undefined;
+        size?: number | undefined;
+        description?: string | undefined;
+        altText?: string | undefined;
+        assetId?: string | undefined;
+        extension?: string | undefined;
+        mimeType?: string | undefined;
+        originalFilename?: string | undefined;
+        sha1Hash?: string | undefined;
+        uploadId?: string | undefined;
+    } | undefined;
+}>;
+type ImageModel = z.infer<typeof imageSchema>;
 
 declare const shared_pickle_output_latest_CurrencyEnum: typeof CurrencyEnum;
 declare const shared_pickle_output_latest_DetailLevelEnum: typeof DetailLevelEnum;
+type shared_pickle_output_latest_ImageAssetModel = ImageAssetModel;
+type shared_pickle_output_latest_ImageModel = ImageModel;
 type shared_pickle_output_latest_MonetaryAmountModel = MonetaryAmountModel;
 type shared_pickle_output_latest_PlaceModel = PlaceModel;
 type shared_pickle_output_latest_PostalAddressModel = PostalAddressModel;
 type shared_pickle_output_latest_QuantitativeValueModel = QuantitativeValueModel;
 declare const shared_pickle_output_latest_TypeEnum: typeof TypeEnum;
 declare const shared_pickle_output_latest_UnitTextEnum: typeof UnitTextEnum;
+declare const shared_pickle_output_latest_imageAssetSchema: typeof imageAssetSchema;
+declare const shared_pickle_output_latest_imageSchema: typeof imageSchema;
 declare const shared_pickle_output_latest_monetaryAmountSchema: typeof monetaryAmountSchema;
 declare const shared_pickle_output_latest_placeSchema: typeof placeSchema;
 declare const shared_pickle_output_latest_postalAddressSchema: typeof postalAddressSchema;
 declare const shared_pickle_output_latest_quantitativeValueSchema: typeof quantitativeValueSchema;
 declare namespace shared_pickle_output_latest {
-  export { shared_pickle_output_latest_CurrencyEnum as CurrencyEnum, shared_pickle_output_latest_DetailLevelEnum as DetailLevelEnum, type shared_pickle_output_latest_MonetaryAmountModel as MonetaryAmountModel, type shared_pickle_output_latest_PlaceModel as PlaceModel, type shared_pickle_output_latest_PostalAddressModel as PostalAddressModel, type shared_pickle_output_latest_QuantitativeValueModel as QuantitativeValueModel, shared_pickle_output_latest_TypeEnum as TypeEnum, shared_pickle_output_latest_UnitTextEnum as UnitTextEnum, shared_pickle_output_latest_monetaryAmountSchema as monetaryAmountSchema, shared_pickle_output_latest_placeSchema as placeSchema, shared_pickle_output_latest_postalAddressSchema as postalAddressSchema, shared_pickle_output_latest_quantitativeValueSchema as quantitativeValueSchema };
+  export { shared_pickle_output_latest_CurrencyEnum as CurrencyEnum, shared_pickle_output_latest_DetailLevelEnum as DetailLevelEnum, type shared_pickle_output_latest_ImageAssetModel as ImageAssetModel, type shared_pickle_output_latest_ImageModel as ImageModel, type shared_pickle_output_latest_MonetaryAmountModel as MonetaryAmountModel, type shared_pickle_output_latest_PlaceModel as PlaceModel, type shared_pickle_output_latest_PostalAddressModel as PostalAddressModel, type shared_pickle_output_latest_QuantitativeValueModel as QuantitativeValueModel, shared_pickle_output_latest_TypeEnum as TypeEnum, shared_pickle_output_latest_UnitTextEnum as UnitTextEnum, shared_pickle_output_latest_imageAssetSchema as imageAssetSchema, shared_pickle_output_latest_imageSchema as imageSchema, shared_pickle_output_latest_monetaryAmountSchema as monetaryAmountSchema, shared_pickle_output_latest_placeSchema as placeSchema, shared_pickle_output_latest_postalAddressSchema as postalAddressSchema, shared_pickle_output_latest_quantitativeValueSchema as quantitativeValueSchema };
 }
 
-export { CurrencyEnum as C, DetailLevelEnum as D, type MonetaryAmountModel as M, type PostalAddressModel as P, type QuantitativeValueModel as Q, TypeEnum as T, UnitTextEnum as U, placeSchema as a, type PlaceModel as b, monetaryAmountSchema as m, postalAddressSchema as p, quantitativeValueSchema as q, shared_pickle_output_latest as s };
+export { CurrencyEnum as C, DetailLevelEnum as D, type ImageAssetModel as I, type MonetaryAmountModel as M, type PostalAddressModel as P, type QuantitativeValueModel as Q, TypeEnum as T, UnitTextEnum as U, placeSchema as a, type PlaceModel as b, imageSchema as c, type ImageModel as d, imageAssetSchema as i, monetaryAmountSchema as m, postalAddressSchema as p, quantitativeValueSchema as q, shared_pickle_output_latest as s };

package/dist/styles/globals.css

@@ -864,9 +864,6 @@ video {
 .m-1 {
   margin: 0.25rem;
 }
-.m-4 {
-  margin: 1rem;
-}
 .-mx-1 {
   margin-left: -0.25rem;
   margin-right: -0.25rem;
@@ -936,9 +933,6 @@ video {
 .h-16 {
   height: 4rem;
 }
-.h-24 {
-  height: 6rem;
-}
 .h-3 {
   height: 0.75rem;
 }
@@ -963,6 +957,9 @@ video {
 .h-\[36rem\] {
   height: 36rem;
 }
+.h-\[45px\] {
+  height: 45px;
+}
 .h-full {
   height: 100%;
 }
@@ -1054,9 +1051,15 @@ video {
 .max-w-xs {
   max-width: 20rem;
 }
+.flex-1 {
+  flex: 1 1 0%;
+}
 .shrink-0 {
   flex-shrink: 0;
 }
+.grow {
+  flex-grow: 1;
+}
 .translate-x-\[-50\%\] {
   --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1087,6 +1090,9 @@ video {
 .animate-spin {
   animation: spin 1s linear infinite;
 }
+.cursor-default {
+  cursor: default;
+}
 .cursor-pointer {
   cursor: pointer;
 }
@@ -1103,6 +1109,9 @@ video {
   -moz-appearance: none;
   appearance: none;
 }
+.grid-cols-1 {
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+}
 .flex-row {
   flex-direction: row;
 }
@@ -1202,6 +1211,10 @@ video {
 .rounded-xl {
   border-radius: 0.75rem;
 }
+.rounded-b-md {
+  border-bottom-right-radius: calc(var(--radius) - 2px);
+  border-bottom-left-radius: calc(var(--radius) - 2px);
+}
 .rounded-t-3xl {
   border-top-left-radius: 1.5rem;
   border-top-right-radius: 1.5rem;
@@ -1213,6 +1226,9 @@ video {
   border-top-width: 1px;
   border-bottom-width: 1px;
 }
+.border-b {
+  border-bottom-width: 1px;
+}
 .border-r {
   border-right-width: 1px;
 }
@@ -1309,6 +1325,9 @@ video {
 .p-4 {
   padding: 1rem;
 }
+.p-5 {
+  padding: 1.25rem;
+}
 .p-6 {
   padding: 1.5rem;
 }
@@ -1328,6 +1347,10 @@ video {
   padding-left: 1rem;
   padding-right: 1rem;
 }
+.px-5 {
+  padding-left: 1.25rem;
+  padding-right: 1.25rem;
+}
 .px-6 {
   padding-left: 1.5rem;
   padding-right: 1.5rem;
@@ -1401,6 +1424,13 @@ video {
   font-size: 1.5rem;
   line-height: 2rem;
 }
+.text-3xl {
+  font-size: 1.875rem;
+  line-height: 2.25rem;
+}
+.text-\[15px\] {
+  font-size: 15px;
+}
 .text-base {
   font-size: 1rem;
   line-height: 1.5rem;
@@ -1463,6 +1493,14 @@ video {
 .text-current {
   color: currentColor;
 }
+.text-gray-500 {
+  --tw-text-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
+}
+.text-gray-800 {
+  --tw-text-opacity: 1;
+  color: rgb(31 41 55 / var(--tw-text-opacity, 1));
+}
 .text-green-100 {
   color: hsla(164, 81%, 6%, 1);
 }
@@ -1495,6 +1533,13 @@ video {
 .text-purple-100 {
   color: hsla(253, 94%, 64%, 1);
 }
+.text-purple-80 {
+  color: hsla(253, 93%, 71%, 1);
+}
+.text-red-400 {
+  --tw-text-opacity: 1;
+  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
+}
 .text-red-600 {
   --tw-text-opacity: 1;
   color: rgb(220 38 38 / var(--tw-text-opacity, 1));
@@ -1864,6 +1909,9 @@ video {
   border-top-left-radius: calc(var(--radius) - 2px);
   border-bottom-left-radius: calc(var(--radius) - 2px);
 }
+.first\:rounded-tl-md:first-child {
+  border-top-left-radius: calc(var(--radius) - 2px);
+}
 .first\:border-l:first-child {
   border-left-width: 1px;
 }
@@ -1871,6 +1919,9 @@ video {
   border-top-right-radius: calc(var(--radius) - 2px);
   border-bottom-right-radius: calc(var(--radius) - 2px);
 }
+.last\:rounded-tr-md:last-child {
+  border-top-right-radius: calc(var(--radius) - 2px);
+}
 .hover\:border-grey-10:hover {
   border-color: hsla(0, 0%, 90%, 1);
 }
@@ -2049,6 +2100,9 @@ video {
   --tw-text-opacity: 1;
   color: rgb(23 23 23 / var(--tw-text-opacity, 1));
 }
+.data-\[state\=active\]\:text-purple-100[data-state=active] {
+  color: hsla(253, 94%, 64%, 1);
+}
 .data-\[state\=checked\]\:text-purple-100[data-state=checked] {
   color: hsla(253, 94%, 64%, 1);
 }
@@ -2065,6 +2119,18 @@ video {
 .data-\[disabled\=true\]\:opacity-50[data-disabled=true] {
   opacity: 0.5;
 }
+.data-\[state\=active\]\:shadow-\[inset_0_-1px_0_0\,0_1px_0_0\][data-state=active] {
+  --tw-shadow: inset 0 -1px 0 0,0 1px 0 0;
+  --tw-shadow-colored: inset 0 -1px 0 0 var(--tw-shadow-color), 0 1px 0 0 var(--tw-shadow-color);
+  box-shadow:
+    var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000),
+    var(--tw-shadow);
+}
+.data-\[state\=active\]\:shadow-current[data-state=active] {
+  --tw-shadow-color: currentColor;
+  --tw-shadow: var(--tw-shadow-colored);
+}
 .data-\[state\=open\]\:animate-in[data-state=open] {
   animation-name: enter;
   animation-duration: 150ms;
@@ -2119,6 +2185,21 @@ video {
 .data-\[state\=open\]\:slide-in-from-top-\[48\%\][data-state=open] {
   --tw-enter-translate-y: -48%;
 }
+.data-\[state\=active\]\:focus\:relative:focus[data-state=active] {
+  position: relative;
+}
+.data-\[state\=active\]\:focus\:shadow-\[0_0_0_2px\]:focus[data-state=active] {
+  --tw-shadow: 0 0 0 2px;
+  --tw-shadow-colored: 0 0 0 2px var(--tw-shadow-color);
+  box-shadow:
+    var(--tw-ring-offset-shadow, 0 0 #0000),
+    var(--tw-ring-shadow, 0 0 #0000),
+    var(--tw-shadow);
+}
+.data-\[state\=active\]\:focus\:shadow-black:focus[data-state=active] {
+  --tw-shadow-color: hsla(0, 0%, 0%, 1);
+  --tw-shadow: var(--tw-shadow-colored);
+}
 .data-\[placeholder\]\:disabled\:text-grey-40:disabled[data-placeholder] {
   color: hsla(0, 0%, 60%, 1);
 }
@@ -2228,9 +2309,15 @@ video {
   .md\:max-w-lg {
     max-width: 32rem;
   }
+  .md\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
   .md\:flex-row {
     flex-direction: row;
   }
+  .md\:gap-8 {
+    gap: 2rem;
+  }
   .md\:text-lg {
     font-size: 1.125rem;
     line-height: 1.75rem;
@@ -2243,6 +2330,9 @@ video {
   .lg\:min-h-32 {
     min-height: 8rem;
   }
+  .lg\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
 }
 .\[\&\:\:-webkit-search-cancel-button\]\:appearance-none::-webkit-search-cancel-button {
   -webkit-appearance: none;